reading from openapi spec

src_generic/components/AdminLayout.tsx

@@ -17,7 +17,7 @@ import {
 import TableViewIcon from '@mui/icons-material/TableView';
 import DashboardIcon from '@mui/icons-material/Dashboard';
 import LogoutIcon from '@mui/icons-material/Logout';
-import { config } from '../config';
+import { ResourceConfig } from '../types/config';
 
 const drawerWidth = 240;
 
@@ -27,6 +27,7 @@ interface AdminLayoutProps {
   selectedResourceName: string | null;
   onLogout: () => void;
   username?: string;
+  resources: ResourceConfig[];
 }
 
 export default function AdminLayout({
@@ -34,7 +35,8 @@ export default function AdminLayout({
   onSelectResource,
   selectedResourceName,
   onLogout,
-  username
+  username,
+  resources,
 }: AdminLayoutProps) {
   return (
     <Box sx={{ display: 'flex' }}>
@@ -77,7 +79,7 @@ export default function AdminLayout({
           </List>
           <Divider />
           <List>
-            {config.resources.map((res) => (
+            {resources.map((res) => (
               <ListItem key={res.name} disablePadding>
                 <ListItemButton 
                   selected={selectedResourceName === res.name}

src_generic/components/GenericForm.tsx

@@ -24,6 +24,8 @@ interface GenericFormProps {
   loading?: boolean;
 }
 
+import { ConfigContext } from '../App';
+
 export default function GenericForm({
   config,
   initialData = {},
@@ -33,6 +35,7 @@ export default function GenericForm({
 }: GenericFormProps) {
   const [formData, setFormData] = React.useState(initialData);
   const { uploadFile, uploading } = useUpload();
+  const appConfig = React.useContext(ConfigContext);
 
   const handleChange = (key: string, value: any) => {
     setFormData((prev: any) => ({ ...prev, [key]: value }));
@@ -60,6 +63,7 @@ export default function GenericForm({
           disabled={field.readOnly}
           uploadFile={uploadFile}
           uploading={uploading}
+          baseUrl={appConfig?.baseUrl || ""}
         />
       ))}
 
@@ -75,7 +79,7 @@ export default function GenericForm({
   );
 }
 
-function FormField({ name, field, value, onChange, disabled, uploadFile, uploading }: any) {
+function FormField({ name, field, value, onChange, disabled, uploadFile, uploading, baseUrl }: any) {
   const label = field.label;
 
   if (field.type === 'image') {
@@ -83,11 +87,12 @@ function FormField({ name, field, value, onChange, disabled, uploadFile, uploadi
       <ImageUploadField
         label={label}
         value={value}
-        onUpload={async (file) => {
+        onUpload={async (file: any) => {
           const url = await uploadFile(file);
           if (url) onChange(url);
         }}
         uploading={uploading}
+        baseUrl={baseUrl}
       />
     );
   }

src_generic/components/fields/ImageUploadField.tsx

@@ -1,6 +1,4 @@
-import * as React from "react";
 import { Box, Button, Avatar, CircularProgress, Typography } from "@mui/material";
-import { config } from "../../config";
 
 interface ImageUploadFieldProps {
   label?: string;
@@ -8,6 +6,7 @@ interface ImageUploadFieldProps {
   uploading?: boolean;
   onUpload: (file: File) => void;
   size?: number;
+  baseUrl: string;
 }
 
 export default function ImageUploadField({
@@ -16,10 +15,11 @@ export default function ImageUploadField({
   uploading = false,
   onUpload,
   size = 64,
+  baseUrl,
 }: ImageUploadFieldProps) {
 
   const imgSrc = value
-    ? config.baseUrl.replace(/\/+$/, "") +
+    ? baseUrl.replace(/\/+$/, "") +
       "/" +
       value.replace(/^\/+/, "")
     : "";