Staging

packages/app/hivecommand-backend/src/index.ts

@@ -54,12 +54,16 @@ const prisma = new PrismaClient();
 		resources: [
 			{
 				name: 'CommandDevice', 
-				actions: ['read', 'manage', 'control'], 
+				actions: ['create', 'read', 'update', 'manage', 'control', 'delete'], 
 				fields: ['id', 'name', 'provisioned']
 			}, {
 				name: 'CommandProgram', 
-				actions: ['read', 'update', 'delete'],
+				actions: ['create', 'read', 'update', 'delete'],
 				fields: ['id', 'name']
+			},
+			{
+				name: 'CommandSchematic',
+				actions: ['create', 'read', 'update', 'delete']
 			}
 		],
 		// aclPermissions: [

packages/app/hivecommand-backend/src/schema/index.ts

@@ -6,6 +6,8 @@ import hmi from './hmi';
 import program from './program';
 import plugins from './plugins'
 import operations from './operations'
+import schematics from "./schematics";
+
 import { MQTTPublisher } from '@hive-command/amqp-client';
 import { Pool } from 'pg';
 import templates from "./program/templates";
@@ -17,18 +19,20 @@ export default (prisma: PrismaClient, deviceChannel?: MQTTPublisher) => {
 	const { typeDefs: deviceTypeDefs, resolvers: deviceResolvers } = devices(prisma);
 	const { typeDefs: programTypeDefs, resolvers: programResolvers } = program(prisma)
 	const { typeDefs: hmiTypeDefs, resolvers: hmiResolvers } = hmi(prisma)
+	const { typeDefs: schematicTypeDefs, resolvers: schematicResolvers } = schematics(prisma);
 
 	const { typeDefs: templateTypeDefs, resolvers: templateResolvers } = templates(prisma);
 
 	const { typeDefs: operationTypeDefs, resolvers: operationResolvers } = operations(prisma, deviceChannel)
 
 	const resolvers = mergeResolvers([
+		schematicResolvers,
 		pluginResolvers,
 		deviceResolvers,
 		programResolvers,
 		hmiResolvers,
 		operationResolvers,
-		templateResolvers
+		templateResolvers,
 	]);
 
 	/*
@@ -59,6 +63,7 @@ export default (prisma: PrismaClient, deviceChannel?: MQTTPublisher) => {
 			value: String
 		}
 		`,
+		schematicTypeDefs,
 		pluginTypeDefs,
 		templateTypeDefs,
 		operationTypeDefs,

packages/app/hivecommand-backend/src/schema/schematics/index.ts

@@ -0,0 +1,176 @@
+import { PrismaClient } from "@hive-command/data";
+import { mergeResolvers } from '@graphql-tools/merge'
+
+import gql from "graphql-tag";
+import { nanoid } from "nanoid";
+import { subject } from "@casl/ability";
+
+
+export default (prisma: PrismaClient) => {
+
+	const resolvers = mergeResolvers([
+		{
+
+			Query: {
+				commandSchematics: async (root: any, args: any, context: any) => {
+
+					if(!context?.jwt?.acl?.can('read', 'CommandSchematic')) throw new Error('Not allowed to read SchematicList');
+
+					let filter = args.where || {}
+					const programs = await prisma.electricalSchematic.findMany({
+						where: {...filter, organisation: context.jwt.organisation},
+                        include: {
+                            pages: true
+                        }
+                    });
+
+					return programs.filter((a) => context?.jwt?.acl?.can('read', subject('CommandSchematic', a) ))
+				},
+
+			},
+			Mutation: {
+				createCommandSchematic: async (root: any, args: {input: {name: string, templatePacks: string[]}}, context: any) => {
+					if(!context?.jwt?.acl.can('create', 'CommandSchematic')) throw new Error('Cannot create new CommandSchematic');
+
+					const program = await prisma.electricalSchematic.create({
+						data: {
+							id: nanoid(),
+							name: args.input.name,
+							// templatePacks: {
+							// 	connect: (args.input.templatePacks || []).map((x) => ({id: x}))
+							// },
+							// interface: {
+							// 	create: {
+							// 		id: nanoid(),
+							// 		name: 'Default'
+							// 	}
+							// },
+							organisation: context.jwt.organisation
+						}
+					})
+					return program;
+				},
+				updateCommandSchematic: async (root: any, args: {id: string, input: {name: string, templatePacks: string[]}}, context: any) => {
+					const currentProgram = await prisma.program.findFirst({where: {id: args.id, organisation: context?.jwt?.organisation}});
+
+					if(!currentProgram) throw new Error('Program not found');
+					if(!context?.jwt?.acl.can('update', subject('CommandSchematic', currentProgram) )) throw new Error('Cannot update CommandSchematic');
+
+					const program = await prisma.electricalSchematic.update({
+						where: {id: args.id},
+						data: {
+							name: args.input.name,
+							// templatePacks: {
+							// 	set: args.input.templatePacks.map((x) => ({id: x}))
+							// }
+						}
+					})
+
+					return program
+				},
+				deleteCommandSchematic: async (root: any, args: {id: string}, context: any) => {
+					const currentProgram = await prisma.program.findFirst({where: {id: args.id, organisation: context?.jwt?.organisation}});
+					if(!currentProgram) throw new Error('Program not found');
+					if(!context?.jwt?.acl.can('delete', subject('CommandSchematic', currentProgram) )) throw new Error('Cannot delete CommandSchematic');
+
+					const res = await prisma.electricalSchematic.delete({where: {id: args.id}})
+					return res != null
+				},
+                createCommandSchematicPage: async (root: any, args: {schematic: string, input: any}, context: any) => {
+
+                    return await prisma.electricalSchematicPage.create({
+
+                        data: {
+                                    id: nanoid(),
+                                    name: args.input.name,
+                                    nodes: args.input.nodes,
+                                    edges: args.input.edges,
+                                    schematic: {
+                                        connect: {id: args.schematic}
+                                    }
+                        }
+                    })
+                },
+                updateCommandSchematicPage: async (root: any, args: {schematic: string, id: string, input: any}, context: any) => {
+                    return await prisma.electricalSchematicPage.update({
+                        where: {
+                            id: args.id,
+                        },
+                        data: {
+                                    name: args.input.name,
+                            nodes: args.input.nodes,
+                            edges: args.input.edges,
+                                    schematic: {
+                                        connect: {id: args.schematic}
+                                    }
+                        }
+                    })
+                },
+                deleteCommandSchematicPage: async (root: any, args: {schematic: string, id: string}, context: any) => {
+                    return await prisma.electricalSchematicPage.delete({where: {id: args.id}})
+                }
+			}
+		},
+	])
+
+	const typeDefs = `
+
+	type Query {
+		commandSchematics(where: CommandSchematicWhere): [CommandSchematic]!
+	}
+
+	type Mutation {
+		createCommandSchematic(input: CommandSchematicInput!): CommandSchematic!
+		updateCommandSchematic(id: ID!, input: CommandSchematicInput!): CommandSchematic!
+		deleteCommandSchematic(id: ID!): Boolean!
+
+        createCommandSchematicPage(schematic: ID, input: CommandSchematicPageInput): CommandSchematicPage!
+        updateCommandSchematicPage(schematic: ID, id: ID, input: CommandSchematicPageInput): CommandSchematicPage!
+        deleteCommandSchematicPage(schematic: ID, id: ID): Boolean!
+	}
+
+
+	input CommandSchematicInput {
+		name: String	
+
+		templatePacks: [String]
+	}
+
+	input CommandSchematicWhere {
+		id: ID
+	}
+
+
+	type CommandSchematic {
+		id: ID! 
+		name: String
+
+        pages: [CommandSchematicPage]
+
+		createdAt: DateTime 
+
+		organisation: HiveOrganisation
+	}
+
+    input CommandSchematicPageInput{
+        name: String
+
+        nodes: JSON
+        edges: JSON
+    }
+
+    type CommandSchematicPage {
+        id: ID!
+        name: String
+
+        nodes: JSON
+        edges: JSON
+    }
+
+
+`
+	return {
+		typeDefs,
+		resolvers
+	}
+}

packages/app/hivecommand-frontend/package.json

@@ -70,6 +70,7 @@
     "@hive-command/canvas-nodes": "^1.4.15-alpha.263",
     "@hive-command/command-surface": "^1.4.15-alpha.263",
     "@hive-command/data-types": "^1.4.15-alpha.52",
+    "@hive-command/electrical-editor": "workspace:^",
     "@hive-command/remote-components": "^1.4.15-alpha.263",
     "@hive-command/scripting": "^1.4.15-alpha.263",
     "@monaco-editor/react": "^4.4.6",

packages/app/hivecommand-frontend/src/App.tsx

@@ -13,6 +13,7 @@ import { ApolloLink } from "@apollo/client";
 import { Observable } from "@apollo/client/utilities";
 import { LocalizationProvider } from '@mui/x-date-pickers';
 import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment'
+import { SchematicEditor } from "./views/schematic-editor";
 // import { DeviceControlView } from "./pages/device-control";
 
 const DeviceControlView = lazy(() => import('./pages/device-control').then((r) => ({default: r.DeviceControlView}) ))
@@ -156,6 +157,7 @@ function App(props: any) {
                   <Routes>
 
                     <Route path={`programs/:id/*`} element={<EditorPage />} />
+                    <Route path={`schematics/:id/*`} element={<SchematicEditor />} />
                     <Route path={'*'} element={<Dashboard />} />
                     <Route path={`:id/controls`} element={<DeviceControlView />} />
 

packages/app/hivecommand-frontend/src/components/modals/editor-menu/index.tsx

@@ -7,6 +7,7 @@ import { TemplateView } from "./views/templates";
 import { TypeView } from "./views/types";
 import { VariableView } from "./views/variable";
 import { ComponentsView } from "./views/components";
+import { SchematicsView } from "./views/schematics";
 
 export interface EditorMenuDialogProps {
     open: boolean;
@@ -31,6 +32,8 @@ export const EditorMenuDialog : React.FC<EditorMenuDialogProps> = (props) => {
 
     const getTitle = () => {
         switch(type){
+            case 'schematics':
+                return `${selected ? 'Edit' : 'Create'} Schematic`;
             case 'components':
                 return `${selected ? 'Edit' : 'Create'} Component`;
             case 'types':
@@ -52,6 +55,8 @@ export const EditorMenuDialog : React.FC<EditorMenuDialogProps> = (props) => {
 
     const getContent = () => {
         switch(type){
+            case 'schematics':
+                return <SchematicsView />;
             case 'components':
                 return <ComponentsView />;
             case 'types':
@@ -78,6 +83,7 @@ export const EditorMenuDialog : React.FC<EditorMenuDialogProps> = (props) => {
             case 'devices':
             case 'alarms':
             case 'variables':
+            case 'schematics':
                 return <Box sx={{display: 'flex', flex: 1, alignItems: 'center', justifyContent: ( Boolean(props.selected?.id) ? 'space-between' : 'flex-end') }}>
                     {props.selected?.id ? (
                         <Button variant="contained" color="error" onClick={props.onDelete}>

packages/app/hivecommand-frontend/src/components/modals/editor-menu/views/schematics.tsx

@@ -0,0 +1,30 @@
+import { Autocomplete, Box, TextField } from '@mui/material';
+import React from 'react';
+import { useMenuContext } from '../context';
+
+
+export const SchematicsView = () => {
+
+    const {item, setItem} = useMenuContext();
+
+
+    return (
+        <Box sx={{ flex: 1, display: 'flex', flexDirection: 'column' }}>
+            <TextField
+                value={item?.name}
+                onChange={ (e) => setItem({...item, name: e.target.value }) }
+                sx={{marginBottom: '12px'}}
+                fullWidth
+                size="small" 
+                label="Page name" />
+
+            <Autocomplete
+        // value={item?.name}
+        // onChange={ (e) => setItem({...item, name: e.target.value }) }
+                fullWidth
+                size="small"
+                options={[]}
+                renderInput={(params) => <TextField {...params} label="Page type" />} />
+        </Box>
+    )
+}

packages/app/hivecommand-frontend/src/components/modals/schematic/index.tsx

@@ -0,0 +1,65 @@
+import React, { useEffect, useState } from 'react';
+
+import { Box, Button, Dialog } from '@mui/material';
+import { DialogTitle } from '@mui/material';
+import { DialogContent } from '@mui/material';
+import { TextField } from '@mui/material';
+import { DialogActions } from '@mui/material';
+
+export interface SchematicModalProps {
+  open: boolean;
+  selected?: any;
+  onSubmit?: Function;
+  onClose?: Function;
+}
+
+export const SchematicModal : React.FC<SchematicModalProps> = (props) => {
+
+  const [ schematic, setSchematic ] = useState<{id?: string, name: string}>({name: ''})
+
+  // const [ name, setName ] = React.useState<string>('');
+
+  // useEff
+  const onClose = () => {
+    if(props.onClose){
+      props.onClose();
+    }
+  }
+
+  const onSubmit = () => {
+    if(props.onSubmit){
+      props.onSubmit({
+        ...schematic
+      })
+    }
+  }
+
+  useEffect(() => {
+    if(props.selected){
+      setSchematic({...props.selected})
+    }
+  }, [props.selected])
+
+  return (
+    <Dialog 
+      fullWidth
+        open={props.open}
+        onClose={onClose}>
+          <DialogTitle>{schematic.id ? "Edit" : "Create"} Schematic</DialogTitle>
+          <DialogContent>
+            <Box sx={{padding: '6px'}}>
+              <TextField 
+                fullWidth
+                size="small"
+                label="Schematic name" 
+                value={schematic.name} 
+                onChange={(e) => setSchematic({...schematic, name: e.target.value}) } />
+            </Box>
+          </DialogContent>
+          <DialogActions>
+            <Button onClick={onClose}>Cancel</Button>
+            <Button onClick={onSubmit} variant="contained" color="primary">{schematic.id ? "Save": "Create"}</Button>
+          </DialogActions>
+     </Dialog>
+  );
+}