diff --git a/todoblue/Dockerfile b/todoblue/Dockerfile index aa47219..73e7a4e 100644 --- a/todoblue/Dockerfile +++ b/todoblue/Dockerfile @@ -1,9 +1,11 @@ FROM node:20 WORKDIR /usr/src/todoblue -COPY ./ ./ +COPY ./package.json ./yarn.lock ./ RUN yarn install + +COPY ./ ./ RUN yarn run build ENTRYPOINT ["yarn", "run", "start", "--port=8081"] diff --git a/todoblue/src/app/RootFooter.tsx b/todoblue/src/app/RootFooter.tsx index b18bb69..41b84e4 100644 --- a/todoblue/src/app/RootFooter.tsx +++ b/todoblue/src/app/RootFooter.tsx @@ -1,20 +1,14 @@ -"use client"; - import style from "@/app/page.module.css" -import {useServersideConfiguration} from "@/app/ServersideConfigurationManager" import {default as React} from "react" export function RootFooter() { - const {baseURL} = useServersideConfiguration() - return ( ) diff --git a/todoblue/src/app/RootHeader.tsx b/todoblue/src/app/RootHeader.tsx index 4628cae..d9f2d01 100644 --- a/todoblue/src/app/RootHeader.tsx +++ b/todoblue/src/app/RootHeader.tsx @@ -1,17 +1,12 @@ -"use client"; - import style from "@/app/page.module.css" -import {useServersideConfiguration} from "@/app/ServersideConfigurationManager" import {default as React} from "react" export function RootHeader() { - const {siteName} = useServersideConfiguration() - return (

- {siteName} + Todoblue

) diff --git a/todoblue/src/app/ServersideConfigurationManager.tsx b/todoblue/src/app/ServersideConfigurationManager.tsx deleted file mode 100644 index 732cd72..0000000 --- a/todoblue/src/app/ServersideConfigurationManager.tsx +++ /dev/null @@ -1,47 +0,0 @@ -"use client"; -import {createContext, ReactNode, useContext} from "react" - - -/** - * **Object** containing the site options configurable via runtime environment variables. - */ -export interface ServersideConfiguration { - siteName: string, - baseURL: string, -} - -/** - * **Context** where the {@link ServersideConfiguration} is stored in. - */ -export const ServersideConfigurationContext = createContext(null); - -/** - * **Component** acting as a provider for the {@link ServersideConfigurationContext} for its children. - * - * Required to execute only on the client. - * - * @param value The {@link ServersideConfiguration} to provide. - * @param children The {@link ReactNode}s to provide the {@link ServersideConfiguration} to. - * @constructor - */ -export function ServersideConfigurationManager({value, children}: {value: ServersideConfiguration, children: ReactNode}) { - return ( - - {children} - - ) -} - -/** - * **Hook** to access the globally provided {@link ServersideConfiguration} from children components. - */ -export function useServersideConfiguration(): ServersideConfiguration { - const context = useContext(ServersideConfigurationContext); - - if(context === null) { - console.error("[useServersideConfiguration] Was used outside of a ServersideConfigurationContext!") - throw Error("Used useServersideConfiguration outside of a ServersideConfigurationContext.") - } - - return context -} diff --git a/todoblue/src/app/board/[board]/useBoardWebSocketURL.ts b/todoblue/src/app/board/[board]/useBoardWebSocketURL.ts index 0914d8c..785cb0a 100644 --- a/todoblue/src/app/board/[board]/useBoardWebSocketURL.ts +++ b/todoblue/src/app/board/[board]/useBoardWebSocketURL.ts @@ -1,10 +1,17 @@ -import {useServersideConfiguration} from "@/app/ServersideConfigurationManager" +"use client"; import {useMemo} from "react" -export function useBoardWebSocketURL(name: string) { - const {baseURL} = useServersideConfiguration() +const HTTP_TO_WS = { + "http:": "ws:", + "https:": "wss:", +} - const webSocketURL = useMemo(() => `${baseURL}/board/${name}/ws`, [name]); +export function useBoardWebSocketURL(name: string) { + // @ts-ignore + const protocol = HTTP_TO_WS[window.location.protocol] + const host = window.location.host + + const webSocketURL = useMemo(() => `${protocol}//${host}/api/board/${name}/ws`, [name]); return {webSocketURL} } diff --git a/todoblue/src/app/layout.tsx b/todoblue/src/app/layout.tsx index 301e9fc..24d83b1 100644 --- a/todoblue/src/app/layout.tsx +++ b/todoblue/src/app/layout.tsx @@ -2,8 +2,6 @@ import "./layout.css"; import {AppBody} from "@/app/AppBody" -import {ServersideConfigurationManager} from "@/app/ServersideConfigurationManager" -import {useServersideConfigurationEnvvars} from "@/app/useServersideConfigurationEnvvars" import type {Metadata as NextMetadata} from "next" import {default as React, ReactNode} from "react" @@ -12,22 +10,18 @@ config.autoAddCss = false; export const metadata: NextMetadata = { - applicationName: process.env["TODOBLUE_SITE_NAME"] ?? "Todoblue", + applicationName: "Todoblue", title: "Home", - description: process.env["TODOBLUE_SITE_DESCRIPTION"] ?? "Self-hosted multiplayer todo app", + description: "Self-hosted multiplayer todo app", viewport: {userScalable: false} } export default function layout({children}: { children: ReactNode }) { - const serversideConfiguration = useServersideConfigurationEnvvars() - return ( - - - {children} - - + + {children} + ) } diff --git a/todoblue/src/app/useServersideConfigurationEnvvars.ts b/todoblue/src/app/useServersideConfigurationEnvvars.ts deleted file mode 100644 index 510df38..0000000 --- a/todoblue/src/app/useServersideConfigurationEnvvars.ts +++ /dev/null @@ -1,17 +0,0 @@ -import "server-only"; -import {ServersideConfiguration} from "@/app/ServersideConfigurationManager" - - -export function useServersideConfigurationEnvvars(): ServersideConfiguration { - const siteName = process.env["TODOBLUE_SITE_NAME"] - const baseURL = process.env["TODORED_BASE_URL"] - - if(!siteName) { - throw Error("TODOBLUE_SITE_NAME is not set.") - } - if(!baseURL) { - throw Error("TODORED_BASE_URL is not set.") - } - - return {siteName, baseURL} -} diff --git a/todopod/config/caddy/Caddyfile b/todopod/config/caddy/Caddyfile new file mode 100644 index 0000000..e3019a3 --- /dev/null +++ b/todopod/config/caddy/Caddyfile @@ -0,0 +1,8 @@ +:8080 { + route /api/* { + uri strip_prefix /api + reverse_proxy "http://red:8080" + } + + reverse_proxy "http://blue:8081" +} diff --git a/todopod/docker-compose.yml b/todopod/docker-compose.yml index ca44a60..676874a 100644 --- a/todopod/docker-compose.yml +++ b/todopod/docker-compose.yml @@ -13,12 +13,12 @@ services: restart: unless-stopped environment: REDIS_CONN: "redis://redis:6379/" # You probably don't need to change this - ports: - - "127.0.0.1:8080:8080" blue: image: "ghcr.io/steffo99/todocolors-blue" restart: unless-stopped - environment: - NEXT_PUBLIC_API_BASE_URL: "ws://example.org:8080" # Change this to the URL where red will be accessible at - ports: - - "127.0.0.1:8081:8081" + caddy: + image: "caddy" + restart: unless-stopped + volumes: + - "./data/caddy:/data" + - "./config/caddy/Caddyfile:/etc/caddy/Caddyfile"