Merge pull request #760 from MarechJ/frontend/v2-beta

UI Version 2 - BETA

.dockerignore

@@ -7,10 +7,13 @@ docker-templates/
 *.log
 *.pyc
 events/
-rcongui/node_modules/
 *.tar
 *.gz
 db_data_bu/
 config/
+
 rcongui/dist/
-rcongui/build/
+rcongui/node_modules/
+
+rcongui_public/dist/
+rcongui_public/node_modules/

.gitignore

@@ -1,6 +1,5 @@
 # Compose files are templated now
 compose.yaml
-frontend/
 db_data/
 .env
 broadcasts.txt

Dockerfile-frontend

@@ -1,42 +1,38 @@
-FROM node:20-buster-slim as build
+ARG buildImage=node:20-buster-slim
+
+FROM $buildImage AS adminbuild
 
 RUN apt update && apt install -y git
 
 WORKDIR /code
 
-RUN mkdir /pw
-
-COPY rcongui/package.json package.json
-COPY rcongui/package-lock.json package-lock.json
-
-RUN npm ci
-
-ENV REACT_APP_API_URL /api/
-
 COPY rcongui/ .
-
+RUN npm ci
+ENV REACT_APP_API_URL=/api/
 COPY .git/ .git/
-RUN git describe --tags > /code/tag_version
+RUN git describe --tags > /code/tag_version && rm -rf .git
 RUN npx browserslist@latest --update-db
-# Normal build
 RUN npm run build
-
 RUN mv /code/dist /www
-# Public build
-ENV REACT_APP_PUBLIC_BUILD true
+
+FROM $buildImage AS publicbuild
+
+WORKDIR /code_public
+COPY rcongui_public/ .
+RUN npm ci
 RUN npm run build
-RUN mv /code/dist /www_public
+RUN mv /code_public/dist /www_public
 
 FROM nginx:mainline-alpine
 
-RUN apk add openssl
+RUN apk add --no-cache openssl
 COPY rcongui/nginx.conf /etc/nginx/conf.d/default.conf
 WORKDIR /var/www
 
 RUN mkdir /var/www_public/
-COPY --from=build /www_public /var/www_public/
-COPY --from=build /www /var/www/
-COPY --from=build /code/tag_version /code/tag_version
+COPY --from=publicbuild /www_public /var/www_public/
+COPY --from=adminbuild /www /var/www/
+COPY --from=adminbuild /code/tag_version /code/tag_version
 
 VOLUME /certs
 COPY rcongui/entrypoint.sh /code/entrypoint.sh

alembic/versions/1e8fd0c19cb0_update_message_template_enum.py

@@ -0,0 +1,24 @@
+"""Update message template enum
+
+Revision ID: 1e8fd0c19cb0
+Revises: f9614e41e6e5
+Create Date: 2024-10-29 18:37:09.613989
+
+"""
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = '1e8fd0c19cb0'
+down_revision = 'f9614e41e6e5'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    op.execute("ALTER TYPE message_template_category ADD VALUE IF NOT EXISTS 'AUTO_SETTINGS';")
+
+
+def downgrade():
+    pass

alembic/versions/f9614e41e6e5_shared_message_templates.py

@@ -0,0 +1,46 @@
+"""Shared message templates
+
+Revision ID: f9614e41e6e5
+Revises: f48c611a3f56
+Create Date: 2024-09-30 18:17:46.775392
+
+"""
+
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = "f9614e41e6e5"
+down_revision = "f48c611a3f56"
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    op.create_table(
+        "message_template",
+        sa.Column("id", sa.Integer(), nullable=False),
+        sa.Column("title", sa.String(), nullable=False),
+        sa.Column("content", sa.String(), nullable=False),
+        sa.Column(
+            "category",
+            sa.Enum(
+                "MESSAGE",
+                "BROADCAST",
+                "WELCOME",
+                "REASON",
+                name="message_template_category",
+            ),
+            nullable=False,
+        ),
+        sa.Column("created_at", sa.DateTime(), nullable=False),
+        sa.Column("updated_at", sa.DateTime(), nullable=False),
+        sa.Column("updated_by", sa.String(), nullable=False),
+        sa.PrimaryKeyConstraint("id"),
+    )
+
+
+def downgrade():
+    op.drop_table("message_template")
+    op.execute("DROP TYPE message_template_category")

frontend/.editorconfig

@@ -0,0 +1,13 @@
+# Editor configuration, see http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

frontend/.eslintignore

@@ -0,0 +1 @@
+node_modules

frontend/.eslintrc.json

@@ -0,0 +1,35 @@
+{
+  "root": true,
+  "ignorePatterns": ["**/*"],
+  "plugins": ["@nx"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {
+        "@nx/enforce-module-boundaries": [
+          "error",
+          {
+            "enforceBuildableLibDependency": true,
+            "allow": [],
+            "depConstraints": [
+              {
+                "sourceTag": "*",
+                "onlyDependOnLibsWithTags": ["*"]
+              }
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "extends": ["plugin:@nx/typescript"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "extends": ["plugin:@nx/javascript"],
+      "rules": {}
+    }
+  ]
+}

frontend/.github/workflows/ci.yml

@@ -0,0 +1,39 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+
+permissions:
+  actions: read
+  contents: read
+
+jobs:
+  main:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      # This enables task distribution via Nx Cloud
+      # Run this command as early as possible, before dependencies are installed
+      # Learn more at https://nx.dev/ci/reference/nx-cloud-cli#npx-nxcloud-startcirun
+      - run: npx nx-cloud start-ci-run --distribute-on="3 linux-medium-js" --stop-agents-after="e2e-ci"
+
+      # Cache node_modules
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+
+      - run: npm ci --legacy-peer-deps
+      - uses: nrwl/nx-set-shas@v4
+
+      # Prepend any command with "nx-cloud record --" to record its logs to Nx Cloud
+      # - run: npx nx-cloud record -- echo Hello World
+      # Nx Affected runs only tasks affected by the changes in this PR/commit. Learn more: https://nx.dev/ci/features/affected
+      - run: npx nx affected -t lint test build
+      - run: npx nx affected --parallel 1 -t e2e-ci

frontend/.gitignore

@@ -0,0 +1,49 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# negate parent gitignore
+!lib
+
+# compiled output
+dist
+tmp
+/out-tsc
+
+# dependencies
+node_modules
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+yarn-error.log
+testem.log
+/typings
+
+# System Files
+.DS_Store
+Thumbs.db
+
+.nx/cache
+.nx/workspace-data
+
+# Next.js
+.next
+out

frontend/.prettierignore

@@ -0,0 +1,5 @@
+# Add files here to ignore them from prettier formatting
+/dist
+/coverage
+/.nx/cache
+/.nx/workspace-data

frontend/.prettierrc

@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}

frontend/README.md

@@ -0,0 +1,70 @@
+# Frontend
+
+<a alt="Nx logo" href="https://nx.dev" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-logo.png" width="45"></a>
+
+✨ **This workspace has been generated by [Nx, Smart Monorepos · Fast CI.](https://nx.dev)** ✨
+
+## Integrate with editors
+
+Enhance your Nx experience by installing [Nx Console](https://nx.dev/nx-console) for your favorite editor. Nx Console
+provides an interactive UI to view your projects, run tasks, generate code, and more! Available for VSCode, IntelliJ and
+comes with a LSP for Vim users.
+
+## Install Public App
+
+- Run `cd <your_rcon_path>/frontend` to enter the project.
+- Run `npm install` to install all dependencies.
+- Run `cd apps/public` to change directory.
+- Run `cp .env.example .env`.
+- Modify `CRCON_URL` inside `.env` to your needs or leave the default value.
+
+## Start the application
+
+Run `npx nx dev public` to start the development server. Happy coding!
+
+## Build for production
+
+Run `npx nx build public` to build the application. The build artifacts are stored in the output directory (e.g. `dist/` or `build/`), ready to be deployed.
+
+## Running tasks
+
+To execute tasks with Nx use the following syntax:
+
+```
+npx nx <target> <project> <...options>
+```
+
+You can also run multiple targets:
+
+```
+npx nx run-many -t <target1> <target2>
+```
+
+..or add `-p` to filter specific projects
+
+```
+npx nx run-many -t <target1> <target2> -p <proj1> <proj2>
+```
+
+Targets can be defined in the `package.json` or `projects.json`. Learn more [in the docs](https://nx.dev/features/run-tasks).
+
+## Set up CI!
+
+Nx comes with local caching already built-in (check your `nx.json`). On CI you might want to go a step further.
+
+- [Set up remote caching](https://nx.dev/features/share-your-cache)
+- [Set up task distribution across multiple machines](https://nx.dev/nx-cloud/features/distribute-task-execution)
+- [Learn more how to setup CI](https://nx.dev/recipes/ci)
+
+## Explore the project graph
+
+Run `npx nx graph` to show the graph of the workspace.
+It will show tasks that you can run with Nx.
+
+- [Learn more about Exploring the Project Graph](https://nx.dev/core-features/explore-graph)
+
+## Connect with us!
+
+- [Join the community](https://nx.dev/community)
+- [Subscribe to the Nx Youtube Channel](https://www.youtube.com/@nxdevtools)
+- [Follow us on Twitter](https://twitter.com/nxdevtools)