Minor tweaks on deployment instructions, workbench enabled by default (#99)

- Workbench is enabled for deploy by default
- Remove the text says that the workbench is experimental
- Fixed missing spacing on DeploymentStep
- Guide people on creating an empty API gateway key
- Info notice on deploying a system with no Workbench

Author: cybermaggedon

src/simple-editor/deployment/Deployment.tsx

@@ -13,6 +13,7 @@ import DeploymentInstructions from './DeploymentInstructions';
 import DeploymentVectorStore from './DeploymentVectorStore';
 import DeploymentGraphStore from './DeploymentGraphStore';
 import DeploymentWorkbench from './DeploymentWorkbench';
+import DeploymentGateway from './DeploymentGateway';
 import DeploymentDocumentRag from './DeploymentDocumentRag';
 
 interface DeploymentProps {
@@ -89,13 +90,13 @@ const Deployment: React.FC<DeploymentProps> = ({
                     <DeploymentConfig/>
                 </Box>
 
-                {
-                    options.has(CONFIGURE_WORKBENCH) && (
-                        <Box>
-                            <DeploymentWorkbench/>
-                        </Box>
-                    )
-                }
+                <Box>
+                    <DeploymentGateway/>
+                </Box>
+
+                <Box>
+                    <DeploymentWorkbench/>
+                </Box>
 
                 {
                     options.has(CONFIGURE_DOCUMENT_RAG) && (

src/simple-editor/deployment/DeploymentGateway.tsx

@@ -0,0 +1,65 @@
+
+import React from 'react';
+
+import { Typography, Box, Paper, Stack, Alert } from '@mui/material';
+import { Insights } from '@mui/icons-material';
+
+import { useConfigurationStateStore } from '../state/Configuration';
+
+import DeploymentCode from './DeploymentCode';
+import DeploymentStep from './DeploymentStep';
+
+const DeploymentGateway : React.FC<{}> = ({
+}) => {
+
+    const platform = useConfigurationStateStore((state) => state.platform);
+
+    return (
+
+        <>
+
+            {
+
+                (platform == "gcp-k8s" ||
+                 platform == "minikube-k8s") &&
+
+                <Paper sx={{ minWidth: 375, mt: 2, p: 2 }} elevation={3}>
+                    <Stack
+                        direction="row" spacing={2}
+                        alignItems="center"
+                        sx={{mb: 2}}
+                    >
+                        <Insights color="primary" fontSize="large"/>
+                        <Typography variant="h6" component="h3">
+                            API gateway
+                        </Typography>
+                    </Stack>
+
+                    <DeploymentStep>
+                        The API Gateway is an essential software component
+                        which supports using command-line utilities and the
+                        Data Workbench.  It needs to be configured with a
+                        secret key.  You should set the key to the empty
+                        string to leave authentication off unless you have
+                        a specific need.  Note that the Data Workbench does
+                        not know how to use keys for authentication at the
+                        present time.
+                    </DeploymentStep>
+
+                    <DeploymentCode>
+                        kubectl -n trustgraph create secret \<br/>
+                        {'    '}generic gateway-secret \<br/>
+                        {'    '}--from-literal=gateway-secret=
+                    </DeploymentCode>
+
+                </Paper>
+            }
+
+        </>
+
+    );
+
+};
+
+export default DeploymentGateway;
+

src/simple-editor/deployment/DeploymentStep.tsx

@@ -9,7 +9,7 @@ interface DeploymentStepProps extends React.PropsWithChildren {
 
 const DeploymentStep : React.FC<DeploymentStepProps> = ({children}) => {
     return (
-        <Typography variant="body2">
+        <Typography variant="body2" mt={1} mb={1}>
             {children}
         </Typography>
     );

src/simple-editor/deployment/DeploymentWorkbench.tsx

@@ -1,22 +1,43 @@
 
 import React from 'react';
 
-import {
-    Typography, Box, Paper, Stack,
-} from '@mui/material';
+import { Typography, Box, Paper, Stack, Alert } from '@mui/material';
 import { Insights } from '@mui/icons-material';
 
+import { useOptionsStore, CONFIGURE_WORKBENCH } from '../state/Options';
+
+import { useConfigurationStateStore } from '../state/Configuration';
+
 import DeploymentCode from './DeploymentCode';
 import DeploymentStep from './DeploymentStep';
 
 const DeploymentWorkbench: React.FC<{}> = ({
 }) => {
 
+    const options = useOptionsStore((state) => state.options);
+
+    const platform = useConfigurationStateStore((state) => state.platform);
+
     return (
 
         <>
 
-            <Box>
+            {
+                (!options.has(CONFIGURE_WORKBENCH)) && 
+                <Paper sx={{ minWidth: 375, mt: 2, p: 2 }} elevation={3}>
+                    <Alert severity="info">
+                        You have selected to install without the
+                        Data Workbench which provides a useful web interface
+                        for interaction with the system.  You can change
+                        this on the <strong>Customization</strong> tab.
+                    </Alert>
+                </Paper>
+            }
+
+            {
+
+                (options.has(CONFIGURE_WORKBENCH)) && 
+
                 <Paper sx={{ minWidth: 375, mt: 2, p: 2 }} elevation={3}>
                     <Stack
                         direction="row" spacing={2}
@@ -30,15 +51,15 @@ const DeploymentWorkbench: React.FC<{}> = ({
                     </Stack>
 
                     <DeploymentStep>
-
                         Once the system is running, you can access the
                         Data Workbench on port 8888, or access using the
                         following URL:
-
                     </DeploymentStep>
 
                     <DeploymentCode>
-                        <a href="http://localhost:8888">http://localhost:8888/</a>
+                        <a href="http://localhost:8888">
+                            http://localhost:8888/
+                        </a>
                     </DeploymentCode>
 
                     <DeploymentStep>
@@ -51,7 +72,7 @@ const DeploymentWorkbench: React.FC<{}> = ({
                     </DeploymentStep>
 
                 </Paper>
-            </Box>
+            }
 
         </>
 

src/simple-editor/options/Options.tsx

@@ -158,7 +158,7 @@ const ParamsForm: React.FC = () => {
                     onChange={onConfigureWorkbench}
                     title="Data Workbench"
                 >
-                    An experimental UI providing tools to explore extracted
+                    A UI providing tools to explore extracted
                     data. Once launched, accessible on port 8888.
                 </Option>
 

src/simple-editor/state/Options.ts

@@ -18,7 +18,7 @@ export interface Options {
 export const useOptionsStore = create<Options>()(
     (set) => ({
 
-        options: new Set<string>([]),
+        options: new Set<string>([CONFIGURE_WORKBENCH]),
 
         setOptions: (v) => set(() => ({
 	    options: v