All posts

2 min read

We built our admin panel with OGE UI

The buttons, data tables and form fields of the tuncsystem.com admin panel come from OGE UI, an open-source React component library made in Turkey. Why we chose it and how we use it safely.

The admin panel of this site (posts, messages, home management, server monitoring, customers…) is made of hundreds of screen parts. Instead of writing buttons, data tables and form fields from scratch, we used OGE UI, an open-source React component library made in Turkey. This post is a thank-you, and a small example of what to check before taking a library into a project.

Why OGE UI?

  • Built for business screens: data grid, tree list, forms, tabs, dialogs and upload in one family.
  • Works with React 18 and 19; we use React 19.
  • MIT licensed: every part we use is free software. (The pivot grid module is commercial; we do not use it.)
  • Themeable: it was easy to fit our panel's dark glass look.

The panel runs @oge-ui/react-buttons, @oge-ui/react-grid and @oge-ui/react-inputs today.

The security check before adding it

Adding a library means letting its author write code that runs inside your site. So we first installed it in a separate folder and looked:

  • No install scripts (preinstall / postinstall): nothing runs on your machine while it installs.
  • No third-party dependencies: the tree is OGE UI's own packages and React.
  • npm audit: 0 vulnerabilities.
  • No dangerous patterns in the code: no eval, new Function, hidden network calls or remote code loading. The only network request is the upload component's, to the address we pass in.
  • We even found a comment explaining a protection against formula injection in data exported to Excel - a good sign.

Our rules to keep the risk small

Even clean code carries the risk every npm package has: if the publishing account were ever taken over, a malicious version could be released. So:

  1. Pinned versions: the packages are locked at 1.1.2; a new release never arrives by itself.
  2. Review before upgrading: the difference between two versions (npm diff) is read and the check is run again.
  3. Panel only: the public pages never load OGE UI; the build checks it.
  4. The panel cannot talk to outsiders: its Content Security Policy allows connections to our own server only, so even a malicious library could not send data anywhere else.

Thank you

A ready, tidy and clean component library saved us weeks. Open-source projects from Turkey growing is good for all of us: if you want to try OGE UI, see ogeui.com and its GitHub page. Even a star or a bug report means a lot to an open-source developer.