Merge pull request #48 from victoralvesf/development

Update main base with version 0.1.3
victoralvesf · Oct 2, 2024 · 306af2a · 306af2a
2 parents b046624 + fef2ccd
commit 306af2a
Show file tree

Hide file tree

Showing 17 changed files with 77 additions and 23 deletions.
diff --git a/.gitignore b/.gitignore
@@ -25,3 +25,6 @@ dist-ssr
 
 cypress/screenshots
 cypress/videos
+
+# Docker env file
+env-config.js
diff --git a/Dockerfile b/Dockerfile
@@ -3,16 +3,22 @@ FROM node:20-alpine AS build
 
 WORKDIR /app
 
-COPY package*.json ./
-RUN npm install --legacy-peer-deps
+RUN npm install -g pnpm
+COPY package.json ./
+COPY pnpm-lock.yaml ./
+RUN pnpm install --ignore-scripts
 COPY . .
-RUN npm run build
+RUN pnpm run build
 
 # Final stage
 FROM nginx:alpine
 
 COPY --chown=nginx:nginx --from=build /app/dist /usr/share/nginx/html
+COPY env-config.js.template /usr/share/nginx/html/env-config.js.template
 COPY nginx.conf.template /etc/nginx/templates/default.conf.template
 
+COPY set-variables.sh /docker-entrypoint.d/99-set-variables.sh
+RUN chmod +x /docker-entrypoint.d/99-set-variables.sh
+
 EXPOSE 8080
 CMD ["nginx", "-g", "daemon off;"]
diff --git a/README.md b/README.md
@@ -116,6 +116,9 @@ services:
     restart: unless-stopped
     ports:
       - 8080:8080
+    environment:
+      - SERVER_URL=http://address:port
+      - HIDE_SERVER=true # When it's true AND SERVER_URL is set, only username and password will be visible on login.
 ```
 
 ### Recommended IDE Setup

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -7,3 +7,7 @@ services:
     restart: unless-stopped
     ports:
       - 8080:8080
+    environment:
+      # When it's true AND SERVER_URL is set, only username and password will be visible on login.
+      # - HIDE_SERVER=true
+      # - SERVER_URL=http://address:port
diff --git a/env-config.js.template b/env-config.js.template
@@ -0,0 +1,3 @@
+"use strict";
+window.SERVER_URL="${SERVER_URL}" || undefined;
+window.HIDE_SERVER="${HIDE_SERVER}" === "true";
diff --git a/index.html b/index.html
@@ -15,6 +15,7 @@
 
   <body>
     <div id="root"></div>
+    <script src="/env-config.js"></script>
     <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "aonsoku",
   "private": true,
-  "version": "0.1.2",
+  "version": "0.1.3",
   "type": "module",
   "scripts": {
     "dev": "vite",

diff --git a/public/favicons/site.webmanifest b/public/favicons/site.webmanifest
@@ -1,19 +1,20 @@
 {
-    "name": "",
-    "short_name": "",
+    "name": "Aonsoku",
+    "short_name": "Aonsoku",
+    "description": "A modern desktop client for Navidrome/Subsonic servers.",
+    "theme_color": "#060E23",
+    "background_color": "#20b358",
+    "display": "standalone",
     "icons": [
         {
-            "src": "/android-chrome-192x192.png",
+            "src": "/favicons/android-chrome-192x192.png",
             "sizes": "192x192",
             "type": "image/png"
         },
         {
-            "src": "/android-chrome-512x512.png",
+            "src": "/favicons/android-chrome-512x512.png",
             "sizes": "512x512",
             "type": "image/png"
         }
-    ],
-    "theme_color": "#060E23",
-    "background_color": "#20b358",
-    "display": "standalone"
+    ]
 }
diff --git a/set-variables.sh b/set-variables.sh
@@ -0,0 +1,4 @@
+#!/bin/sh
+
+# Replace environment variables on the template and create the definitive config file.
+envsubst < /usr/share/nginx/html/env-config.js.template > /usr/share/nginx/html/env-config.js
diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "aonsoku"
-version = "0.1.2"
+version = "0.1.3"
 description = "A modern desktop client for Navidrome/Subsonic servers."
 authors = ["Victor Alves"]
 edition = "2021"

diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
@@ -7,7 +7,7 @@
   },
   "package": {
     "productName": "Aonsoku",
-    "version": "0.1.2"
+    "version": "0.1.3"
   },
   "tauri": {
     "allowlist": {

diff --git a/src/app/components/login/form.tsx b/src/app/components/login/form.tsx
@@ -1,5 +1,6 @@
 import { zodResolver } from '@hookform/resolvers/zod'
 import { useQueryClient } from '@tanstack/react-query'
+import clsx from 'clsx'
 import { Loader2 } from 'lucide-react'
 import { useState } from 'react'
 import { useForm } from 'react-hook-form'
@@ -30,7 +31,7 @@ import {
 } from '@/app/components/ui/form'
 import { Input } from '@/app/components/ui/input'
 import { ROUTES } from '@/routes/routesList'
-import { useAppActions } from '@/store/app.store'
+import { useAppActions, useAppData } from '@/store/app.store'
 import { removeSlashFromUrl } from '@/utils/removeSlashFromUrl'
 
 const loginSchema = z.object({
@@ -50,17 +51,26 @@ const loginSchema = z.object({
 
 type FormData = z.infer<typeof loginSchema>
 
+const defaultUrl = 'http://'
+const url = window.SERVER_URL || defaultUrl
+const urlIsValid = url !== defaultUrl
+
 export function LoginForm() {
   const [loading, setLoading] = useState(false)
   const { saveConfig } = useAppActions()
+  const { hideServer } = useAppData()
   const navigate = useNavigate()
   const { t } = useTranslation()
   const queryClient = useQueryClient()
 
+  const shouldHideUrlInput = urlIsValid && hideServer
+
   const form = useForm<FormData>({
     resolver: zodResolver(loginSchema),
-    defaultValues: {
-      url: 'http://',
+    values: {
+      url,
+      username: '',
+      password: '',
     },
   })
 
@@ -102,7 +112,7 @@ export function LoginForm() {
               control={form.control}
               name="url"
               render={({ field }) => (
-                <FormItem>
+                <FormItem className={clsx(shouldHideUrlInput && 'hidden')}>
                   <FormLabel className="required">
                     {t('login.form.url')}
                   </FormLabel>
@@ -129,7 +139,7 @@ export function LoginForm() {
               control={form.control}
               name="username"
               render={({ field }) => (
-                <FormItem>
+                <FormItem className={clsx(shouldHideUrlInput && '!mt-0')}>
                   <FormLabel className="required">
                     {t('login.form.username')}
                   </FormLabel>

diff --git a/src/store/app.store.ts b/src/store/app.store.ts
@@ -8,6 +8,8 @@ import { pingServer } from '@/api/pingServer'
 import { AuthType, IAppContext, IServerConfig } from '@/types/serverConfig'
 import { saltWord, toHex } from '@/utils/salt'
 
+const { HIDE_SERVER } = window
+
 export const useAppStore = createWithEqualityFn<IAppContext>()(
   subscribeWithSelector(
     persist(
@@ -21,6 +23,7 @@ export const useAppStore = createWithEqualityFn<IAppContext>()(
             password: '',
             authType: AuthType.TOKEN,
             logoutDialogState: false,
+            hideServer: HIDE_SERVER ?? false,
           },
           command: {
             open: false,
@@ -110,7 +113,11 @@ export const useAppStore = createWithEqualityFn<IAppContext>()(
           return merge(currentState, persistedState)
         },
         partialize: (state) => {
-          const appStore = omit(state, 'data.logoutDialogState')
+          const appStore = omit(
+            state,
+            'data.logoutDialogState',
+            'data.hideServer',
+          )
 
           return appStore
         },

diff --git a/src/types/index.d.ts b/src/types/index.d.ts
@@ -0,0 +1,8 @@
+export {}
+
+declare global {
+  interface Window {
+    SERVER_URL: string | undefined
+    HIDE_SERVER: boolean | undefined
+  }
+}
diff --git a/src/types/serverConfig.ts b/src/types/serverConfig.ts
@@ -14,6 +14,7 @@ export interface IAppData extends IServerConfig {
   isServerConfigured: boolean
   osType: string
   logoutDialogState: boolean
+  hideServer: boolean
 }
 
 export interface IAppActions {

diff --git a/tsconfig.json b/tsconfig.json
@@ -31,9 +31,12 @@
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
+    "typeRoots": [
+      "./node_modules/@types",
+      "./src/types"
+    ],
     "types": [
-      "cypress",
-      "node"
+      "cypress"
     ]
   },
   "include": [