refactor(profile): migrate edit profile modal to SolidJS (@AzureNightlock)

.github/workflows/monkey-ci.yml

@@ -28,7 +28,7 @@ jobs:
       should-build-be: ${{ steps.export-changes.outputs.should-build-be }}
       should-build-fe: ${{ steps.export-changes.outputs.should-build-fe }}
       should-build-pkg: ${{ steps.export-changes.outputs.should-build-pkg }}
-      assets-json: ${{ steps.export-changes.outputs.assets-json }}
+      assets-or-styles: ${{ steps.export-changes.outputs.assets-or-styles }}
 
     steps:
       - name: Full checkout
@@ -41,8 +41,9 @@ jobs:
         id: filter
         with:
           filters: |
-            json:
+            assets-or-styles:
               - 'frontend/static/**/*'
+              - '**/*.{scss,css}'
             be-src:
               - 'backend/**/*.{ts,js,json,lua,css,html}'
               - 'backend/package.json'
@@ -64,13 +65,13 @@ jobs:
           echo "should-build-pkg=${{ steps.filter.outputs.pkg-src }}" >> $GITHUB_OUTPUT
           echo "should-build-be=${{ steps.filter.outputs.be-src }}" >> $GITHUB_OUTPUT
           echo "should-build-fe=${{ steps.filter.outputs.fe-src }}" >> $GITHUB_OUTPUT
-          echo "assets-json=${{ steps.filter.outputs.json }}" >> $GITHUB_OUTPUT
+          echo "assets-or-styles=${{ steps.filter.outputs.assets-or-styles }}" >> $GITHUB_OUTPUT
 
   prime-cache:
     name: prime-cache
     runs-on: ubuntu-latest
     needs: [pre-ci]
-    if: needs.pre-ci.outputs.should-build-be == 'true' || needs.pre-ci.outputs.should-build-fe == 'true' || needs.pre-ci.outputs.should-build-pkg == 'true' || needs.pre-ci.outputs.assets-json == 'true' || contains(github.event.pull_request.labels.*.name, 'force-full-ci')
+    if: needs.pre-ci.outputs.should-build-be == 'true' || needs.pre-ci.outputs.should-build-fe == 'true' || needs.pre-ci.outputs.should-build-pkg == 'true' || needs.pre-ci.outputs.assets-or-styles == 'true' || contains(github.event.pull_request.labels.*.name, 'force-full-ci')
     steps:
       - name: Checkout pnpm-lock
         uses: actions/checkout@v4
@@ -216,7 +217,7 @@ jobs:
     name: ci-assets
     needs: [pre-ci, prime-cache]
     runs-on: ubuntu-latest
-    if: needs.pre-ci.outputs.assets-json == 'true' || contains(github.event.pull_request.labels.*.name, 'force-full-ci')
+    if: needs.pre-ci.outputs.assets-or-styles == 'true' || contains(github.event.pull_request.labels.*.name, 'force-full-ci')
     steps:
       - uses: actions/checkout@v4
         with:
@@ -228,6 +229,10 @@ jobs:
         id: filter
         with:
           filters: |
+            styles:
+              - '**/*.{scss,css}'
+            json:
+              - 'frontend/static/**/*.json'
             languages:
               - 'frontend/static/languages/**'
             quotes:
@@ -265,7 +270,12 @@ jobs:
       - name: Install dependencies
         run: pnpm install
 
+      - name: Lint styles
+        if: steps.filter.outputs.styles == 'true'
+        run: npm run lint-styles
+
       - name: Lint JSON
+        if: steps.filter.outputs.json == 'true'
         run: npm run lint-json-assets
 
       - name: Validate language assets

.gitignore

@@ -132,4 +132,4 @@ frontend/static/webfonts-preview
 .turbo
 frontend/.env.sentry-build-plugin
 .claude/worktrees
-1024MiB
+1024MiB

README.md

@@ -69,4 +69,4 @@ All of the [contributors](https://github.com/monkeytypegame/monkeytype/graphs/co
 
 # Support
 
-If you wish to support further development and feel extra awesome, you can [donate](https://ko-fi.com/monkeytype), [become a Patron](https://www.patreon.com/monkeytype) or [buy a t-shirt](https://www.monkeytype.store/).
+If you wish to support further development and feel extra awesome, you can [donate](https://ko-fi.com/monkeytype), [become a Patron](https://www.patreon.com/monkeytype), or [buy a t-shirt](https://www.monkeytype.store/).

backend/package.json

@@ -45,15 +45,15 @@
     "mjml": "4.15.0",
     "mongodb": "6.3.0",
     "mustache": "4.2.0",
-    "nodemailer": "8.0.4",
+    "nodemailer": "8.0.5",
     "object-hash": "3.0.0",
     "prom-client": "15.1.3",
     "rate-limiter-flexible": "5.0.3",
     "simple-git": "3.32.3",
     "string-similarity": "4.0.4",
     "swagger-stats": "0.99.7",
     "ua-parser-js": "0.7.33",
-    "uuid": "10.0.0",
+    "uuid": "14.0.0",
     "winston": "3.6.0",
     "zod": "3.23.8"
   },
@@ -77,7 +77,7 @@
     "@types/swagger-stats": "0.95.11",
     "@types/ua-parser-js": "0.7.36",
     "@types/uuid": "10.0.0",
-    "@vitest/coverage-v8": "4.0.15",
+    "@vitest/coverage-v8": "4.1.5",
     "concurrently": "8.2.2",
     "openapi3-ts": "2.0.2",
     "oxlint": "1.60.0",

backend/private/style.css

@@ -81,7 +81,7 @@ body {
   bottom: 3rem;
   background-color: var(--sub-alt-color);
   color: var(--text-color);
-  font-style: bold;
+  font-weight: bold;
   border-radius: 3px;
   padding: 1rem 2rem;
   cursor: pointer;
@@ -189,10 +189,6 @@ input[type="checkbox"] {
   }
 }
 
-.tooltip:hover .tooltip-text {
-  display: block;
-}
-
 .tooltip-text {
   display: none;
   color: var(--text-color);
@@ -202,3 +198,7 @@ input[type="checkbox"] {
   padding: 10px;
   border-radius: var(--roundness);
 }
+
+.tooltip:hover .tooltip-text {
+  display: block;
+}

frontend/__tests__/components/common/AsyncContent.spec.tsx

@@ -142,7 +142,7 @@ describe("AsyncContent", () => {
       query: {
         result: string | Error;
       },
-      options?: Omit<Props<unknown>, "query" | "queries" | "children">,
+      options?: Omit<Props<{ result: string }>, "queries" | "children">,
     ): {
       container: HTMLElement;
     } {
@@ -160,12 +160,18 @@ describe("AsyncContent", () => {
         }));
 
         return (
-          <AsyncContent query={myQuery} {...(options as Props<string>)}>
-            {(data: string | undefined) => (
+          <AsyncContent
+            queries={{ result: myQuery }}
+            {...(options as Props<{ result: string | undefined }>)}
+          >
+            {({ resultData }) => (
               <>
                 static content
-                <Show when={data !== undefined} fallback={<div>no data</div>}>
-                  <div data-testid="content">{data}</div>
+                <Show
+                  when={resultData() !== undefined}
+                  fallback={<div>no data</div>}
+                >
+                  <div data-testid="content">{resultData()}</div>
                 </Show>
               </>
             )}
@@ -318,7 +324,10 @@ describe("AsyncContent", () => {
         first: string | Error | undefined;
         second: string | Error | undefined;
       },
-      options?: Omit<Props<unknown>, "query" | "queries" | "children">,
+      options?: Omit<
+        Props<{ first: string; second: string }>,
+        "queries" | "children"
+      >,
     ): {
       container: HTMLElement;
     } {
@@ -347,24 +356,20 @@ describe("AsyncContent", () => {
         }));
 
         type Q = { first: string | undefined; second: string | undefined };
+
         return (
           <AsyncContent
             queries={{ first: firstQuery, second: secondQuery }}
             {...(options as Props<Q>)}
           >
-            {(results: {
-              first: string | undefined;
-              second: string | undefined;
-            }) => (
+            {({ firstData, secondData }) => (
               <>
                 <Show
-                  when={
-                    results.first !== undefined && results.second !== undefined
-                  }
+                  when={firstData() !== undefined && secondData() !== undefined}
                   fallback={<div>no data</div>}
                 >
-                  <div data-testid="first">{results.first}</div>
-                  <div data-testid="second">{results.second}</div>
+                  <div data-testid="first">{firstData()}</div>
+                  <div data-testid="second">{secondData()}</div>
                 </Show>
               </>
             )}