@omg-dev/admin 0.4.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +126 -0
- package/dist/index.mjs +2 -0
- package/dist/react-COCR3YSL.mjs +1603 -0
- package/dist/server.mjs +50 -0
- package/dist/standalone.mjs +11 -0
- package/package.json +47 -0
- package/src/client.ts +278 -0
- package/src/index.ts +43 -0
- package/src/react.tsx +983 -0
- package/src/server.ts +83 -0
- package/src/standalone.tsx +25 -0
- package/src/styles.ts +200 -0
package/README.md
ADDED
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
# @omg-dev/admin
|
|
2
|
+
|
|
3
|
+
Embeddable internal admin console — a panel-registry React component
|
|
4
|
+
(**Feature Flags**, **Users**, **Reports**, and read-only **Pricing/Billing**)
|
|
5
|
+
that drops into any host as a single `<AdminConsole/>`. Host-agnostic: you pass
|
|
6
|
+
it where the control-plane lives and how to mint a bearer token; it does the
|
|
7
|
+
rest. Self-styled (no Tailwind dependency), and every endpoint it calls is
|
|
8
|
+
**admin-gated server-side**
|
|
9
|
+
(`requireAdmin` allowlist in the control-plane).
|
|
10
|
+
|
|
11
|
+
The same component is embedded in three places:
|
|
12
|
+
|
|
13
|
+
- the **omg dashboard** (`/admin` route),
|
|
14
|
+
- the **LFG** app (a `@vibes` SDK app), as a tab,
|
|
15
|
+
- **Inspect** (later — the per-app shell will mount it for platform admins).
|
|
16
|
+
|
|
17
|
+
## Embed (any host)
|
|
18
|
+
|
|
19
|
+
```tsx
|
|
20
|
+
import { AdminConsole } from "@omg-dev/admin";
|
|
21
|
+
|
|
22
|
+
<AdminConsole
|
|
23
|
+
config={{
|
|
24
|
+
apiBase: "https://backend.omg.dev", // control-plane origin
|
|
25
|
+
getToken: () => myAuth.getAccessToken(), // bearer JWT (or null when signed out)
|
|
26
|
+
}}
|
|
27
|
+
/>;
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
Embed a single panel, or as a tab in an existing tab shell:
|
|
31
|
+
|
|
32
|
+
```tsx
|
|
33
|
+
import { FlagsPanel, AdminClient } from "@omg-dev/admin";
|
|
34
|
+
|
|
35
|
+
const client = new AdminClient({ apiBase, getToken });
|
|
36
|
+
// inside your own <Tabs>: { id: "flags", label: "Flags", content: <FlagsPanel client={client} /> }
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
## Backend proxy (recommended — keep the token server-side)
|
|
40
|
+
|
|
41
|
+
Don't ship the control-plane token to the browser. Mount the proxy in your
|
|
42
|
+
app's backend; the browser calls a same-origin path and the server injects the
|
|
43
|
+
admin token (from its own env) and forwards to the control-plane:
|
|
44
|
+
|
|
45
|
+
```ts
|
|
46
|
+
// server (Bun.serve / Fetch API / Hono / Next route handler):
|
|
47
|
+
import { createOmgAdminProxy } from "@omg-dev/admin/server";
|
|
48
|
+
const omgAdmin = createOmgAdminProxy({ token: process.env.OMG_ADMIN_TOKEN! });
|
|
49
|
+
// inside your request handler:
|
|
50
|
+
const res = await omgAdmin(req); // Request → Response | null
|
|
51
|
+
if (res) return res; // null = not our path; fall through
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
```tsx
|
|
55
|
+
// client — point at the mount, no token in the browser:
|
|
56
|
+
<AdminConsole config={{ apiBase: "/_omg", getToken: () => null }} />
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
The proxy only forwards `/api/flags/*`, `/api/users/*`, `/api/bugReports/*`,
|
|
60
|
+
and `/api/adminBilling/*` (the admin surface), so a leaked mount can't wield the
|
|
61
|
+
token elsewhere. `OMG_ADMIN_TOKEN` is an `auth.omg.dev` JWT for an allowlisted
|
|
62
|
+
admin — rotate it in server env, no client rebuild. Options:
|
|
63
|
+
`{ token, target?, prefix? }` (`target` default `https://backend.omg.dev`,
|
|
64
|
+
`prefix` default `/_omg`).
|
|
65
|
+
|
|
66
|
+
### LFG integration
|
|
67
|
+
|
|
68
|
+
LFG already has a `@omg-dev/sdk` auth provider, so reuse its token. Add the dep
|
|
69
|
+
(`"@omg-dev/admin": "^0.4.13"`) and mount the console as a new tab:
|
|
70
|
+
|
|
71
|
+
```tsx
|
|
72
|
+
import { AdminConsole } from "@omg-dev/admin";
|
|
73
|
+
import { useAuth } from "@omg-dev/sdk"; // or LFG's own auth hook
|
|
74
|
+
|
|
75
|
+
function AdminTab() {
|
|
76
|
+
const { token } = useAuth();
|
|
77
|
+
return (
|
|
78
|
+
<AdminConsole
|
|
79
|
+
config={{
|
|
80
|
+
apiBase: import.meta.env.VITE_CONTROLPLANE_URL ?? "https://backend.omg.dev",
|
|
81
|
+
getToken: () => token,
|
|
82
|
+
}}
|
|
83
|
+
/>
|
|
84
|
+
);
|
|
85
|
+
}
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
The signed-in LFG user must be on the control-plane admin allowlist
|
|
89
|
+
(`VIBES_ADMIN_EMAILS` / `VIBES_ADMIN_USER_IDS`) or the panels return 401.
|
|
90
|
+
|
|
91
|
+
## Standalone (its own app)
|
|
92
|
+
|
|
93
|
+
```ts
|
|
94
|
+
import { mountAdminConsole } from "@omg-dev/admin/standalone";
|
|
95
|
+
|
|
96
|
+
mountAdminConsole(document.getElementById("root")!, {
|
|
97
|
+
apiBase: "https://backend.omg.dev",
|
|
98
|
+
getToken: async () => myAuth.getToken(),
|
|
99
|
+
});
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
## Panels
|
|
103
|
+
|
|
104
|
+
- **Flags** (read/write) — create/edit flags, toggle, set rollout %, per-plan
|
|
105
|
+
rules, and **per-account overrides** (search an account by email, flip it on).
|
|
106
|
+
Boolean and JSON-valued flags (a JSON flag can carry e.g. a per-account model
|
|
107
|
+
allowlist or a rate-limit config). Resolution order: explicit override →
|
|
108
|
+
per-plan rule → rollout % (stable hash) → global default.
|
|
109
|
+
- **Users** (read-only) — searchable account list with sessions, app counts,
|
|
110
|
+
flag override counts, and on-demand billing balance for the selected user.
|
|
111
|
+
- **Reports** (triage) — user-submitted bug reports with recovery context.
|
|
112
|
+
- **Pricing** (read-only) — live plan→Stripe projection + the model catalog.
|
|
113
|
+
Pricing is code-defined (`defineBilling`) and reconciled by the orchestrator;
|
|
114
|
+
this is a window, not an editor.
|
|
115
|
+
|
|
116
|
+
## Server contract
|
|
117
|
+
|
|
118
|
+
Talks to the control-plane custom functions:
|
|
119
|
+
|
|
120
|
+
- `POST /api/flags/{listFlags,upsert,setArchived,removeFlag,listOverrides,setOverride,removeOverride,findUsers,evaluate}`
|
|
121
|
+
- `POST /api/users/{listUsers,findUsers}`
|
|
122
|
+
- `POST /api/bugReports/{listReports,getReport,setStatus,addNote,removeReport}`
|
|
123
|
+
- `POST /api/adminBilling/{planVersions,models,userBalance}`
|
|
124
|
+
|
|
125
|
+
`flags.evaluate` is the consumer-facing endpoint (non-admin = self only) that
|
|
126
|
+
apps/services use to resolve a user's flag set.
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { a as UsersPanel, c as STYLE_ID, i as ReportsPanel, l as ensureStyles, n as FlagsPanel, o as AdminClient, r as PricingPanel, s as AdminError, t as AdminConsole } from "./react-COCR3YSL.mjs";
|
|
2
|
+
export { AdminClient, AdminConsole, AdminError, FlagsPanel, PricingPanel, ReportsPanel, STYLE_ID, UsersPanel, ensureStyles };
|