Fix build issues

ansible/host_vars/tipi.yml

@@ -11,6 +11,7 @@ packages:
   - npm
 
 username: nicolas
+jwt_secret: test
 
 ### ZSH Settings
 zsh_theme: "powerlevel10k/powerlevel10k"

ansible/tasks/common/system-api.yml

@@ -14,6 +14,7 @@
     dest: "{{ playbook_dir }}/../system-api/.env"
     content: |
       ROOT_FOLDER={{ playbook_dir }}/../
+      JWT_SECRET={{ jwt_secret }}
 
 - name: Install packages based on package.json.
   community.general.npm:

dashboard/.dockerignore

@@ -0,0 +1,2 @@
+node_modules/
+.next/

dashboard/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:latest
+FROM node:18
 
 WORKDIR /app
 

dashboard/package.json

@@ -19,9 +19,9 @@
     "framer-motion": "^6",
     "immer": "^9.0.12",
     "js-cookie": "^3.0.1",
-    "next": "12.1.4",
-    "react": "18.0.0",
-    "react-dom": "18.0.0",
+    "next": "12.1.6",
+    "react": "18.1.0",
+    "react-dom": "18.1.0",
     "react-final-form": "^6.5.9",
     "react-icons": "^4.3.1",
     "swr": "^1.3.0",
@@ -31,9 +31,9 @@
   },
   "devDependencies": {
     "@types/js-cookie": "^3.0.2",
-    "@types/node": "17.0.23",
-    "@types/react": "17.0.43",
-    "@types/react-dom": "17.0.14",
+    "@types/node": "17.0.31",
+    "@types/react": "18.0.8",
+    "@types/react-dom": "18.0.3",
     "@types/validator": "^13.7.2",
     "@typescript-eslint/eslint-plugin": "^5.18.0",
     "autoprefixer": "^10.4.4",
@@ -42,6 +42,6 @@
     "eslint-config-next": "12.1.4",
     "postcss": "^8.4.12",
     "tailwindcss": "^3.0.23",
-    "typescript": "4.6.3"
+    "typescript": "4.6.4"
   }
 }

dashboard/src/components/Layout/Layout.tsx

@@ -10,6 +10,7 @@ import MenuDrawer from './MenuDrawer';
 interface IProps {
   loading?: boolean;
   breadcrumbs?: { name: string; href: string; current?: boolean }[];
+  children: React.ReactNode;
 }
 
 const Layout: React.FC<IProps> = ({ children, loading, breadcrumbs }) => {

dashboard/src/components/Layout/MenuDrawer.tsx

@@ -4,6 +4,7 @@ import React from 'react';
 interface IProps {
   isOpen: boolean;
   onClose: () => void;
+  children: React.ReactNode;
 }
 
 const MenuDrawer: React.FC<IProps> = ({ children, isOpen, onClose }) => {

dashboard/src/modules/Auth/components/AuthFormLayout.tsx

@@ -4,6 +4,7 @@ import React from 'react';
 interface IProps {
   title: string;
   description: string;
+  children: React.ReactNode;
 }
 
 const AuthFormLayout: React.FC<IProps> = ({ children, title, description }) => {

dashboard/src/modules/Auth/containers/AuthWrapper.tsx

@@ -4,7 +4,11 @@ import { useAuthStore } from '../../../state/authStore';
 import Login from './Login';
 import Onboarding from './Onboarding';
 
-const AuthWrapper: React.FC = ({ children }) => {
+interface IProps {
+  children: React.ReactNode;
+}
+
+const AuthWrapper: React.FC<IProps> = ({ children }) => {
   const [initialLoad, setInitialLoad] = useState(true);
   const { configured, user, me, fetchConfigured } = useAuthStore();
 

scripts/start.sh

@@ -47,7 +47,12 @@ fi
 
 # Copy the app state if it isn't here
 if [[ ! -f "${STATE_FOLDER}/apps.json" ]]; then
-  cp "${ROOT_FOLDER}/templates/apps-sample.json" "${STATE_FOLDER}/apps.json"
+  cp "${ROOT_FOLDER}/templates/apps-sample.json" "${STATE_FOLDER}/apps.json" && chown -R "1000:1000" "${STATE_FOLDER}/users.json"
+fi
+
+# Copy the user state if it isn't here
+if [[ ! -f "${STATE_FOLDER}/users.json" ]]; then
+  cp "${ROOT_FOLDER}/templates/users-sample.json" "${STATE_FOLDER}/users.json" && chown -R "1000:1000" "${STATE_FOLDER}/users.json"
 fi
 
 export DOCKER_CLIENT_TIMEOUT=240
@@ -84,8 +89,6 @@ docker-compose --env-file "${ROOT_FOLDER}/.env" up --detach --remove-orphans --b
   exit 1
 }
 
-
-
 str=$(get_json_field ${STATE_FOLDER}/apps.json installed)
 apps_to_start=($str)