chore: migrated ui from db

.editorconfig

@@ -0,0 +1,17 @@
+# http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[Makefile]
+indent_style = tab
+indent_size = 4

.github/workflows/ci.yml

@@ -0,0 +1,59 @@
+name: Deploy tweaks to GitHub Pages
+
+on:
+  push:
+    branches: ['main']
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: write
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: 'pages'
+  cancel-in-progress: false
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - uses: oven-sh/setup-bun@v1
+        with:
+          bun-version: latest
+
+      - run: bun ci
+
+      - name: Validate Tweaks
+        run: bun test
+
+      - run: bun run build
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: './dist'
+
+  deploy:
+    needs: build
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -0,0 +1,8 @@
+node_modules/
+tweaks/schema.json
+tweaks/tweaks.json
+tweaks/*.md
+# Ignore any sub directories under tweaks
+tweaks/*/
+dist/
+*.py

.postcssrc.json

@@ -0,0 +1,8 @@
+{
+  "plugins": {
+    "autoprefixer": {},
+    "tailwindcss/nesting": {},
+    "tailwindcss": {},
+    "cssnano": {}
+  }
+}

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "trailingComma": "es5",
+  "semi": true,
+  "singleQuote": true,
+  "editorconfig": true,
+  "printWidth": 120
+}

.vscode/settings.json

@@ -0,0 +1,23 @@
+{
+  "css.customData": [".vscode/tailwind.json"],
+  "nixEnvSelector.suggestion": false,
+  "editor.detectIndentation": false,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true,
+  "editor.codeActionsOnSave": ["source.addMissingImports", "source.fixAll.eslint"],
+  "[nix]": {
+    "editor.defaultFormatter": "jnoortheen.nix-ide"
+  },
+  "nix.enableLanguageServer": true,
+  "nix.serverPath": "nixd",
+  "[toml]": {
+    "editor.defaultFormatter": "tamasfe.even-better-toml"
+  },
+  "[rust]": {
+    "editor.defaultFormatter": "rust-lang.rust-analyzer"
+  },
+  "nixEnvSelector.nixFile": "${workspaceFolder}/shell.nix",
+  "nixEnvSelector.args": "--impure",
+  "tailwindCSS.suggestions": true,
+  "tailwindCSS.experimental.classRegex": ["className: '(.*)'"]
+}

.vscode/tailwind.json

@@ -0,0 +1,55 @@
+{
+  "version": 1.1,
+  "atDirectives": [
+    {
+      "name": "@tailwind",
+      "description": "Use the `@tailwind` directive to insert Tailwind's `base`, `components`, `utilities` and `screens` styles into your CSS.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#tailwind"
+        }
+      ]
+    },
+    {
+      "name": "@apply",
+      "description": "Use the `@apply` directive to inline any existing utility classes into your own custom CSS. This is useful when you find a common utility pattern in your HTML that you’d like to extract to a new component.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#apply"
+        }
+      ]
+    },
+    {
+      "name": "@responsive",
+      "description": "You can generate responsive variants of your own classes by wrapping their definitions in the `@responsive` directive:\n```css\n@responsive {\n  .alert {\n    background-color: #E53E3E;\n  }\n}\n```\n",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#responsive"
+        }
+      ]
+    },
+    {
+      "name": "@screen",
+      "description": "The `@screen` directive allows you to create media queries that reference your breakpoints by **name** instead of duplicating their values in your own CSS:\n```css\n@screen sm {\n  /* ... */\n}\n```\n…gets transformed into this:\n```css\n@media (min-width: 640px) {\n  /* ... */\n}\n```\n",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#screen"
+        }
+      ]
+    },
+    {
+      "name": "@variants",
+      "description": "Generate `hover`, `focus`, `active` and other **variants** of your own utilities by wrapping their definitions in the `@variants` directive:\n```css\n@variants hover, focus {\n   .btn-brand {\n    background-color: #3182CE;\n  }\n}\n```\n",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#variants"
+        }
+      ]
+    }
+  ]
+}

LICENSE

@@ -0,0 +1,7 @@
+Copyright 2023 Rainbow Café
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Makefile

@@ -0,0 +1,6 @@
+develop:
+ifeq ($(shell printenv IN_NIX_SHELL),)
+	@nix develop --impure --command $(shell printenv SHELL)
+else
+	$(info You are already running in a nix shell!)
+endif

README.md

@@ -0,0 +1,50 @@
+## Protontweaks
+
+> [!IMPORTANT]  
+> This is the Protontweaks UI repository, you can find its sister repositories at the following links...
+>
+> - [CLI](https://github.com/rain-cafe/protontweaks)
+> - [DB](https://github.com/rain-cafe/protontweaks-db)
+
+### Usage
+
+Its highly recommended that if you're planning on fetching tweaks from our api that you lock into a specific version.
+
+`https://tweaks.rains.cafe/api/v2/<app-id>.json`
+
+Old versions will get any new apps that are added, however if a feature isn't supported in the old api it won't get mapped.
+
+### Adding a tweak?
+
+- Lookup your the app id of your steam app.
+
+> [!TIP]
+> You can discover the app id by using [https://steamdb.info](https://steamdb.info/apps/)!
+
+- Copy the contents of [template](./tweaks/.template.json) and create a json file with the name `[your-app-id].json`
+- Add any dlls, fonts, etc.
+- Create a PR with your changes!
+
+### Example Tweak File
+
+```ts
+{
+  "name": "They Are Billions",
+  "tweaks": {
+    // Specify any protontricks here
+    "tricks": ["gdiplus"],
+    // Set any environment variables here
+    "env": {},
+    "settings": {
+      // Informs the client that ESync should be disabled
+      "esync": false,
+      // Informs the client that FSync should be disabled
+      "fsync": false
+    }
+  }
+}
+```
+
+### TODO
+
+- Add support for gpu vendor specific configs

flake.nix

@@ -0,0 +1,15 @@
+{
+  description = "Orchestrator";
+
+  inputs.nixpkgs.url = "github:NixOS/nixpkgs/nixos-unstable";
+
+  outputs = { nixpkgs, ... }: let
+    forAllSystems = nixpkgs.lib.genAttrs nixpkgs.lib.systems.flakeExposed;
+  in {
+    # Devshell for bootstrapping; acessible via 'nix develop' or 'nix-shell' (legacy)
+    devShells = forAllSystems (systems:
+      let pkgs = nixpkgs.legacyPackages.${systems};
+      in import ./shell.nix { inherit pkgs; }
+    );
+  };
+}

index.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="X-UA-Compatible" content="ie-edge" />
+    <link rel="icon" type="image/png" href="../public/favicon.png" />
+    <link rel="stylesheet" href="./src/index.css" />
+    <title>Protontweaks</title>
+
+    <script>
+      // This is here purely to get React to shut up about React DevTools
+      // https://github.com/facebook/react/issues/24283
+      console.info = new Proxy(console.info, {
+        apply: (target, thisArg, args) => {
+          if (args?.[0]?.includes?.('React DevTools')) return;
+          return Reflect.apply(target, thisArg, args);
+        },
+      });
+    </script>
+  </head>
+  <body>
+    <noscript>Your browser does not support JavaScript!</noscript>
+    <div id="root"></div>
+
+    <script type="module" src="./src/index.tsx"></script>
+  </body>
+</html>

nixpkgs.nix

@@ -0,0 +1,8 @@
+# A nixpkgs instance that is grabbed from the pinned nixpkgs commit in the lock file
+# Useful to avoid using channels when using legacy nix commands
+let lock = (builtins.fromJSON (builtins.readFile ./flake.lock)).nodes.nixpkgs.locked;
+in
+import (fetchTarball {
+  url = "https://github.com/nixos/nixpkgs/archive/${lock.rev}.tar.gz";
+  sha256 = lock.narHash;
+})

package.json

@@ -0,0 +1,33 @@
+{
+  "name": "protontweaks-db",
+  "type": "module",
+  "scripts": {
+    "ci": "bun install --frozen-lockfile",
+    "dev": "vite dev",
+    "build": "vite build"
+  },
+  "dependencies": {
+    "@rain-cafe/js-utils": "^1.0.0",
+    "@rain-cafe/react-utils": "^2.3.0",
+    "@tanstack/react-query": "^5.24.8",
+    "clsx": "^2.1.0",
+    "lucide-react": "^0.344.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-router-dom": "^6.22.2",
+    "sonner": "^1.4.3",
+    "tailwind-merge": "^2.2.1"
+  },
+  "devDependencies": {
+    "@types/bun": "^1.0.8",
+    "@types/react": "^18.2.62",
+    "@types/react-dom": "^18.2.19",
+    "@vitejs/plugin-react": "^4.2.1",
+    "autoprefixer": "^10.4.18",
+    "cssnano": "^6.0.5",
+    "postcss": "^8.4.35",
+    "tailwindcss": "^3.4.1",
+    "vite": "^5.1.5",
+    "vitest": "^1.3.1"
+  }
+}

shell.nix

@@ -0,0 +1,15 @@
+# Shell for bootstrapping flake-enabled nix and home-manager
+# Enter it through 'nix develop' or (legacy) 'nix-shell'
+
+{ pkgs ? (import ./nixpkgs.nix) { } }: {
+  default = pkgs.mkShell {
+    # Enable experimental features without having to specify the argument
+    NIX_CONFIG = "experimental-features = nix-command flakes";
+    buildInputs = with pkgs; [
+      nixpkgs-fmt
+      nixd
+      bun
+      nodejs_20
+    ];
+  };
+}