From 6847493fbfccfca8963cc5c288ac87dda10719f1 Mon Sep 17 00:00:00 2001 From: NlightN22 Date: Sun, 3 Mar 2024 15:36:01 +0700 Subject: [PATCH] rename production environments --- .env.docker | 8 +++----- Dockerfile | 4 ++-- README.md | 8 +++----- example/example.docker-compose.yml | 8 +++----- src/App.tsx | 31 ++++++++++++------------------ src/shared/env.const.ts | 13 ++++++------- src/widgets/FrigateHostsTable.tsx | 2 -- 7 files changed, 29 insertions(+), 45 deletions(-) diff --git a/.env.docker b/.env.docker index eca9a73..a918719 100644 --- a/.env.docker +++ b/.env.docker @@ -1,5 +1,3 @@ -REACT_APP_HOST=localhost -REACT_APP_PORT=5173 -REACT_APP_FRIGATE_PROXY=http://localhost:4000 -REACT_APP_OPENID_SERVER=https://your.server.com:443/realms/your-realm -REACT_APP_CLIENT_ID=frontend-client \ No newline at end of file +FRIGATE_PROXY=http://localhost:4000 +OPENID_SERVER=https://your.server.com:443/realms/your-realm +CLIENT_ID=frontend-client \ No newline at end of file diff --git a/Dockerfile b/Dockerfile index be9fba8..0db2d86 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,7 +1,7 @@ # syntax=docker/dockerfile:1 # Build commands: -# - rm build -r -Force ; yarn build -# - $VERSION=0.2 +# - $VERSION=0.4 +# - rm build -r -Force ; rm ./node_modules/.cache/babel-loader -r -Force ; yarn build # - docker build --pull --rm -t oncharterliz/multi-frigate:latest -t oncharterliz/multi-frigate:$VERSION "." # - docker image push --all-tags oncharterliz/multi-frigate diff --git a/README.md b/README.md index 47fccfc..aa0eeeb 100644 --- a/README.md +++ b/README.md @@ -8,11 +8,9 @@ services: front: image: oncharterliz/multi-frigate:latest environment: - REACT_APP_HOST: localhost - REACT_APP_PORT: 5173 - REACT_APP_FRIGATE_PROXY: http://localhost:4000 - REACT_APP_OPENID_SERVER: https://server:port/realms/your-realm - REACT_APP_CLIENT_ID: frontend-client + FRIGATE_PROXY: http://localhost:4000 + OPENID_SERVER: https://server:port/realms/your-realm + CLIENT_ID: frontend-client ports: - 80:80 # set your port here ``` diff --git a/example/example.docker-compose.yml b/example/example.docker-compose.yml index 214472b..c9848eb 100644 --- a/example/example.docker-compose.yml +++ b/example/example.docker-compose.yml @@ -4,10 +4,8 @@ services: front: image: oncharterliz/multi-frigate:latest environment: - REACT_APP_HOST: localhost - REACT_APP_PORT: 5173 - REACT_APP_FRIGATE_PROXY: http://localhost:4000 - REACT_APP_OPENID_SERVER: https://server:port/realms/your-realm - REACT_APP_CLIENT_ID: frontend-client + FRIGATE_PROXY: http://localhost:4000 + OPENID_SERVER: https://server:port/realms/your-realm + CLIENT_ID: frontend-client ports: - 80:80 # set your port here \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx index bf1a9ce..98611de 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -20,7 +20,7 @@ const queryClient = new QueryClient({ }) function App() { - const maxErrorAuthConts = 2 + const maxErrorAuthCounts = 2 const systemColorScheme = useColorScheme() const [colorScheme, setColorScheme] = useState(getCookie('mantine-color-scheme') as ColorScheme || systemColorScheme) const [authErrorCounter, setAuthErrorCounter] = useState(0) @@ -35,33 +35,33 @@ function App() { // automatically sign-in useEffect(() => { if (!hasAuthParams() && - !auth.isAuthenticated && !auth.activeNavigator && !auth.isLoading && authErrorCounter < maxErrorAuthConts) { - console.log('Not authenticated! Redirect! ErrorCounter', authErrorCounter) + !auth.isAuthenticated && !auth.activeNavigator && !auth.isLoading && authErrorCounter < maxErrorAuthCounts) { + console.error('Not authenticated! Redirect! ErrorCounter', authErrorCounter) setAuthErrorCounter(prevCount => prevCount + 1) auth.signinRedirect() } - }, [auth, auth.isAuthenticated, auth.activeNavigator, auth.isLoading, auth.signinRedirect]) + }, [auth, auth.isAuthenticated, auth.activeNavigator, auth.isLoading, auth.signinRedirect, authErrorCounter]) if (auth.activeNavigator || auth.isLoading) { return } - if (authErrorCounter > maxErrorAuthConts) { - console.log('maxErrorAuthConts authority', keycloakConfig.authority) - console.log('maxErrorAuthConts client_id', keycloakConfig.client_id) - console.log('maxErrorAuthConts redirect_uri', keycloakConfig.redirect_uri) + if (authErrorCounter > maxErrorAuthCounts) { + console.error('maxErrorAuthCounts authority', keycloakConfig.authority) + console.error('maxErrorAuthCounts client_id', keycloakConfig.client_id) + console.error('maxErrorAuthCounts redirect_uri', keycloakConfig.redirect_uri) return auth.signinRedirect()} /> } - if (!auth.isAuthenticated && !auth.isLoading && authErrorCounter < maxErrorAuthConts) { + if (!auth.isAuthenticated && !auth.isLoading && authErrorCounter < maxErrorAuthCounts) { if (hasAuthParams()) { - console.log('auth.isAuthenticated', auth.isAuthenticated) - console.log('auth.isLoading', auth.isLoading) + console.warn('Not authenticated, isAuthenticated:', auth.isAuthenticated) + console.warn('Not authenticated, isLoading:', auth.isLoading) return auth.signinRedirect()} /> } else { - console.log('Not authenticated! Redirect! auth ErrorCounter', authErrorCounter) + console.error('Not authenticated! Redirect! Error Counter:', authErrorCounter) setAuthErrorCounter(prevCount => prevCount + 1); auth.signinRedirect() } @@ -89,13 +89,6 @@ function App() { radius: "xl", } }, - // Image: { - // styles: (theme) => ({ - // placeholder: { - // backgroundColor: 'transparent', - // } - // }) - // }, } }} > diff --git a/src/shared/env.const.ts b/src/shared/env.const.ts index 7ce1f22..e11f5e2 100644 --- a/src/shared/env.const.ts +++ b/src/shared/env.const.ts @@ -2,17 +2,16 @@ import { z } from "zod" export const appMode = process.env.NODE_ENV export const isProduction = appMode === "production" -export const host = isProduction ? window.env?.REACT_APP_HOST : process.env.HOST -export const port = isProduction ? window.env?.REACT_APP_PORT : process.env.PORT - -const proxy = isProduction ? window.env?.REACT_APP_FRIGATE_PROXY : process.env.REACT_APP_FRIGATE_PROXY +const proxy = isProduction ? window.env?.FRIGATE_PROXY : process.env.REACT_APP_FRIGATE_PROXY +const proxyParsed = z.string().url().safeParse(proxy) +if (!proxyParsed.success) throw Error(`FRIGATE_PROXY must be string and URL. FRIGATE_PROXY:${proxy}`) export const proxyURL = new URL(proxy || '') -const oidpServer = isProduction ? window.env?.REACT_APP_OPENID_SERVER : process.env.REACT_APP_OPENID_SERVER +const oidpServer = isProduction ? window.env?.OPENID_SERVER : process.env.REACT_APP_OPENID_SERVER const oidpServerParsed= z.string().url().safeParse(oidpServer) -if (!oidpServerParsed.success) throw Error('REACT_APP_OPENID_SERVER must be string and URL') -const oidpClientId = isProduction ? window.env?.REACT_APP_CLIENT_ID : process.env.REACT_APP_CLIENT_ID +if (!oidpServerParsed.success) throw Error(`OPENID_SERVER must be string and URL. OPENID_SERVER:${oidpServer}`) +const oidpClientId = isProduction ? window.env?.CLIENT_ID : process.env.REACT_APP_CLIENT_ID export const oidpSettings = { server: oidpServer || '', clientId: oidpClientId || '', diff --git a/src/widgets/FrigateHostsTable.tsx b/src/widgets/FrigateHostsTable.tsx index a7f1ca6..89b026d 100644 --- a/src/widgets/FrigateHostsTable.tsx +++ b/src/widgets/FrigateHostsTable.tsx @@ -24,8 +24,6 @@ const FrigateHostsTable = ({ data, showAddButton = false, saveCallback, changedC const [reversed, setReversed] = useState(false) const [sortedName, setSortedName] = useState(null) - console.log('data', data) - console.log('tableData', tableData) useEffect(() => { setTableData(data);