From 7b9799ac115bec3a6237e14ca8e70c6d43a9ef97 Mon Sep 17 00:00:00 2001 From: Anton Shubin <2spy4x@gmail.com> Date: Wed, 31 Jan 2024 13:39:46 +0800 Subject: [PATCH] env: deploy script & minor ui changes --- apps/front/.env.example | 3 + apps/front/Makefile | 20 ++ apps/front/package.json | 6 +- apps/front/pnpm-lock.yaml | 20 +- apps/front/prod.compose.yml | 31 ++++ apps/front/prod.deploy.files.txt | 3 + .../lib/client/components/chartMotion.svelte | 4 +- .../lib/client/components/chartPower.svelte | 4 +- .../lib/client/components/chartVoltage.svelte | 4 +- .../src/lib/client/components/table.svelte | 2 +- apps/front/src/routes/+layout.ts | 1 + apps/front/src/routes/+page.svelte | 6 +- apps/front/src/routes/admin/+page.svelte | 3 + .../routes/devices/{[id] => 1}/+page.svelte | 0 .../devices/{[id] => 1}/add/+page.svelte | 0 apps/front/src/routes/map/+page.svelte | 175 +++++++++--------- .../src/routes/notifications/+page.svelte | 3 + apps/front/src/routes/reports/+page.svelte | 3 + apps/front/src/routes/settings/+page.svelte | 3 + apps/front/svelte.config.js | 2 +- 20 files changed, 181 insertions(+), 112 deletions(-) create mode 100644 apps/front/.env.example create mode 100644 apps/front/Makefile create mode 100644 apps/front/prod.compose.yml create mode 100644 apps/front/prod.deploy.files.txt create mode 100644 apps/front/src/routes/+layout.ts create mode 100644 apps/front/src/routes/admin/+page.svelte rename apps/front/src/routes/devices/{[id] => 1}/+page.svelte (100%) rename apps/front/src/routes/devices/{[id] => 1}/add/+page.svelte (100%) create mode 100644 apps/front/src/routes/notifications/+page.svelte create mode 100644 apps/front/src/routes/reports/+page.svelte create mode 100644 apps/front/src/routes/settings/+page.svelte diff --git a/apps/front/.env.example b/apps/front/.env.example new file mode 100644 index 0000000..77d5efc --- /dev/null +++ b/apps/front/.env.example @@ -0,0 +1,3 @@ +SSH_TO_SERVER=user@server +PATH_APPS=~/apps +HOSTNAME_GB_APP=gb.example.com diff --git a/apps/front/Makefile b/apps/front/Makefile new file mode 100644 index 0000000..3a43546 --- /dev/null +++ b/apps/front/Makefile @@ -0,0 +1,20 @@ +.PHONY: * +-include .env.prod +export $(shell sed 's/=.*//' .env.prod) + +# Replace env variables in index.html +build: + pnpm run build + +# Copy files to server +copy-files: + rsync -avhzru -P -e ssh --include-from='prod.deploy.files.txt' --exclude '*' ./ $(SSH_TO_SERVER):$(PATH_APPS)/gb + +# Deploy Immich +up-gb: + ssh homelab "cd $(PATH_APPS)/gb && docker compose --env-file ../.env --env-file .env.prod -f prod.compose.yml up -d" + +deploy: + make build + make copy-files + make up-gb diff --git a/apps/front/package.json b/apps/front/package.json index bebdf74..b225f07 100644 --- a/apps/front/package.json +++ b/apps/front/package.json @@ -11,15 +11,15 @@ "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch", "test": "vitest", "lint": "prettier --check . && eslint .", - "format": "prettier --write ." + "format": "prettier --write .", + "prod:deploy": "make deploy" }, "dependencies": { "chart.js": "^4.4.1", - "pnpm": "^8.15.0", "svelte-chartjs": "^3.1.2" }, "devDependencies": { - "@sveltejs/adapter-auto": "^3.0.0", + "@sveltejs/adapter-static": "^3.0.1", "@sveltejs/kit": "^2.0.0", "@sveltejs/vite-plugin-svelte": "^3.0.0", "@tailwindcss/forms": "^0.5.7", diff --git a/apps/front/pnpm-lock.yaml b/apps/front/pnpm-lock.yaml index 16e079d..066f48b 100644 --- a/apps/front/pnpm-lock.yaml +++ b/apps/front/pnpm-lock.yaml @@ -8,17 +8,14 @@ dependencies: chart.js: specifier: ^4.4.1 version: 4.4.1 - pnpm: - specifier: ^8.15.0 - version: 8.15.0 svelte-chartjs: specifier: ^3.1.2 version: 3.1.2(chart.js@4.4.1)(svelte@4.2.9) devDependencies: - '@sveltejs/adapter-auto': - specifier: ^3.0.0 - version: 3.1.1(@sveltejs/kit@2.4.3) + '@sveltejs/adapter-static': + specifier: ^3.0.1 + version: 3.0.1(@sveltejs/kit@2.4.3) '@sveltejs/kit': specifier: ^2.0.0 version: 2.4.3(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.9)(vite@5.0.12) @@ -551,13 +548,12 @@ packages: resolution: {integrity: sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==} dev: true - /@sveltejs/adapter-auto@3.1.1(@sveltejs/kit@2.4.3): - resolution: {integrity: sha512-6LeZft2Fo/4HfmLBi5CucMYmgRxgcETweQl/yQoZo/895K3S9YWYN4Sfm/IhwlIpbJp3QNvhKmwCHbsqQNYQpw==} + /@sveltejs/adapter-static@3.0.1(@sveltejs/kit@2.4.3): + resolution: {integrity: sha512-6lMvf7xYEJ+oGeR5L8DFJJrowkefTK6ZgA4JiMqoClMkKq0s6yvsd3FZfCFvX1fQ0tpCD7fkuRVHsnUVgsHyNg==} peerDependencies: '@sveltejs/kit': ^2.0.0 dependencies: '@sveltejs/kit': 2.4.3(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.9)(vite@5.0.12) - import-meta-resolve: 4.0.0 dev: true /@sveltejs/kit@2.4.3(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.9)(vite@5.0.12): @@ -2068,12 +2064,6 @@ packages: pathe: 1.1.2 dev: true - /pnpm@8.15.0: - resolution: {integrity: sha512-6kVRfVKF0SPqwCw3k1Bfof1tqQovxg0ejZ4MHpKSiG7Pr/UT8GK50cyAIbuGFQM7GsW+o7LuP8FlptcDS75rAw==} - engines: {node: '>=16.14'} - hasBin: true - dev: false - /postcss-import@15.1.0(postcss@8.4.33): resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==} engines: {node: '>=14.0.0'} diff --git a/apps/front/prod.compose.yml b/apps/front/prod.compose.yml new file mode 100644 index 0000000..bffd235 --- /dev/null +++ b/apps/front/prod.compose.yml @@ -0,0 +1,31 @@ +version: '3.8' + +networks: + proxy: + external: true + +services: + gb-app: + container_name: gb-app + image: nginx:alpine + volumes: + - ./build:/usr/share/nginx/html:ro + restart: unless-stopped + networks: + - proxy + - default + deploy: + resources: + limits: + memory: 256M + cpus: '0.25' + security_opt: + - no-new-privileges:true + labels: + - "traefik.enable=true" + - "traefik.docker.network=proxy" + - "traefik.http.routers.gb-app.rule=Host(`${HOSTNAME_GB_APP}`)" + - "traefik.http.routers.gb-app.entrypoints=websecure" + - "traefik.http.routers.gb-app.tls=true" + - "traefik.http.routers.gb-app.tls.certresolver=myresolver" + - "traefik.http.services.gb-app.loadbalancer.server.port=80" \ No newline at end of file diff --git a/apps/front/prod.deploy.files.txt b/apps/front/prod.deploy.files.txt new file mode 100644 index 0000000..2234cab --- /dev/null +++ b/apps/front/prod.deploy.files.txt @@ -0,0 +1,3 @@ +build/*** +prod.compose.yml +.env.prod diff --git a/apps/front/src/lib/client/components/chartMotion.svelte b/apps/front/src/lib/client/components/chartMotion.svelte index 5daa500..9cddd29 100644 --- a/apps/front/src/lib/client/components/chartMotion.svelte +++ b/apps/front/src/lib/client/components/chartMotion.svelte @@ -18,7 +18,7 @@ labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'], datasets: [ { - label: 'Motion detection', + label: 'Motion detection, # of people', fill: true, lineTension: 0.3, backgroundColor: 'rgba(225, 204,230, .3)', @@ -36,7 +36,7 @@ pointHoverBorderWidth: 2, pointRadius: 1, pointHitRadius: 10, - data: [65, 59, 80, 81, 56, 55, 40] + data: [900, 850, 1000, 1200, 1500, 1300, 1100] } ] }; diff --git a/apps/front/src/lib/client/components/chartPower.svelte b/apps/front/src/lib/client/components/chartPower.svelte index e88ae25..36840ce 100644 --- a/apps/front/src/lib/client/components/chartPower.svelte +++ b/apps/front/src/lib/client/components/chartPower.svelte @@ -18,7 +18,7 @@ labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'], datasets: [ { - label: 'Power consumption', + label: 'Power consumption, kWh', fill: true, lineTension: 0.3, backgroundColor: 'rgba(225, 204,230, .3)', @@ -36,7 +36,7 @@ pointHoverBorderWidth: 2, pointRadius: 1, pointHitRadius: 10, - data: [65, 59, 80, 81, 56, 55, 40] + data: [1200, 1100, 1850, 1500, 1600, 1550, 1450] } ] }; diff --git a/apps/front/src/lib/client/components/chartVoltage.svelte b/apps/front/src/lib/client/components/chartVoltage.svelte index 4f635f5..376a62c 100644 --- a/apps/front/src/lib/client/components/chartVoltage.svelte +++ b/apps/front/src/lib/client/components/chartVoltage.svelte @@ -18,7 +18,7 @@ labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'], datasets: [ { - label: 'Voltage', + label: 'Voltage, V', fill: true, lineTension: 0.3, backgroundColor: 'rgba(225, 204,230, .3)', @@ -36,7 +36,7 @@ pointHoverBorderWidth: 2, pointRadius: 1, pointHitRadius: 10, - data: [65, 59, 80, 81, 56, 55, 40] + data: [224, 223, 221, 220, 222, 224, 223] } ] }; diff --git a/apps/front/src/lib/client/components/table.svelte b/apps/front/src/lib/client/components/table.svelte index e063f6e..3f1d47e 100644 --- a/apps/front/src/lib/client/components/table.svelte +++ b/apps/front/src/lib/client/components/table.svelte @@ -1,6 +1,6 @@
-
- +

Create new zones with edit buttons:

+
-
-
-
- - -
+ - +
+
+
+ - + +
-
- - -
-
-
-
-
-
-
- - - - - - - - - - - - - - {#each { length: 10 } as item, index} - - - - - - - - - - {/each} - - -
Zone nameGatewaysLampsSensorsScheduleOn/OffActions
- Zone #{index + 1} - 12 20 40 View - - -
- Edit - Delete -
-
-
-
-
+ + + + +
+ + +
+
+
+
+
+
+
+ + + + + + + + + + + + + + {#each {length: 10} as item, index} + + + + + + + + + + {/each} + + +
Zone nameGatewaysLampsSensorsScheduleOn/OffActions
+ Zone #{index + 1} + 12 2040View + + +
+ Edit + Delete +
+
+
+
+
diff --git a/apps/front/src/routes/notifications/+page.svelte b/apps/front/src/routes/notifications/+page.svelte new file mode 100644 index 0000000..df8b4b3 --- /dev/null +++ b/apps/front/src/routes/notifications/+page.svelte @@ -0,0 +1,3 @@ +

+ To be discussed... +

diff --git a/apps/front/src/routes/reports/+page.svelte b/apps/front/src/routes/reports/+page.svelte new file mode 100644 index 0000000..df8b4b3 --- /dev/null +++ b/apps/front/src/routes/reports/+page.svelte @@ -0,0 +1,3 @@ +

+ To be discussed... +

diff --git a/apps/front/src/routes/settings/+page.svelte b/apps/front/src/routes/settings/+page.svelte new file mode 100644 index 0000000..df8b4b3 --- /dev/null +++ b/apps/front/src/routes/settings/+page.svelte @@ -0,0 +1,3 @@ +

+ To be discussed... +

diff --git a/apps/front/svelte.config.js b/apps/front/svelte.config.js index 2b35fe1..78a97fe 100644 --- a/apps/front/svelte.config.js +++ b/apps/front/svelte.config.js @@ -1,4 +1,4 @@ -import adapter from '@sveltejs/adapter-auto'; +import adapter from '@sveltejs/adapter-static'; import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'; /** @type {import('@sveltejs/kit').Config} */