Merge pull request #171 from latitudegames/0.0.66

0.0.66

client/.env

@@ -1,6 +1,7 @@
 EXTEND_ESLINT = true
 
 # This prod site root assumes the netlify build context $URL is available, replace for other hosts
+
 REACT_APP_SITE_ROOT_URL_PROD=https://thoth.latitude.io
 
 REACT_APP_SITE_ROOT_URL=http://localhost:3001
@@ -10,4 +11,7 @@ REACT_APP_LAPI_ROOT_URL_PROD=https://api.latitude.io
 REACT_APP_SITE_STAGING=https://62264f21c3a9860ad1e5bdd3--optimistic-turing-def916.netlify.app/
 
 # Oauth Client Id
-REACT_APP_OAUTH_CLIENT_ID=a6b51c87-7565-42ab-a4b0-38a07f3b6c56
+
+REACT_APP_OAUTH_CLIENT_ID=a6b51c87-7565-42ab-a4b0-38a07f3b6c56
+
+REACT_APP_SHAREDB=false

client/package.json

@@ -21,28 +21,24 @@
   },
   "dependencies": {
     "@callstack/async-storage": "^2.0.3",
-    "@latitudegames/thoth-core": "0.0.65",
-    "@material-ui/core": "^4.12.1",
-    "@material-ui/icons": "^4.11.2",
+    "@emotion/react": "^11.8.2",
+    "@emotion/styled": "^11.8.1",
+    "@latitudegames/thoth-core": "0.0.66",
     "@monaco-editor/react": "^4.2.1",
+    "@mui/icons-material": "^5.5.1",
+    "@mui/material": "^5.5.3",
+    "@mui/styles": "^5.5.3",
     "@rebass/forms": "^4.0.6",
     "@reduxjs/toolkit": "^1.6.2",
-    "@types/jest": "^26.0.24",
-    "@types/node": "^16.4.3",
-    "@types/react": "^17.0.15",
-    "@types/react-dom": "^17.0.9",
-    "@types/react-redux": "^7.1.18",
+    "add": "^2.0.6",
     "classnames": "^2.3.1",
     "deep-equal": "^2.0.5",
     "eslint-config-react-app": "^6.0.0",
     "flexlayout-react": "^0.5.12",
     "handlebars": "^4.7.7",
     "history": "^5.0.1",
     "json-format": "^1.0.1",
-    "notistack": "^1.0.9",
-    "pouchdb": "^7.2.2",
-    "pouchdb-adapter-idb": "^7.2.2",
-    "pouchdb-find": "^7.2.2",
+    "notistack": "^2.0.3",
     "prism-themes": "^1.7.0",
     "prismjs": "^1.24.0",
     "pubsub-js": "^1.9.3",
@@ -53,24 +49,24 @@
     "react-hook-form": "^7.15.4",
     "react-hotkeys-hook": "^3.3.2",
     "react-icons": "^4.2.0",
-    "react-pouchdb": "^2.1.0",
     "react-redux": "^7.2.5",
     "react-router": "^6.0.0-beta.8",
     "react-router-dom": "6",
     "react-select": "^4.3.1",
     "react-simple-code-editor": "^0.11.0",
     "rebass": "^4.0.7",
+    "reconnecting-websocket": "^4.4.0",
     "redux": "^4.1.1",
+    "redux-persist": "^6.0.0",
     "regenerator-runtime": "^0.13.9",
+    "rete-comment-plugin": "^0.7.0-rc.1",
     "rete-connection-reroute-plugin": "^0.4.0",
     "rete-context-menu-plugin": "^0.6.0-rc.1",
     "rete-react-render-plugin": "^0.2.1",
-    "rxdb": "^9.21.0",
-    "rxjs": "^7.2.0",
+    "sharedb": "^2.2.5",
     "unique-names-generator": "^4.5.0",
     "uuid": "^8.3.2",
-    "web-vitals": "^1.0.1",
-    "wouter": "^2.7.4"
+    "web-vitals": "^1.0.1"
   },
   "devDependencies": {
     "@babel/plugin-external-helpers": "^7.14.5",
@@ -82,6 +78,11 @@
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
+    "@types/jest": "^26.0.24",
+    "@types/node": "^16.4.3",
+    "@types/react": "^17.0.15",
+    "@types/react-dom": "^17.0.9",
+    "@types/react-redux": "^7.1.18",
     "@welldone-software/why-did-you-render": "^6.2.1",
     "babel-loader": "^8.2.2",
     "babel-plugin-transform-class-properties": "^6.24.1",

client/src/App.tsx

@@ -1,20 +1,23 @@
 import { Routes, Route, Navigate } from 'react-router-dom'
 
-import { useTabManager } from './contexts/TabManagerProvider'
-import RequireAuth from './features/common/RequireAuth/RequireAuth'
-import ThothPageWrapper from './features/common/ThothPage/ThothPageWrapper'
-import HomeScreen from './features/HomeScreen/HomeScreen'
-import Thoth from './features/Thoth/Thoth'
+import RequireAuth from './components/RequireAuth/RequireAuth'
+import ThothPageWrapper from './components/ThothPage/ThothPageWrapper'
+import HomeScreen from './screens/HomeScreen/HomeScreen'
+import Thoth from './screens/Thoth/Thoth'
 import { useAuth } from './contexts/AuthProvider'
 
 import 'flexlayout-react/style/dark.css'
 import './design-globals/design-globals.css'
 import './App.css'
+import { activeTabSelector, selectAllTabs } from './state/tabs'
+import { useSelector } from 'react-redux'
+import { RootState } from './state/store'
 //These need to be imported last to override styles.
 
 function App() {
   // Use our routes
-  const { tabs, activeTab } = useTabManager()
+  const tabs = useSelector((state: RootState) => selectAllTabs(state.tabs))
+  const activeTab = useSelector(activeTabSelector)
   const { user } = useAuth()
 
   const redirect = () => {

client/src/features/common/Accordion.tsx → client/src/components/Accordion.tsx

@@ -1,9 +1,9 @@
-import Accordion from '@material-ui/core/Accordion'
-import AccordionDetails from '@material-ui/core/AccordionDetails'
-import AccordionSummary from '@material-ui/core/AccordionSummary'
-import { makeStyles } from '@material-ui/core/styles'
-import Typography from '@material-ui/core/Typography'
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
+import Accordion from '@mui/material/Accordion'
+import AccordionDetails from '@mui/material/AccordionDetails'
+import AccordionSummary from '@mui/material/AccordionSummary'
+import makeStyles from '@mui/styles/makeStyles'
+import Typography from '@mui/material/Typography'
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
 
 import css from './accordion.module.css'
 import Icon from './Icon/Icon'
@@ -12,7 +12,7 @@ import './accordion-overrides.css'
 const useStyles = makeStyles(theme => ({
   root: {
     width: '100%',
-    backgroundColor: 'var(--dark-3)',
+    backgroundColor: 'var(--dark-3) !important',
     boxShadow: 'none',
     padding: '0',
   },
@@ -59,7 +59,8 @@ export const SimpleAccordion = ({ setExpanded = x => {}, ...props }) => {
           className={classes.accordionSummary}
           classes={{
             root: classes.root,
-            expandIcon: classes.expandIcon,
+            expandIconWrapper: classes.expandIcon,
+            // content: classes.root,
             // accordionSummaryContent: classes.summaryContent
           }}
           id="panel1a-header"

client/src/features/common/Chip/Chip.jsx → client/src/components/Chip/Chip.tsx

@@ -1,10 +1,18 @@
 import Icon from '../Icon/Icon'
 import css from './chip.module.css'
 
-const Chip = ({ label, onClick, noEvents }) => {
+const Chip = ({
+  label,
+  onClick,
+  noEvents,
+}: {
+  label: string
+  onClick?: () => {}
+  noEvents?: boolean
+}) => {
   return (
     <div
-      className={`${css['chip']} ${css[noEvents && 'no-events']}`}
+      className={`${css['chip']} ${noEvents && css['no-events']}`}
       onClick={onClick}
     >
       {label}

client/src/features/common/Icon/icon.module.css → client/src/components/Icon/icon.module.css

@@ -136,3 +136,7 @@
 .trash:hover {
   background-image: url('dangerTrash.svg');
 }
+
+.node-lock {
+  background-image: url('node-lock.svg');
+}

client/src/features/common/Icon/icon.module.css.d.ts → client/src/components/Icon/icon.module.css.d.ts

@@ -18,6 +18,7 @@ interface CssExports {
   'minus': string;
   'moon': string;
   'newnode': string;
+  'node-lock': string;
   'pause': string;
   'person': string;
   'play': string;