From 9a19617906d0f859267336300e9858c7d41e1b06 Mon Sep 17 00:00:00 2001
From: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de>
Date: Tue, 26 Aug 2025 10:52:25 +0100
Subject: [PATCH] refactor(app): parameterize admin role & enforce it to be set
 (#336)

* parameterize admin role & enforce it to be set

* fix lint

---------

Co-authored-by: Anton Tranelis <31516529+antontranelis@users.noreply.github.com>
---
 app/.env.dist                  |  1 +
 app/README.md                  | 11 +++++++++++
 app/src/App.tsx                |  5 +----
 app/src/config/index.ts        |  5 +++++
 app/src/pages/MapContainer.tsx |  3 +--
 5 files changed, 19 insertions(+), 6 deletions(-)
 create mode 100644 app/README.md

diff --git a/app/.env.dist b/app/.env.dist
index 5dc2cc82..f2850d71 100644
--- a/app/.env.dist
+++ b/app/.env.dist
@@ -3,5 +3,6 @@ VITE_API_URL=http://localhost:8055/
 #VITE_API_URL=https://api.utopia-lab.org
 VITE_MAP_URL=http://local.development
 #VITE_MAP_URL=CURRENT_WINDOW_LOCATION
+#VITE_DIRECTUS_ADMIN_ROLE=
 VITE_VALIDATE_INVITE_FLOW_ID=01d61db0-25aa-4bfa-bc24-c6a8f208a455
 VITE_REDEEM_INVITE_FLOW_ID=cc80ec73-ecf5-4789-bee5-1127fb1a6ed4
diff --git a/app/README.md b/app/README.md
new file mode 100644
index 00000000..c54058af
--- /dev/null
+++ b/app/README.md
@@ -0,0 +1,11 @@
+# App
+
+## Troubleshooting
+
+Map doesn't load and the Error `You must define the Admin roll in the .env file!` shows in the console.
+
+In order to get the map running you need to define the correct uuid of the admin roll in the `.env` file.
+
+Go to http://localhost:8055 and login with the admin credentials. Navigate to http://localhost:8055/admin/settings/roles and click `Administrator` and copy the UUID from the URL.
+
+Put this UUID in the `.env` as `VITE_DIRECTUS_ADMIN_ROLE=UUID`
\ No newline at end of file
diff --git a/app/src/App.tsx b/app/src/App.tsx
index caece166..4707eb27 100644
--- a/app/src/App.tsx
+++ b/app/src/App.tsx
@@ -156,10 +156,7 @@ function App() {
             embedded={embedded}
             openCollectiveApiKey={config.openCollectiveApiKey}
           >
-            <Permissions
-              api={permissionsApiInstance}
-              adminRole='8ed0b24e-3320-48cd-8444-bc152304e580'
-            ></Permissions>
+            <Permissions api={permissionsApiInstance} adminRole={config.adminRole} />
             {tagsApi && <Tags api={tagsApi}></Tags>}
             <Modal>
               <ModalContent map={map} />
diff --git a/app/src/config/index.ts b/app/src/config/index.ts
index 4f1630d5..98c8b891 100644
--- a/app/src/config/index.ts
+++ b/app/src/config/index.ts
@@ -1,6 +1,7 @@
 export const config = {
   apiUrl: String(import.meta.env.VITE_API_URL ?? 'http://localhost:8055/'),
   mapUrl: String(import.meta.env.VITE_MAP_URL ?? 'http://local.development'),
+  adminRole: String(import.meta.env.VITE_DIRECTUS_ADMIN_ROLE ?? ''),
   validateInviteFlowId: String(
     import.meta.env.VITE_VALIDATE_INVITE_FLOW_ID ?? '01d61db0-25aa-4bfa-bc24-c6a8f208a455',
   ),
@@ -10,4 +11,8 @@ export const config = {
   openCollectiveApiKey: String(import.meta.env.VITE_OPEN_COLLECTIVE_API_KEY ?? ''),
 }
 
+if (config.adminRole === '') {
+  throw Error('You must define the Admin roll in the .env file!')
+}
+
 export type Config = typeof config
diff --git a/app/src/pages/MapContainer.tsx b/app/src/pages/MapContainer.tsx
index 9818286e..6b1b0b57 100644
--- a/app/src/pages/MapContainer.tsx
+++ b/app/src/pages/MapContainer.tsx
@@ -1,6 +1,5 @@
 /* eslint-disable @typescript-eslint/no-unnecessary-condition */
 /* eslint-disable @typescript-eslint/no-explicit-any */
-/* eslint-disable @typescript-eslint/no-non-null-assertion */
 /* eslint-disable import/no-relative-parent-imports */
 /* eslint-disable array-callback-return */
 /* eslint-disable new-cap */
@@ -47,7 +46,7 @@ function MapContainer({ layers, map }: { layers: LayerProps[]; map: any }) {
         setApis((current) => [
           ...current,
           {
-            id: layer.id!,
+            id: layer.id,
             api: new itemsApi<Place>('items', layer.id, undefined, {
               _or: [
                 {