ApiLogicServer 15.0.25__py3-none-any.whl → 15.0.27__py3-none-any.whl

api_logic_server_cli/prototypes/basic_demo/customizations/ui/basic_demo_app/src/Order.js

@@ -0,0 +1,207 @@
+// begin MANDATORY imports (always generated EXACTLY)
+import React from 'react';
+import { List, FunctionField, Datagrid, TextField, DateField, NumberField } from 'react-admin';
+import { ReferenceField, ReferenceManyField } from 'react-admin';
+import { TabbedShowLayout, Tab, SimpleShowLayout, TextInput, NumberInput, DateTimeInput } from 'react-admin';
+import { ReferenceInput, SelectInput, SimpleForm, Show, Edit, Create } from 'react-admin';
+import { Filter, Pagination, BooleanField, BooleanInput, Labeled } from 'react-admin'; 
+import { EditButton, DeleteButton, CreateButton } from 'react-admin';
+import { Grid, Typography, Box, Divider, Button } from '@mui/material';
+import { useRecordContext, useRedirect, Link, required } from 'react-admin';
+import AddIcon from '@mui/icons-material/Add';
+// end mandatory imports
+
+const OrderFilter = (props) => (
+    <Filter {...props}>
+        <TextInput label="Search by ID" source="id" alwaysOn />
+        <TextInput label="Customer ID" source="customer_id" />
+    </Filter>
+);
+
+// Order List
+export const OrderList = (props) => {
+    return (
+        <List filters={<OrderFilter />} {...props} sort={{ field: 'id', order: 'ASC' }} pagination={<Pagination rowsPerPageOptions={[5, 10, 25]} showFirstLastButtons />}>
+            <Datagrid rowClick="show">
+                <TextField source="id" label="Order ID" />
+                <TextField source="notes" label="Notes" />
+                <ReferenceField label="Customer" source="customer_id" reference="Customer">
+                    <TextField source="name" />
+                </ReferenceField>
+                <DateField source="CreatedOn" label="Created On" />
+                <NumberField source="amount_total" label="Amount Total" options={{ style: 'currency', currency: 'USD' }} />
+                <DateField source="date_shipped" label="Date Shipped" />
+                <EditButton />
+                <DeleteButton />
+            </Datagrid>
+        </List>
+    );
+};
+
+// Order Show
+export const OrderShow = (props) => {
+    return (
+        <Show {...props}>
+            <SimpleShowLayout>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Order Details
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={6} md={3}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Order ID">
+                                    <TextField source="id" />
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={3}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Customer">
+                                    <ReferenceField source="customer_id" reference="Customer">
+                                        <TextField source="name" />
+                                    </ReferenceField>
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={3}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Created On">
+                                    <DateField source="CreatedOn" />
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={3}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Amount Total">
+                                    <NumberField source="amount_total" options={{ style: 'currency', currency: 'USD' }} />
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                    </Grid>
+                    <Divider sx={{ my: 2 }} />
+                </Box>
+            </SimpleShowLayout>
+            <TabbedShowLayout>
+                <Tab label="Items">
+                    <ReferenceManyField reference="Item" target="order_id" addLabel={false} pagination={<Pagination />}>
+                        <Datagrid rowClick="show">
+                            <TextField source="id" label="Item ID" />
+                            <ReferenceField label="Product" source="product_id" reference="Product">
+                                <TextField source="name" />
+                            </ReferenceField>
+                            <NumberField source="quantity" label="Quantity" />
+                            <NumberField source="amount" label="Amount" options={{ style: 'currency', currency: 'USD' }} />
+                            <EditButton />
+                            <DeleteButton />
+                        </Datagrid>
+                    </ReferenceManyField>
+                    <AddItemButton />
+                </Tab>
+                <Tab label="General">
+                    <SimpleShowLayout>
+                        <TextField source="notes" label="Notes" />
+                        <DateField source="date_shipped" label="Date Shipped" />
+                    </SimpleShowLayout>
+                </Tab>
+            </TabbedShowLayout>
+        </Show>
+    );
+};
+
+// Custom Add Item Button
+const AddItemButton = () => {
+    const record = useRecordContext();
+    const redirect = useRedirect();
+    
+    const handleClick = () => {
+        redirect(`/Item/create?source=${encodeURIComponent(JSON.stringify({ order_id: record?.id }))}`);
+    };
+
+    return (
+        <Button
+            variant="contained"
+            color="primary"
+            startIcon={<AddIcon />}
+            onClick={handleClick}
+            sx={{ mt: 2 }}
+        >
+            Add New Item
+        </Button>
+    );
+};
+
+// Order Create
+export const OrderCreate = (props) => {
+    return (
+        <Create {...props}>
+            <SimpleForm>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Create New Order
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <ReferenceInput source="customer_id" reference="Customer" fullWidth>
+                                    <SelectInput optionText="name" validate={required()} />
+                                </ReferenceInput>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput source="notes" label="Notes" fullWidth />
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <DateTimeInput source="CreatedOn" label="Created On" fullWidth />
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleForm>
+        </Create>
+    );
+};
+
+// Order Edit
+export const OrderEdit = (props) => {
+    return (
+        <Edit {...props} redirect={false}>
+            <SimpleForm>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Edit Order
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <ReferenceInput source="customer_id" reference="Customer" fullWidth>
+                                    <SelectInput optionText="name" validate={required()} />
+                                </ReferenceInput>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput source="notes" label="Notes" fullWidth />
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <DateTimeInput source="CreatedOn" label="Created On" fullWidth />
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleForm>
+        </Edit>
+    );
+};
+
+export default {
+    list: OrderList,
+    show: OrderShow,
+    create: OrderCreate,
+    edit: OrderEdit,
+};

api_logic_server_cli/prototypes/basic_demo/customizations/ui/basic_demo_app/src/Product.js

@@ -0,0 +1,140 @@
+// begin MANDATORY imports (always generated EXACTLY)
+import React from 'react';
+import { List, FunctionField, Datagrid, TextField, DateField, NumberField } from 'react-admin';
+import { ReferenceField, ReferenceManyField } from 'react-admin';
+import { TabbedShowLayout, Tab, SimpleShowLayout, TextInput, NumberInput, DateTimeInput } from 'react-admin';
+import { ReferenceInput, SelectInput, SimpleForm, Show, Edit, Create } from 'react-admin';
+import { Filter, Pagination, BooleanField, BooleanInput, Labeled } from 'react-admin'; 
+import { EditButton, DeleteButton, CreateButton } from 'react-admin';
+import { Grid, Typography, Box, Divider, Button } from '@mui/material';
+import { useRecordContext, useRedirect, Link, required } from 'react-admin';
+import AddIcon from '@mui/icons-material/Add';
+// end mandatory imports
+
+export const ProductList = (props) => (
+    <List {...props} sort={{ field: 'name', order: 'ASC' }} pagination={<Pagination rowsPerPageOptions={[5, 10, 25]} showFirstLastButtons />}>
+        <Datagrid rowClick="show">
+            <TextField source="name" label="Name" />
+            <NumberField source="unit_price" label="Unit Price" options={{ style: 'currency', currency: 'USD' }} />
+        </Datagrid>
+    </List>
+);
+
+// Product Show
+export const ProductShow = (props) => (
+    <Show {...props}>
+        <SimpleShowLayout>
+            <Box sx={{ mb: 3 }}>
+                <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                    Product Information
+                </Typography>
+                <Grid container spacing={3} sx={{ mb: 2 }}>
+                    <Grid item xs={12} sm={6} md={3}>
+                        <Box sx={{ p: 1 }}>
+                            <Labeled label="Name">
+                                <TextField source="name" />
+                            </Labeled>
+                        </Box>
+                    </Grid>
+                    <Grid item xs={12} sm={6} md={3}>
+                        <Box sx={{ p: 1 }}>
+                            <Labeled label="Unit Price">
+                                <NumberField source="unit_price" options={{ style: 'currency', currency: 'USD' }} />
+                            </Labeled>
+                        </Box>
+                    </Grid>
+                </Grid>
+                <Divider sx={{ my: 2 }} />
+            </Box>
+            <ReferenceManyField reference="Item" target="product_id" addLabel={false} pagination={<Pagination />}>
+                <Datagrid rowClick="show">
+                    <TextField source="id" label="Item ID" />
+                    <NumberField source="quantity" label="Quantity" />
+                    <NumberField source="amount" label="Amount" options={{ style: 'currency', currency: 'USD' }} />
+                    <EditButton />
+                    <DeleteButton />
+                </Datagrid>
+            </ReferenceManyField>
+            <AddItemButton />
+        </SimpleShowLayout>
+    </Show>
+);
+
+// Custom Add Item Button
+const AddItemButton = () => {
+    const record = useRecordContext();
+    const redirect = useRedirect();
+
+    const handleClick = () => {
+        redirect(`/Item/create?source=${encodeURIComponent(JSON.stringify({ product_id: record?.id }))}`);
+    };
+
+    return (
+        <Button
+            variant="contained"
+            color="primary"
+            startIcon={<AddIcon />}
+            onClick={handleClick}
+            sx={{ mt: 2 }}
+        >
+            Add New Item
+        </Button>
+    );
+};
+
+// Product Create
+export const ProductCreate = (props) => (
+    <Create {...props}>
+        <SimpleForm>
+            <Box sx={{ mb: 3 }}>
+                <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                    Create New Product
+                </Typography>
+                <Grid container spacing={3} sx={{ mb: 2 }}>
+                    <Grid item xs={12} sm={6} md={4}>
+                        <Box sx={{ p: 1 }}>
+                            <TextInput source="name" label="Name" fullWidth />
+                        </Box>
+                    </Grid>
+                    <Grid item xs={12} sm={6} md={4}>
+                        <Box sx={{ p: 1 }}>
+                            <NumberInput source="unit_price" label="Unit Price" fullWidth />
+                        </Box>
+                    </Grid>
+                </Grid>
+            </Box>
+        </SimpleForm>
+    </Create>
+);
+
+// Product Edit
+export const ProductEdit = (props) => (
+    <Edit {...props} redirect={false}>
+        <SimpleForm>
+            <Box sx={{ mb: 3 }}>
+                <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                    Edit Product
+                </Typography>
+                <Grid container spacing={3} sx={{ mb: 2 }}>
+                    <Grid item xs={12} sm={6} md={4}>
+                        <Box sx={{ p: 1 }}>
+                            <TextInput source="name" label="Name" fullWidth />
+                        </Box>
+                    </Grid>
+                    <Grid item xs={12} sm={6} md={4}>
+                        <Box sx={{ p: 1 }}>
+                            <NumberInput source="unit_price" label="Unit Price" fullWidth />
+                        </Box>
+                    </Grid>
+                </Grid>
+            </Box>
+        </SimpleForm>
+    </Edit>
+);
+
+export default {
+    list: ProductList,
+    show: ProductShow,
+    create: ProductCreate,
+    edit: ProductEdit,
+};

api_logic_server_cli/prototypes/basic_demo/customizations/ui/basic_demo_app/src/SysEmail.js

@@ -0,0 +1,157 @@
+// begin MANDATORY imports (always generated EXACTLY)
+import React from 'react';
+import { List, FunctionField, Datagrid, TextField, DateField, NumberField } from 'react-admin';
+import { ReferenceField, ReferenceManyField } from 'react-admin';
+import { TabbedShowLayout, Tab, SimpleShowLayout, TextInput, NumberInput, DateTimeInput } from 'react-admin';
+import { ReferenceInput, SelectInput, SimpleForm, Show, Edit, Create } from 'react-admin';
+import { Filter, Pagination, BooleanField, BooleanInput, Labeled } from 'react-admin'; 
+import { EditButton, DeleteButton, CreateButton } from 'react-admin';
+import { Grid, Typography, Box, Divider, Button } from '@mui/material';
+import { useRecordContext, useRedirect, Link, required } from 'react-admin';
+import AddIcon from '@mui/icons-material/Add';
+// end mandatory imports
+
+const SysEmailFilter = (props) => (
+    <Filter {...props}>
+        <TextInput label="Search" source="subject" alwaysOn />
+    </Filter>
+);
+
+// SysEmail List
+export const SysEmailList = (props) => {
+    return (
+        <List filters={<SysEmailFilter />} {...props} sort={{ field: 'id', order: 'ASC' }} pagination={<Pagination rowsPerPageOptions={[5, 10, 25]} showFirstLastButtons />}>
+            <Datagrid rowClick="show">
+                <TextField source="id" label="Email ID" />
+                <ReferenceField label="Customer" source="customer_id" reference="Customer">
+                    <TextField source="name" />
+                </ReferenceField>
+                <TextField source="subject" label="Subject" />
+                <DateField source="CreatedOn" label="Created On" />
+                <EditButton />
+                <DeleteButton />
+            </Datagrid>
+        </List>
+    );
+};
+
+// SysEmail Show
+export const SysEmailShow = (props) => {
+    return (
+        <Show {...props}>
+            <SimpleShowLayout>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Email Details
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Email ID">
+                                    <TextField source="id" />
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Customer">
+                                    <ReferenceField source="customer_id" reference="Customer">
+                                        <TextField source="name" />
+                                    </ReferenceField>
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Subject">
+                                    <TextField source="subject" />
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12}>
+                            <Divider sx={{ my: 2 }} />
+                            <Labeled label="Message">
+                                <TextField source="message" />
+                            </Labeled>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleShowLayout>
+        </Show>
+    );
+};
+
+// SysEmail Create
+export const SysEmailCreate = (props) => {
+    return (
+        <Create {...props}>
+            <SimpleForm>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Create New Email
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <ReferenceInput source="customer_id" reference="Customer" fullWidth>
+                                    <SelectInput optionText="name" validate={required()} />
+                                </ReferenceInput>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput source="subject" label="Subject" fullWidth validate={required()} />
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput multiline source="message" label="Message" fullWidth />
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleForm>
+        </Create>
+    );
+};
+
+// SysEmail Edit
+export const SysEmailEdit = (props) => {
+    return (
+        <Edit {...props} redirect={false}>
+            <SimpleForm>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Edit Email
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <ReferenceInput source="customer_id" reference="Customer" fullWidth>
+                                    <SelectInput optionText="name" validate={required()} />
+                                </ReferenceInput>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput source="subject" label="Subject" fullWidth validate={required()} />
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput multiline source="message" label="Message" fullWidth />
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleForm>
+        </Edit>
+    );
+};
+
+export default {
+    list: SysEmailList,
+    show: SysEmailShow,
+    create: SysEmailCreate,
+    edit: SysEmailEdit,
+};

api_logic_server_cli/prototypes/basic_demo/customizations/ui/basic_demo_app/src/SysMcp.js

@@ -0,0 +1,110 @@
+// begin MANDATORY imports (always generated EXACTLY)
+import React from 'react';
+import { List, FunctionField, Datagrid, TextField, DateField, NumberField } from 'react-admin';
+import { ReferenceField, ReferenceManyField } from 'react-admin';
+import { TabbedShowLayout, Tab, SimpleShowLayout, TextInput, NumberInput, DateTimeInput } from 'react-admin';
+import { ReferenceInput, SelectInput, SimpleForm, Show, Edit, Create } from 'react-admin';
+import { Filter, Pagination, BooleanField, BooleanInput, Labeled } from 'react-admin'; 
+import { EditButton, DeleteButton, CreateButton } from 'react-admin';
+import { Grid, Typography, Box, Divider, Button } from '@mui/material';
+import { useRecordContext, useRedirect, Link, required } from 'react-admin';
+import AddIcon from '@mui/icons-material/Add';
+// end mandatory imports
+
+const SysMcpFilter = (props) => (
+    <TextInput label="Search" source="id" alwaysOn />
+);
+
+// SysMcp List
+export const SysMcpList = (props) => {
+    return (
+        <List filters={<SysMcpFilter />} {...props} sort={{ field: 'id', order: 'ASC' }}>
+            <Datagrid rowClick="show">
+                <TextField source="id" label="ID" />
+                <TextField source="request" label="Request" />
+            </Datagrid>
+        </List>
+    );
+};
+
+// SysMcp Show
+export const SysMcpShow = (props) => {
+    return (
+        <Show {...props}>
+            <SimpleShowLayout>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        SysMcp Details
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={6} md={4}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="ID">
+                                    <TextField source="id" />
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                        <Grid item xs={12} sm={6} md={8}>
+                            <Box sx={{ p: 1 }}>
+                                <Labeled label="Request">
+                                    <TextField source="request" />
+                                </Labeled>
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleShowLayout>
+        </Show>
+    );
+};
+
+// SysMcp Create
+export const SysMcpCreate = (props) => {
+    return (
+        <Create {...props}>
+            <SimpleForm>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Create SysMcp
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={12} md={12}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput source="request" label="Request" multiline fullWidth />
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleForm>
+        </Create>
+    );
+};
+
+// SysMcp Edit
+export const SysMcpEdit = (props) => {
+    return (
+        <Edit {...props} redirect={false}>
+            <SimpleForm>
+                <Box sx={{ mb: 3 }}>
+                    <Typography variant="h5" component="h2" sx={{ mb: 2, fontWeight: 'bold' }}>
+                        Edit SysMcp
+                    </Typography>
+                    <Grid container spacing={3} sx={{ mb: 2 }}>
+                        <Grid item xs={12} sm={12} md={12}>
+                            <Box sx={{ p: 1 }}>
+                                <TextInput source="request" label="Request" multiline fullWidth />
+                            </Box>
+                        </Grid>
+                    </Grid>
+                </Box>
+            </SimpleForm>
+        </Edit>
+    );
+};
+
+export default {
+    list: SysMcpList,
+    show: SysMcpShow,
+    create: SysMcpCreate,
+    edit: SysMcpEdit,
+};

api_logic_server_cli/prototypes/basic_demo/customizations/ui/basic_demo_app/src/app_loader.js

@@ -0,0 +1,24 @@
+    const [loading, setLoading] = React.useState(true);
+    const [conf, setConf] = React.useState({});
+    
+    React.useEffect(() => {
+        const fetchData = async () => {
+        try {
+            console.log('loading HomeConf-1')
+            const conf = await loadHomeConf()
+            setConf(conf)
+            setLoading(false);
+            console.log('AppConf0: ', conf);
+        } catch (error) {
+            console.error('Error fetching data:', error);
+            sessionStorage.removeItem("raSpa");
+        }
+        };
+        fetchData();
+    }, []);
+
+    if (loading) {
+        return <Loading loadingPrimary="Loading..." loadingSecondary="Please wait" />;
+    }
+        //conf = useConf();
+        const dataProvider = jsonapiClient(conf.api_root, { conf: {} }, null);

api_logic_server_cli/prototypes/basic_demo/customizations/ui/basic_demo_app/src/index.css

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

api_logic_server_cli/prototypes/basic_demo/customizations/ui/basic_demo_app/src/index.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App';
+import reportWebVitals from './reportWebVitals';
+
+const root = ReactDOM.createRoot(document.getElementById('root'));
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);
+
+// If you want to start measuring performance in your app, pass a function
+// to log results (for example: reportWebVitals(console.log))
+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
+reportWebVitals();