Revert "Changelog"

This reverts commit 0c1c7e2fe8.
Changelog
2026-08-01 13:45:53 +00:00 · 2026-03-24 16:36:42 -04:00 · 2026-03-24 16:33:09 -04:00 · 2026-03-24 16:28:37 -04:00
2617 changed files with 83878 additions and 407613 deletions
@@ -1,5 +1,5 @@
 # Windows has stack overflows when calling from Tauri, so we increase the default stack size used by the compiler
-[target."cfg(windows)"]
+[target.'cfg(windows)']
 rustflags = ["-C", "link-args=/STACK:16777220"]

 [target.x86_64-pc-windows-msvc]
@@ -22,5 +22,4 @@ Refer to the standards: @standards/frontend/CROSS_PLATFORM_PAGES.md and @standar
   - Move the page component into `packages/ui/src/layouts/wrapped/` matching the route structure.
   - Replace any platform-specific imports with shared utilities.
   - Import and render the wrapped page from both frontends as a simple component.
-   - If the layout uses TanStack Query for initial route paint with `ReadyTransition` / `useReadyState`, each platform route shell must call `ensureQueryData` for those queries with matching keys and fetchers — see **Platform route shells: prefetch with `ensureQueryData`** in `standards/frontend/CROSS_PLATFORM_PAGES.md`.
 6. **Verify** the page renders correctly by checking for missing imports and that all DI contracts are satisfied.
@@ -1,36 +0,0 @@
---
-name: review-changelog
-description: Review the latest changelog entry in packages/blog/changelog.ts against the project's changelog style guide and flag bullets that need rewriting. Use when checking a freshly added changelog entry before opening a PR, or when the user asks to review/lint the latest changelog.
-argument-hint: [product?]
---
-
-Refer to the standard: @standards/maintaining/CHANGELOG.md
-
-## Steps
-
-1. **Locate the latest entry:**
-   - Open `packages/blog/changelog.ts`.
-   - The latest entries are at the top of the `VERSIONS` array.
-   - If `$ARGUMENTS` specifies a product (`web`, `hosting`, `app`), review the most recent entry for that product. Otherwise, review the most recent entry overall, plus any sibling entries sharing the same `date` (coordinated releases ship together).
-
-2. **Read the standard above** in full before reviewing. The bullet rules, section/verb agreement, and "Don't" list are the source of truth.
-
-3. **Check the entry shell:**
-   - `date` is a valid ISO 8601 timestamp.
-   - `product` is one of `web`, `hosting`, `app`.
-   - `version` is present for `app` entries and omitted for `web`/`hosting`.
-   - Section headings use `## Added`, `## Changed`, `## Fixed`, `## Security` (or a featured-release linked heading). Flag legacy `## Improvements`.
-
-4. **Review each bullet** against the standard. For each bullet, check:
-   - Voice/tense matches the section heading.
-   - Opening verb agrees with its section.
-   - Describes observable behavior, not implementation.
-   - Specific enough to identify the surface (names the tab/page/modal).
-   - One sentence, ends with a period, sentence case.
-   - Uses branded names (Modrinth App, Modrinth Hosting) correctly.
-   - No filler ("issue with", "issue where", "various", "some"), no vague intensifiers, no apologies, no PR/commit references (unless crediting a third-party contributor with a linked GitHub profile).
-   - Not a duplicate sub-fix of a bigger change already listed.
-
-5. **Report findings** as a short list grouped by entry. For each problem bullet, show the original line and a suggested rewrite. If the entry is clean, say so explicitly. Do not edit the file unless the user asks - this skill is a review pass, not a rewrite pass.
-
-6. **If the user then asks to apply fixes**, edit `packages/blog/changelog.ts` directly using the suggested rewrites. Preserve tab indentation and template literal formatting.
@@ -9,6 +9,8 @@ body:
      options:
        - label: I checked the [existing issues](https://github.com/modrinth/code/issues?q=is%3Aissue) for duplicate feature requests
          required: true
+        - label: I have checked that this feature request is not on our [roadmap](https://roadmap.modrinth.com)
+          required: true
  - type: dropdown
    id: projects
    attributes:
@@ -81,6 +81,6 @@ Please follow these rules precisely:
 Use existing patterns from our codebase:

 - Variables/plurals: see `apps/frontend/src/pages/frog.vue`
- Rich-text link tags: see `apps/frontend/src/error.vue`
+- Rich-text link tags: see `apps/frontend/src/pages/auth/welcome.vue` and `apps/frontend/src/error.vue`

 When you finish, there should be no hard-coded English strings left in the template—everything comes from `formatMessage` or `<IntlFormatted>`.
@@ -1,171 +0,0 @@
-# MIT License
-#
-# Copyright (c) 2024 CARIAD SE
-#
-# 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.
-
-name: 'Merge Queue CI Check Skipper'
-description: 'Outputs `skip-check` as `true` if this is running as part of merge queue checks and the same checks have already been executed in the PR itself.'
-inputs:
-  secret:
-    description: 'Optional GitHub Secret that can access branch protection rules using the administration:read permission'
-    required: false
-outputs:
-  skip-check:
-    description: 'Skip Check (boolean)'
-    value: ${{ steps.passed-checks.outputs.can-skip-checks }}
-runs:
-  using: 'composite'
-  steps:
-    - name: Checkout code
-      uses: actions/checkout@v4
-      with:
-        fetch-depth: 0
-
-    - name: Extract PR Number and Commit ID
-      id: extract-pr-info
-      uses: actions/github-script@v7
-      with:
-        script: |
-          const githubRef = process.env.GITHUB_REF;
-          const regex = /^refs\/heads\/gh-readonly-queue\/([a-zA-Z0-9.\-_\/]+)\/pr-(\d+)-([a-f0-9]+)$/;
-
-          if (regex.test(githubRef)) {
-            const [, targetBranchName, prNumber, commitId] = githubRef.match(regex);
-            core.setOutput('targetBranchName', targetBranchName);
-            core.setOutput('prNumber', prNumber);
-            core.setOutput('commitId', commitId);
-          } else {
-            console.log(`GITHUB_REF is not a merge queue ref, setting CAN_SKIP_CHECKS to false: ${githubRef}`);
-            core.exportVariable('CAN_SKIP_CHECKS', 'false');
-          }
-
-    - name: Print PR Number and Target Commit ID
-      if: env.CAN_SKIP_CHECKS != 'false'
-      shell: bash
-      run: |
-        echo "Target Branch Name: ${{ steps.extract-pr-info.outputs.targetBranchName }}"
-        echo "PR Number: ${{ steps.extract-pr-info.outputs.prNumber }}"
-        echo "Target Commit ID: ${{ steps.extract-pr-info.outputs.commitId }}"
-
-    - name: Check if merge queue entry was enqueued as head of the queue
-      if: env.CAN_SKIP_CHECKS != 'false'
-      shell: bash
-      run: |
-        targetBranchHead=$(git rev-parse origin/${{ steps.extract-pr-info.outputs.targetBranchName }})
-        if [[ "$targetBranchHead" != "${{ steps.extract-pr-info.outputs.commitId }}" ]]; then
-          echo "'${{ steps.extract-pr-info.outputs.targetBranchName }}' branch commit ID does not match PR commit ID. This Merge Queue run was not head of the queue when it was enqueued. Setting CAN_SKIP_CHECKS to false."
-          echo "CAN_SKIP_CHECKS=false" >> "$GITHUB_ENV"
-        else
-          echo "This merge queue entry is targeting '${{ steps.extract-pr-info.outputs.targetBranchName }}' directly."
-        fi
-
-    - name: Get PR Branch
-      id: get-pr-branch
-      if: env.CAN_SKIP_CHECKS != 'false'
-      shell: bash
-      env:
-        GH_TOKEN: ${{ github.token }}
-      run: |
-        prNumber=${{ steps.extract-pr-info.outputs.prNumber }}
-        branchName=$(gh pr view ${prNumber} --json headRefName -q '.headRefName')
-        echo "prBranch=$branchName" >> "$GITHUB_OUTPUT"
-
-    - name: Print PR Branch
-      if: env.CAN_SKIP_CHECKS != 'false'
-      shell: bash
-      run: |
-        echo "PR Branch: ${{ steps.get-pr-branch.outputs.prBranch }}"
-
-    - name: Check if PR branch contains the Merge Queue target commit ID
-      if: env.CAN_SKIP_CHECKS != 'false'
-      shell: bash
-      run: |
-        # Get the branch name from previous steps
-        branch_name="origin/${{ steps.get-pr-branch.outputs.prBranch }}"
-        commit_id="${{ steps.extract-pr-info.outputs.commitId }}"
-
-        # Check if the branch history contains the commit
-        if git branch -r --contains "$commit_id" | grep -q "$branch_name"; then
-          echo "Branch '$branch_name' contains commit '$commit_id'. It is up to date with ${{ steps.extract-pr-info.outputs.targetBranchName }}."
-        else
-          echo "Branch '$branch_name' does not contain commit '$commit_id'. It is outdated. Setting CAN_SKIP_CHECKS to false."
-          echo "CAN_SKIP_CHECKS=false" >> "$GITHUB_ENV"
-        fi
-
-    - name: Compare PR Branch with Current Branch
-      if: env.CAN_SKIP_CHECKS != 'false'
-      shell: bash
-      run: |
-        if git diff --quiet "origin/${{ steps.get-pr-branch.outputs.prBranch }}"; then
-          echo "No differences found. PR branch is identical with this merge queue branch."
-        else
-          echo "Differences detected. PR branch has been updated after PR was added to merge queue. Setting CAN_SKIP_CHECKS to false."
-          echo "CAN_SKIP_CHECKS=false" >> "$GITHUB_ENV"
-        fi
-
-    - name: Compute/publish skip result
-      id: passed-checks
-      uses: actions/github-script@v7
-      env:
-        SECRET: ${{ inputs.secret }}
-      with:
-        github-token: ${{ inputs.secret != '' && inputs.secret || github.token }}
-        script: |
-          if (process.env.CAN_SKIP_CHECKS == "false") {
-            console.log("Setting CAN_SKIP_CHECKS to false");
-            core.setOutput("can-skip-checks", false);
-            return;
-          }
-
-          const secretProvided = !!process.env.SECRET;
-          if (!secretProvided) {
-            console.log("secret input not set, assuming all checks have passed. Ensure 'Require status checks to pass before merging' is enabled, or provide a secret with administration:read.");
-            core.setOutput("can-skip-checks", true);
-            return;
-          }
-
-          const { data: branchProtection } = await github.rest.repos.getBranchProtection({
-            owner: context.repo.owner,
-            repo: context.repo.repo,
-            branch: "${{ steps.extract-pr-info.outputs.targetBranchName }}",
-          });
-          const requiredCheckNames = branchProtection.required_status_checks.contexts;
-          console.log(`requiredCheckNames = ${requiredCheckNames}`);
-
-          const { data: checks } = await github.rest.checks.listForRef({
-            owner: context.repo.owner,
-            repo: context.repo.repo,
-            ref: "refs/heads/${{ steps.get-pr-branch.outputs.prBranch }}",
-          });
-
-          console.log(`checks.check_runs = ${checks.check_runs.map(check => `${check.status},${check.conclusion},${check.name};`)}`);
-          const nonSuccessfulChecks = checks.check_runs.filter(check => check.status !== "completed" || check.conclusion !== "success");
-          const nonSuccessfulCheckNames = nonSuccessfulChecks.map(check => check.name);
-          console.log(`nonSuccessfulCheckNames = ${nonSuccessfulCheckNames}`);
-
-          const missingChecks = requiredCheckNames.filter(checkName => nonSuccessfulCheckNames.includes(checkName));
-
-          if (missingChecks.length > 0) {
-            console.log(`Required checks not passed, cannot skip merge queue checks. Setting CAN_SKIP_CHECKS to false. Missing checks: ${missingChecks.join(', ')}`);
-            core.setOutput("can-skip-checks", false);
-          } else {
-            console.log("No missing checks. Setting CAN_SKIP_CHECKS to true.");
-            core.setOutput("can-skip-checks", true);
-          }
@@ -1,125 +0,0 @@
-name: API client release
-
-on:
-  push:
-    branches: [main]
-    paths:
-      - .github/workflows/api-client-release.yml
-      - packages/api-client/**
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: false
-
-permissions:
-  contents: read
-  id-token: write
-
-jobs:
-  release:
-    if: github.repository_owner == 'modrinth' && github.ref == 'refs/heads/main'
-    # npm Trusted Publishing requires a GitHub-hosted runner.
-    runs-on: ubuntu-latest
-    env:
-      FORCE_COLOR: 3
-      PACKAGE_DIR: packages/api-client
-      PACKAGE_NAME: '@modrinth/api-client'
-      BUMP_TYPE: minor
-    steps:
-      - name: Check out code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-        with:
-          fetch-depth: 0
-
-      - name: Check for api-client changes
-        id: changes
-        run: |
-          if [ "${{ github.event.before }}" = "0000000000000000000000000000000000000000" ]; then
-            echo "changed=true" >> "$GITHUB_OUTPUT"
-            exit 0
-          fi
-
-          if git diff --quiet "${{ github.event.before }}" "$GITHUB_SHA" -- "$PACKAGE_DIR"; then
-            echo "changed=false" >> "$GITHUB_OUTPUT"
-          else
-            echo "changed=true" >> "$GITHUB_OUTPUT"
-          fi
-
-      - name: Setup Node
-        if: steps.changes.outputs.changed == 'true'
-        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          node-version-file: .nvmrc
-          registry-url: https://registry.npmjs.org
-
-      - name: Enable Corepack
-        if: steps.changes.outputs.changed == 'true'
-        run: corepack enable
-
-      - name: Get pnpm store path
-        if: steps.changes.outputs.changed == 'true'
-        id: pnpm-store
-        run: echo "store-path=$(pnpm store path --silent)" >> "$GITHUB_OUTPUT"
-
-      - name: Restore pnpm cache
-        if: steps.changes.outputs.changed == 'true'
-        uses: actions/cache/restore@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0
-        with:
-          path: ${{ steps.pnpm-store.outputs.store-path }}
-          key: pnpm-cache-${{ runner.os }}-${{ runner.arch }}-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: |
-            pnpm-cache-
-
-      - name: Install dependencies
-        if: steps.changes.outputs.changed == 'true'
-        run: pnpm install --frozen-lockfile --filter @modrinth/api-client...
-
-      - name: Resolve release version
-        if: steps.changes.outputs.changed == 'true'
-        id: version
-        run: |
-          CURRENT_VERSION_JSON="$(npm view "${PACKAGE_NAME}" version --json)"
-          CURRENT_VERSION="$(
-            jq -nr \
-              --argjson version "$CURRENT_VERSION_JSON" \
-              'if ($version | type) == "array" then $version[-1] else $version end'
-          )"
-
-          NEXT_VERSION="$(
-            jq -nr \
-              --arg version "$CURRENT_VERSION" \
-              --arg bump "$BUMP_TYPE" '
-                def semver:
-                  capture("^(?<major>[0-9]+)\\.(?<minor>[0-9]+)\\.(?<patch>[0-9]+)$")
-                  | with_entries(.value |= tonumber);
-
-                ($version | semver) as $current
-                | if $bump == "major" then "\($current.major + 1).0.0"
-                  elif $bump == "minor" then "\($current.major).\($current.minor + 1).0"
-                  elif $bump == "patch" then "\($current.major).\($current.minor).\($current.patch + 1)"
-                  else error("Unsupported bump type: \($bump)")
-                  end
-              '
-          )"
-
-          PACKAGE_JSON="$(mktemp)"
-          jq --tab --arg version "$NEXT_VERSION" '.version = $version' "$PACKAGE_DIR/package.json" > "$PACKAGE_JSON"
-          mv "$PACKAGE_JSON" "$PACKAGE_DIR/package.json"
-
-          echo "current_version=$CURRENT_VERSION" >> "$GITHUB_OUTPUT"
-          echo "published_version=$CURRENT_VERSION" >> "$GITHUB_OUTPUT"
-          echo "version=$NEXT_VERSION" >> "$GITHUB_OUTPUT"
-
-      - name: Build api-client
-        if: steps.changes.outputs.changed == 'true'
-        run: pnpm --filter @modrinth/api-client build
-
-      - name: Check package contents
-        if: steps.changes.outputs.changed == 'true'
-        working-directory: packages/api-client
-        run: pnpm pack --dry-run
-
-      - name: Publish api-client
-        if: steps.changes.outputs.changed == 'true'
-        working-directory: packages/api-client
-        run: pnpm publish --access public --provenance --no-git-checks
@@ -1,22 +0,0 @@
-name: Cancel PR Workflows on Merge
-
-on:
-  pull_request_target:
-    types:
-      - closed
-
-permissions:
-  actions: write
-
-jobs:
-  cancel:
-    if: github.event.pull_request.merged == true
-    runs-on: ubuntu-latest
-    steps:
-      - name: Cancel Previous Runs
-        uses: styfle/cancel-workflow-action@d07a454dad7609a92316b57b23c9ccfd4f59af66 # 0.13.1
-        with:
-          workflow_id: all
-          access_token: ${{ secrets.GITHUB_TOKEN }}
-          ignore_sha: true
-          pr_number: ${{ github.event.pull_request.number }}
@@ -1,7 +1,7 @@
 name: Changelog Comment

 on:
-  pull_request_target:
+  pull_request:
    types: [opened, reopened]
  workflow_dispatch:
    inputs:
@@ -16,8 +16,8 @@ jobs:
    runs-on: ubuntu-latest

    steps:
-      - name: Post or update changelog comment
-        uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
+      - name: 💬 Post or update changelog comment
+        uses: actions/github-script@v7
        with:
          github-token: ${{ secrets.CROWDIN_GH_TOKEN }}
          script: |
@@ -2,7 +2,7 @@ on:
  pull_request:
  push:
    branches:
-      - main
+      - master

 env:
  CARGO_TERM_COLOR: always
@@ -12,15 +12,15 @@ jobs:
  typos:
    runs-on: ubuntu-latest
    steps:
-      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-      - uses: crate-ci/typos@bee27e3a4fd1ea2111cf90ab89cd076c870fce14 # v1.48.0
+      - uses: actions/checkout@v4
+      - uses: crate-ci/typos@v1.43.1

  # see <https://github.com/influxdata/datafusion-udf-wasm/pull/275>
  tombi:
    runs-on: ubuntu-latest
    steps:
-      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-      - uses: taiki-e/install-action@fd2f5e3d644b484055ebf4268f474c565f148f25 # v2.81.9
+      - uses: actions/checkout@v4
+      - uses: taiki-e/install-action@v2
        with:
          tool: tombi
      - run: tombi lint
@@ -2,19 +2,18 @@ on:
  pull_request:
  push:
    branches:
-      - main
+      - master

 env:
  CARGO_TERM_COLOR: always
-  CARGO_INCREMENTAL: 0
  SQLX_OFFLINE: true

 jobs:
  shear:
    runs-on: ubuntu-latest
    steps:
-      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-      - uses: dtolnay/rust-toolchain@4cda84d5c5c54efe2404f9d843567869ab1699d4 # stable
-      - uses: cargo-bins/cargo-binstall@ead08b90bd7b2e6d81963fb9cf0b7239f66d5db4 # v1.21.0
+      - uses: actions/checkout@v4
+      - uses: dtolnay/rust-toolchain@stable
+      - uses: cargo-bins/cargo-binstall@main
      - run: cargo binstall --no-confirm cargo-shear
      - run: cargo shear
@@ -3,105 +3,33 @@ name: daedalus-docker-build
 on:
  push:
    branches:
-      - 'main'
+      - '**'
    paths:
      - .github/workflows/daedalus-docker.yml
      - 'apps/daedalus_client/**'
      - 'packages/daedalus/**'
-      - Cargo.toml
-      - Cargo.lock
  pull_request:
    types: [opened, synchronize]
    paths:
      - .github/workflows/daedalus-docker.yml
      - 'apps/daedalus_client/**'
      - 'packages/daedalus/**'
-      - Cargo.toml
-      - Cargo.lock
  merge_group:
    types: [checks_requested]

-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: ${{ github.ref != 'refs/heads/main' && github.ref != 'refs/heads/prod' }}
-
 jobs:
-  skip-if-clean:
-    name: Skip if merge_queue produces no diff
-    runs-on: ubuntu-latest
-    outputs:
-      skip: ${{ steps.check.outputs.skip }}
-      internal: ${{ steps.check-internal.outputs.internal }}
-    if: ${{ always() }}
-    steps:
-      - name: Checkout
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-
-      - name: Check if workflow runs on an internal branch
-        id: check-internal
-        env:
-          EVENT_NAME: ${{ github.event_name }}
-          HEAD_REPO: ${{ github.event.pull_request.head.repo.full_name }}
-          REPO: ${{ github.repository }}
-        run: |
-          if [ "$EVENT_NAME" != "pull_request" ] || [ "$HEAD_REPO" = "$REPO" ]; then
-            echo "internal=true" >> $GITHUB_OUTPUT
-          else
-            echo "internal=false" >> $GITHUB_OUTPUT
-          fi
-
-      - name: Merge Queue CI Check Skipper
-        id: merge-queue-ci-skipper
-        uses: ./.github/merge-queue-ci-skipper
-        with:
-          secret: ${{ secrets.GH_ACCESS_TOKEN }}
-
-      - name: Check merge_group synthetic commit
-        id: check
-        run: |
-          # PR mode: never skip
-          if [ "${{ github.event_name }}" != "merge_group" ]; then
-            echo "skip=false" >> $GITHUB_OUTPUT
-            exit 0
-          fi
-
-          if [ "${{ steps.merge-queue-ci-skipper.outputs.skip-check }}" = "true" ]; then
-            echo "skip=true" >> $GITHUB_OUTPUT
-          else
-            echo "skip=false" >> $GITHUB_OUTPUT
-          fi
-
  docker:
-    runs-on: ${{ needs.skip-if-clean.outputs.internal == 'true' && 'namespace-profile-medium-amd64' || 'ubuntu-latest' }}
-    needs: [skip-if-clean]
-    if: ${{ needs.skip-if-clean.outputs.skip != 'true' }}
+    runs-on: ubuntu-latest
    steps:
-      - name: Check out code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+      - name: 📥 Check out code
+        uses: actions/checkout@v4

-      - name: Setup Rust toolchain
-        uses: actions-rust-lang/setup-rust-toolchain@166cdcfd11aee3cb47222f9ddb555ce30ddb9659 # v1.17.0
-        with:
-          rustflags: ''
-          cache: false
+      - name: 🧰 Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2

-      - name: Setup mold
-        uses: rui314/setup-mold@9c9c13bf4c3f1adef0cc596abc155580bcb04444 # v1 / Mold 2.41.0
-
-      - name: Build daedalus_client
-        run: cargo build --release --package daedalus_client
-
-      - name: Stage Docker context
-        run: |
-          mkdir -p apps/daedalus_client/docker-stage
-          cp target/release/daedalus_client apps/daedalus_client/docker-stage/daedalus_client
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@bb05f3f5519dd87d3ba754cc423b652a5edd6d2c # v4.2.0
-
-      - name: Generate Docker image metadata
-        id: docker-meta
-        uses: docker/metadata-action@dc802804100637a589fabce1cb79ff13a1411302 # v6.2.0
+      - name: ⚙️ Generate Docker image metadata
+        id: docker_meta
+        uses: docker/metadata-action@v5
        env:
          DOCKER_METADATA_ANNOTATIONS_LEVELS: manifest,index
        with:
@@ -115,19 +43,20 @@ jobs:
            org.opencontainers.image.description=Modrinth game metadata query client
            org.opencontainers.image.licenses=MIT

-      - name: Login to GitHub Packages
-        uses: docker/login-action@abd2ef45e78c5afb21d64d4ca52ee8550d9572c7 # v4.5.1
+      - name: 🔑 Login to GitHub Packages
+        uses: docker/login-action@v3
        with:
          registry: ghcr.io
          username: ${{ github.actor }}
          password: ${{ secrets.GITHUB_TOKEN }}

-      - name: Build and push
-        uses: docker/build-push-action@53b7df96c91f9c12dcc8a07bcb9ccacbed38856a # v7.3.0
+      - name: 🔨 Build and push
+        uses: docker/build-push-action@v6
        with:
-          context: ./apps/daedalus_client/docker-stage
          file: ./apps/daedalus_client/Dockerfile
          push: ${{ github.event_name != 'pull_request' }}
-          tags: ${{ steps.docker-meta.outputs.tags }}
-          labels: ${{ steps.docker-meta.outputs.labels }}
-          annotations: ${{ steps.docker-meta.outputs.annotations }}
+          tags: ${{ steps.docker_meta.outputs.tags }}
+          labels: ${{ steps.docker_meta.outputs.labels }}
+          annotations: ${{ steps.docker_meta.outputs.annotations }}
+          cache-from: type=registry,ref=ghcr.io/modrinth/daedalus:main
+          cache-to: type=inline
@@ -12,10 +12,10 @@ jobs:

    steps:
      - name: Checkout repository
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        uses: actions/checkout@v3

      - name: Log in to GitHub Container Registry
-        uses: docker/login-action@abd2ef45e78c5afb21d64d4ca52ee8550d9572c7 # v4.5.1
+        uses: docker/login-action@v2
        with:
          registry: ghcr.io
          username: ${{ github.actor }}
@@ -16,68 +16,42 @@ on:
  workflow_dispatch:
  workflow_call:
    inputs:
-      preview:
-        required: false
-        type: boolean
-        description: 'Whether this is a preview deployment'
-      head_sha:
-        required: false
+      environment:
+        required: true
        type: string
-        description: 'The commit SHA to deploy (defaults to github.sha)'
-      head_ref:
-        required: false
-        type: string
-        description: 'The branch name to deploy (defaults to github.ref_name)'
-      branch_alias:
-        required: false
-        type: string
-        description: 'The persistent preview alias for the branch'
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}-${{ inputs.preview && 'preview' || 'push' }}
-  cancel-in-progress: ${{ github.ref != 'refs/heads/main' && github.ref != 'refs/heads/prod' }}
+        description: 'The environment to deploy to (staging-preview or production-preview)'

 jobs:
  deploy:
-    runs-on: namespace-profile-modrinth-frontend
+    runs-on: ubuntu-latest
    permissions:
      contents: read
      deployments: write
      pull-requests: write
    steps:
      - name: Checkout code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Configure environment
        id: meta
-        env:
-          PREVIEW_INPUT: ${{ inputs.preview }}
-          REF: ${{ github.ref }}
-          DEPLOY_SHA: ${{ inputs.head_sha || github.sha }}
-          BRANCH_ALIAS: ${{ inputs.branch_alias }}
        run: |
          echo "cmd=deploy" >> $GITHUB_OUTPUT

-          SHA_SHORT="${DEPLOY_SHA::8}"
+          ENV_INPUT="${{ inputs.environment }}"
+          REF="${{ github.ref }}"
+          SHA_SHORT="${GITHUB_SHA::8}"

-          if [ "$PREVIEW_INPUT" = "true" ]; then
-            URL="https://git-$SHA_SHORT-frontend.modrinth.workers.dev"
-            STAGING_URL="https://git-$SHA_SHORT-staging-frontend.modrinth.workers.dev"
+          if [ "$ENV_INPUT" = "staging-preview" ]; then
+            echo "env=staging" >> $GITHUB_OUTPUT
+            echo "url=https://git-$SHA_SHORT-frontend-staging.modrinth.workers.dev" >> $GITHUB_OUTPUT
+            echo "cmd=versions upload --preview-alias git-$SHA_SHORT --var PREVIEW:true" >> $GITHUB_OUTPUT
+
+          elif [ "$ENV_INPUT" = "production-preview" ]; then
            echo "env=production" >> $GITHUB_OUTPUT
-            echo "url=$URL" >> $GITHUB_OUTPUT
-            echo "staging_url=$STAGING_URL" >> $GITHUB_OUTPUT
-            echo "cmd=versions upload --preview-alias git-$SHA_SHORT --var PREVIEW:true --var CF_PAGES_URL:$URL" >> $GITHUB_OUTPUT
-
-            STAGING_VARS=$(jq -r '.env.staging.vars | to_entries[] | "--var \(.key):\(.value)"' ./apps/frontend/wrangler.jsonc | tr '\n' ' ')
-            echo "staging_cmd=versions upload --preview-alias git-$SHA_SHORT-staging ${STAGING_VARS}--var PREVIEW:true --var CF_PAGES_URL:$STAGING_URL" >> $GITHUB_OUTPUT
-
-            if [ -n "$BRANCH_ALIAS" ]; then
-              echo "branch_alias_url=https://$BRANCH_ALIAS-frontend.modrinth.workers.dev" >> $GITHUB_OUTPUT
-              echo "staging_branch_alias_url=https://$BRANCH_ALIAS-staging-frontend.modrinth.workers.dev" >> $GITHUB_OUTPUT
-              echo "staging_branch_alias_cmd=versions upload --preview-alias $BRANCH_ALIAS-staging ${STAGING_VARS}--var PREVIEW:true --var CF_PAGES_URL:https://$BRANCH_ALIAS-staging-frontend.modrinth.workers.dev" >> $GITHUB_OUTPUT
-            fi
+            echo "url=https://git-$SHA_SHORT-frontend.modrinth.workers.dev" >> $GITHUB_OUTPUT
+            echo "cmd=versions upload --preview-alias git-$SHA_SHORT --var PREVIEW:true" >> $GITHUB_OUTPUT

          elif [ "$REF" = "refs/heads/main" ]; then
            echo "env=staging" >> $GITHUB_OUTPUT
@@ -89,24 +63,14 @@ jobs:
            echo "url=https://modrinth.com" >> $GITHUB_OUTPUT
          fi

+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+
      - name: Setup Node
-        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        uses: actions/setup-node@v4
        with:
          node-version-file: .nvmrc
-
-      - name: Enable Corepack
-        run: corepack enable
-
-      - name: Set up caches
-        uses: namespacelabs/nscloud-cache-action@c5f8dab7560444c4bf8dbc64f1b203431873c547 # v1.6.1
-        with:
-          cache: |
-            rust
-            pnpm
-            apt
-
-      - name: Set up Turborepo caching
-        uses: namespace-actions/setup-turbocache@f96bd6befa13ae74b2858a5be49573640d4636f5 # v0.0.2
+          cache: pnpm

      - name: Inject build variables
        working-directory: ./apps/frontend
@@ -127,15 +91,15 @@ jobs:
        working-directory: ./apps/frontend
        run: pnpm build
        env:
-          CF_PAGES_BRANCH: ${{ inputs.head_ref || github.ref_name }}
-          CF_PAGES_COMMIT_SHA: ${{ inputs.head_sha || github.sha }}
+          CF_PAGES_BRANCH: ${{ github.ref_name }}
+          CF_PAGES_COMMIT_SHA: ${{ github.sha }}
          CF_PAGES_URL: ${{ steps.meta.outputs.url }}
          BUILD_ENV: ${{ steps.meta.outputs.env }}
-          PREVIEW: ${{ inputs.preview && 'true' || 'false' }}
+          PREVIEW: ${{ inputs.environment != '' && 'true' || 'false' }}
          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}

      - name: Create Sentry release and upload sourcemaps
-        uses: getsentry/action-release@ff07929a6537bac57790c3451cf4d364aca38528 # v3.7.0
+        uses: getsentry/action-release@v3
        env:
          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
          SENTRY_ORG: modrinth
@@ -145,53 +109,17 @@ jobs:
          sourcemaps: ./apps/frontend/.output/server
          url_prefix: '~/'

-      - name: Install Wrangler CLI
-        uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
+      - name: Deploy Cloudflare Worker
+        id: wrangler
+        uses: cloudflare/wrangler-action@v3
        with:
          apiToken: ${{ secrets.CF_API_TOKEN }}
          accountId: ${{ secrets.CF_ACCOUNT_ID }}
+          environment: ${{ steps.meta.outputs.env != 'production' && steps.meta.outputs.env || '' }}
          workingDirectory: ./apps/frontend
          packageManager: pnpm
-          wranglerVersion: '4.112.0'
-          command: --version
-
-      - parallel:
-          - name: Deploy Cloudflare Worker
-            id: wrangler
-            uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
-            with:
-              apiToken: ${{ secrets.CF_API_TOKEN }}
-              accountId: ${{ secrets.CF_ACCOUNT_ID }}
-              environment: ${{ steps.meta.outputs.env != 'production' && steps.meta.outputs.env || '' }}
-              workingDirectory: ./apps/frontend
-              command: ${{ steps.meta.outputs.cmd }}
-
-          - name: Deploy staging Cloudflare Worker preview
-            if: ${{ inputs.preview }}
-            uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
-            with:
-              apiToken: ${{ secrets.CF_API_TOKEN }}
-              accountId: ${{ secrets.CF_ACCOUNT_ID }}
-              workingDirectory: ./apps/frontend
-              command: ${{ steps.meta.outputs.staging_cmd }}
-
-          - name: Deploy persistent Cloudflare Worker preview
-            if: ${{ inputs.preview && inputs.branch_alias != '' }}
-            uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
-            with:
-              apiToken: ${{ secrets.CF_API_TOKEN }}
-              accountId: ${{ secrets.CF_ACCOUNT_ID }}
-              workingDirectory: ./apps/frontend
-              command: versions upload --preview-alias ${{ inputs.branch_alias }} --var PREVIEW:true --var CF_PAGES_URL:${{ steps.meta.outputs.branch_alias_url }}
-
-          - name: Deploy persistent staging Cloudflare Worker preview
-            if: ${{ inputs.preview && inputs.branch_alias != '' }}
-            uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
-            with:
-              apiToken: ${{ secrets.CF_API_TOKEN }}
-              accountId: ${{ secrets.CF_ACCOUNT_ID }}
-              workingDirectory: ./apps/frontend
-              command: ${{ steps.meta.outputs.staging_branch_alias_cmd }}
+          wranglerVersion: '4.54.0'
+          command: ${{ steps.meta.outputs.cmd }}

      - name: Purge cache
        if: github.ref == 'refs/heads/prod'
@@ -202,23 +130,14 @@ jobs:
            --data '{"hosts": ["modrinth.com", "www.modrinth.com", "staging.modrinth.com"]}' \
            https://api.cloudflare.com/client/v4/zones/e39df17b9c4ef44cbce2646346ee6d33/purge_cache

-      - name: Write deployment URLs to files
-        if: ${{ inputs.preview }}
+      - name: Write deployment URL to file
+        if: ${{ inputs.environment != '' }}
        run: |
-          echo "${{ steps.meta.outputs.url }}" > deployment-url-production.txt
-          echo "${{ steps.meta.outputs.staging_url }}" > deployment-url-staging.txt
+          echo "${{ steps.meta.outputs.url }}" > deployment-url-${{ inputs.environment }}.txt

-      - parallel:
-          - name: Upload production deployment URL
-            if: ${{ inputs.preview }}
-            uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
-            with:
-              name: deployment-url-production
-              path: deployment-url-production.txt
-
-          - name: Upload staging deployment URL
-            if: ${{ inputs.preview }}
-            uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
-            with:
-              name: deployment-url-staging
-              path: deployment-url-staging.txt
+      - name: Upload deployment URL
+        if: ${{ inputs.environment != '' }}
+        uses: actions/upload-artifact@v6
+        with:
+          name: deployment-url-${{ inputs.environment }}
+          path: deployment-url-${{ inputs.environment }}.txt
@@ -12,149 +12,42 @@ on:
      - '.github/workflows/frontend-preview.yml'

 jobs:
-  metadata:
-    if: github.repository_owner == 'modrinth' && github.event.pull_request.head.repo.full_name == github.repository
-    runs-on: ubuntu-latest
-    outputs:
-      branch-alias: ${{ steps.meta.outputs.branch_alias }}
-    steps:
-      - name: Configure branch alias
-        id: meta
-        run: echo "branch_alias=pr-${{ github.event.pull_request.number }}" >> $GITHUB_OUTPUT
-
  deploy:
    if: github.repository_owner == 'modrinth' && github.event.pull_request.head.repo.full_name == github.repository
-    needs: metadata
    uses: ./.github/workflows/frontend-deploy.yml
    secrets: inherit
-    concurrency:
-      group: ${{ github.workflow }}-${{ github.ref }}-deploy
-      cancel-in-progress: true
+    strategy:
+      matrix:
+        environment: [staging-preview, production-preview]
    with:
-      preview: true
-      head_sha: ${{ github.event.pull_request.head.sha }}
-      head_ref: ${{ github.event.pull_request.head.ref }}
-      branch_alias: ${{ needs.metadata.outputs.branch-alias }}
-
-  deploy-storybook:
-    if: github.repository_owner == 'modrinth' && github.event.pull_request.head.repo.full_name == github.repository
-    needs: metadata
-    runs-on: namespace-profile-modrinth-frontend
-    concurrency:
-      group: ${{ github.workflow }}-${{ github.ref }}-storybook
-      cancel-in-progress: true
-    permissions:
-      contents: read
-      deployments: write
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-
-      - name: Setup Node
-        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          node-version-file: .nvmrc
-
-      - name: Enable Corepack
-        run: corepack enable
-
-      - name: Set up caches
-        uses: namespacelabs/nscloud-cache-action@c5f8dab7560444c4bf8dbc64f1b203431873c547 # v1.6.1
-        with:
-          cache: |
-            pnpm
-
-      - name: Install dependencies
-        working-directory: ./packages/ui
-        run: pnpm install
-
-      - name: Build Storybook
-        working-directory: ./packages/ui
-        env:
-          NODE_OPTIONS: --max-old-space-size=6144
-        run: pnpm run build-storybook
-
-      - name: Configure short SHA
-        id: meta
-        env:
-          HEAD_SHA: ${{ github.event.pull_request.head.sha }}
-        run: echo "sha_short=${HEAD_SHA::8}" >> $GITHUB_OUTPUT
-
-      - name: Install Wrangler CLI
-        uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
-        with:
-          apiToken: ${{ secrets.CF_API_TOKEN }}
-          accountId: ${{ secrets.CF_ACCOUNT_ID }}
-          workingDirectory: ./packages/ui
-          packageManager: pnpm
-          wranglerVersion: '4.112.0'
-          command: --version
-
-      - parallel:
-          - name: Deploy Storybook preview
-            uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
-            with:
-              apiToken: ${{ secrets.CF_API_TOKEN }}
-              accountId: ${{ secrets.CF_ACCOUNT_ID }}
-              workingDirectory: ./packages/ui
-              command: versions upload --preview-alias git-${{ steps.meta.outputs.sha_short }}
-
-          - name: Deploy persistent Storybook preview
-            uses: cloudflare/wrangler-action@ebbaa1584979971c8614a24965b4405ff95890e0 # v4.0.0
-            env:
-              NODE_OPTIONS: --max-old-space-size=6144
-            with:
-              apiToken: ${{ secrets.CF_API_TOKEN }}
-              accountId: ${{ secrets.CF_ACCOUNT_ID }}
-              workingDirectory: ./packages/ui
-              command: versions upload --preview-alias ${{ needs.metadata.outputs.branch-alias }}
+      environment: ${{ matrix.environment }}

  comment:
-    if: |
-      !cancelled()
-      && github.repository_owner == 'modrinth'
-      && github.event.pull_request.head.repo.full_name == github.repository
-      && needs.deploy.result == 'success'
+    if: github.repository_owner == 'modrinth' && github.event.pull_request.head.repo.full_name == github.repository
    runs-on: ubuntu-latest
-    needs: [metadata, deploy, deploy-storybook]
+    needs: deploy
    steps:
      - name: Download deployment URLs
-        uses: actions/download-artifact@3e5f45b2cfb9172054b4087a40e8e0b5a5461e7c # v8.0.1
+        uses: actions/download-artifact@v7
        with:
          pattern: deployment-url-*
          merge-multiple: true

      - name: Read deployment URLs
        id: urls
-        env:
-          HEAD_SHA: ${{ github.event.pull_request.head.sha }}
-          BRANCH_ALIAS: ${{ needs.metadata.outputs.branch-alias }}
-          STORYBOOK_RESULT: ${{ needs.deploy-storybook.result }}
-          RUN_URL: ${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}
        run: |
-          STAGING_SHA_URL=$(cat deployment-url-staging.txt)
-          PRODUCTION_SHA_URL=$(cat deployment-url-production.txt)
-          STAGING_BRANCH_URL="https://$BRANCH_ALIAS-staging-frontend.modrinth.workers.dev"
-          PRODUCTION_BRANCH_URL="https://$BRANCH_ALIAS-frontend.modrinth.workers.dev"
+          STAGING_PREVIEW_URL=$(cat deployment-url-staging-preview.txt)
+          PRODUCTION_PREVIEW_URL=$(cat deployment-url-production-preview.txt)

-          if [ "$STORYBOOK_RESULT" = "success" ]; then
-            STORYBOOK_SHA_URL="https://git-${HEAD_SHA::8}-storybook.modrinth.workers.dev"
-            STORYBOOK_BRANCH_URL="https://$BRANCH_ALIAS-storybook.modrinth.workers.dev"
-          else
-            STORYBOOK_SHA_URL="⚠️ Deployment $STORYBOOK_RESULT ([logs]($RUN_URL))"
-            STORYBOOK_BRANCH_URL="⚠️ Deployment $STORYBOOK_RESULT ([logs]($RUN_URL))"
-          fi
+          echo "Production preview URL: $PRODUCTION_PREVIEW_URL"
+          echo "Staging preview URL: $STAGING_PREVIEW_URL"

-          echo "staging-sha-url=$STAGING_SHA_URL" >> $GITHUB_OUTPUT
-          echo "production-sha-url=$PRODUCTION_SHA_URL" >> $GITHUB_OUTPUT
-          echo "storybook-sha-url=$STORYBOOK_SHA_URL" >> $GITHUB_OUTPUT
-          echo "staging-branch-url=$STAGING_BRANCH_URL" >> $GITHUB_OUTPUT
-          echo "production-branch-url=$PRODUCTION_BRANCH_URL" >> $GITHUB_OUTPUT
-          echo "storybook-branch-url=$STORYBOOK_BRANCH_URL" >> $GITHUB_OUTPUT
+          echo "staging-preview-url=$STAGING_PREVIEW_URL" >> $GITHUB_OUTPUT
+          echo "production-preview-url=$PRODUCTION_PREVIEW_URL" >> $GITHUB_OUTPUT

      - name: Find comment
        if: github.event_name == 'pull_request'
-        uses: peter-evans/find-comment@b30e6a3c0ed37e7c023ccd3f1db5c6c0b0c23aad # v4.0.0
+        uses: peter-evans/find-comment@v3
        id: fc
        with:
          token: ${{ secrets.CROWDIN_GH_TOKEN }}
@@ -163,7 +56,7 @@ jobs:

      - name: Comment deploy URL on PR
        if: github.event_name == 'pull_request'
-        uses: peter-evans/create-or-update-comment@e8674b075228eee787fea43ef493e45ece1004c9 # v5.0.0
+        uses: peter-evans/create-or-update-comment@v5
        with:
          token: ${{ secrets.CROWDIN_GH_TOKEN }}
          issue-number: ${{ github.event.pull_request.number }}
@@ -171,21 +64,10 @@ jobs:
          body: |
            ## Frontend previews

-            Last deployed commit is [${{ github.event.pull_request.head.sha }}](${{ github.event.pull_request.head.repo.html_url }}/commit/${{ github.event.pull_request.head.sha }})
-
-            ### Persistent
+            Last deployed commit is [${{ github.sha }}](${{ github.event.pull_request.head.repo.html_url }}/commit/${{ github.sha }})

            | Environment | URL |
            |-------------|-----|
-            | staging     | ${{ steps.urls.outputs.staging-branch-url }} |
-            | production  | ${{ steps.urls.outputs.production-branch-url }} |
-            | storybook   | ${{ steps.urls.outputs.storybook-branch-url }} |
-
-            ### Latest commit
-
-            | Environment | URL |
-            |-------------|-----|
-            | staging     | ${{ steps.urls.outputs.staging-sha-url }} |
-            | production  | ${{ steps.urls.outputs.production-sha-url }} |
-            | storybook   | ${{ steps.urls.outputs.storybook-sha-url }} |
+            | staging     | ${{ steps.urls.outputs.staging-preview-url }} |
+            | production  | ${{ steps.urls.outputs.production-preview-url }} |
          edit-mode: replace
@@ -51,25 +51,14 @@ jobs:
          CROWDIN_GH_TOKEN_DEFINED: ${{ secrets.CROWDIN_GH_TOKEN != '' }}

      - name: Checkout
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        uses: actions/checkout@v4
        with:
          ref: ${{ github.ref }}
          token: ${{ secrets.CROWDIN_GH_TOKEN }}

-      - name: Setup Node
-        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          node-version-file: .nvmrc
-
-      - name: Enable Corepack
-        run: corepack enable
-
-      - name: Install script dependencies
-        run: pnpm install --frozen-lockfile --ignore-scripts
-
      - name: Configure Git author
        id: git-author
-        uses: MarcoIeni/git-config@59144859caf016f8b817a2ac9b051578729173c4 # v0.1.2
+        uses: MarcoIeni/git-config@v0.1
        env:
          GITHUB_TOKEN: ${{ secrets.CROWDIN_GH_TOKEN }}

@@ -90,7 +79,7 @@ jobs:
          echo "safe_branch_name=$SAFE_BRANCH_NAME" >> "$GITHUB_OUTPUT"

      - name: Download translations from Crowdin
-        uses: crowdin/github-action@c7af9bc98b01694653031fef2a0dc6c7888ce9bc # v2.17.0
+        uses: crowdin/github-action@v2
        with:
          upload_sources: false
          upload_translations: false
@@ -106,11 +95,8 @@ jobs:
        shell: bash
        run: sudo chown -R $USER:$USER .

-      - name: Prune stale ICU translations
-        run: pnpm scripts i18n-icu-contract prune-local
-
      - name: Create Pull Request
-        uses: peter-evans/create-pull-request@5f6978faf089d4d20b00c7766989d076bb2fc7f1 # v8.1.1
+        uses: peter-evans/create-pull-request@v7
        with:
          title: 'New translations from Crowdin (${{ steps.branch-name.outputs.branch_name }})'
          body-path: .github/templates/crowdin-pr.md
@@ -4,14 +4,11 @@ on:
  push:
    branches: ['main']
    paths:
-      - '.github/workflows/i18n-push.yml'
+      - '.github/workflows/i18n.push.yml'
      - 'apps/*/src/locales/en-US/**'
      - 'apps/*/locales/en-US/**'
      - 'packages/*/src/locales/en-US/**'
      - 'packages/*/locales/en-US/**'
-      - 'scripts/i18n-icu-contract.ts'
-      - 'package.json'
-      - 'pnpm-lock.yaml'
      - 'crowdin.yml'
  workflow_dispatch:

@@ -56,21 +53,9 @@ jobs:
          CROWDIN_PERSONAL_TOKEN_DEFINED: ${{ secrets.CROWDIN_PERSONAL_TOKEN != '' }}

      - name: Checkout
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        uses: actions/checkout@v4
        with:
          ref: ${{ github.ref }}
-          fetch-depth: 2
-
-      - name: Setup Node
-        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          node-version-file: .nvmrc
-
-      - name: Enable Corepack
-        run: corepack enable
-
-      - name: Install script dependencies
-        run: pnpm install --frozen-lockfile --ignore-scripts

      - name: Query branch name
        id: branch-name
@@ -83,7 +68,7 @@ jobs:
          echo "safe_branch_name=$SAFE_BRANCH_NAME" >> "$GITHUB_OUTPUT"

      - name: Upload translations to Crowdin
-        uses: crowdin/github-action@c7af9bc98b01694653031fef2a0dc6c7888ce9bc # v2.17.0
+        uses: crowdin/github-action@v1
        with:
          upload_sources: true
          upload_translations: false
@@ -94,9 +79,3 @@ jobs:
        env:
          CROWDIN_PROJECT_ID: ${{ vars.CROWDIN_PROJECT_ID }}
          CROWDIN_PERSONAL_TOKEN: ${{ secrets.CROWDIN_PERSONAL_TOKEN }}
-
-      - name: Clear stale ICU translations in Crowdin
-        run: pnpm scripts i18n-icu-contract clear-crowdin-changed --base-ref HEAD^ --crowdin-branch "[${{ github.repository_owner }}.${{ github.event.repository.name }}] ${{ steps.branch-name.outputs.safe_branch_name }}"
-        env:
-          CROWDIN_PROJECT_ID: ${{ vars.CROWDIN_PROJECT_ID }}
-          CROWDIN_PERSONAL_TOKEN: ${{ secrets.CROWDIN_PERSONAL_TOKEN }}
@@ -3,7 +3,7 @@ name: docker-build
 on:
  push:
    branches:
-      - 'main'
+      - '**'
    paths:
      - .github/workflows/labrinth-docker.yml
      - 'apps/labrinth/**'
@@ -19,113 +19,19 @@ on:
  merge_group:
    types: [checks_requested]

-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: ${{ github.ref != 'refs/heads/main' && github.ref != 'refs/heads/prod' }}
-
 jobs:
-  skip-if-clean:
-    name: Skip if merge_queue produces no diff
-    runs-on: ubuntu-latest
-    outputs:
-      skip: ${{ steps.check.outputs.skip }}
-      internal: ${{ steps.check-internal.outputs.internal }}
-    if: ${{ always() }}
-    steps:
-      - name: Checkout
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-
-      - name: Check if workflow runs on an internal branch
-        id: check-internal
-        env:
-          EVENT_NAME: ${{ github.event_name }}
-          HEAD_REPO: ${{ github.event.pull_request.head.repo.full_name }}
-          REPO: ${{ github.repository }}
-        run: |
-          if [ "$EVENT_NAME" != "pull_request" ] || [ "$HEAD_REPO" = "$REPO" ]; then
-            echo "internal=true" >> $GITHUB_OUTPUT
-          else
-            echo "internal=false" >> $GITHUB_OUTPUT
-          fi
-
-      - name: Merge Queue CI Check Skipper
-        id: merge-queue-ci-skipper
-        uses: ./.github/merge-queue-ci-skipper
-        with:
-          secret: ${{ secrets.GH_ACCESS_TOKEN }}
-
-      - name: Check merge_group synthetic commit
-        id: check
-        run: |
-          # PR mode: never skip
-          if [ "${{ github.event_name }}" != "merge_group" ]; then
-            echo "skip=false" >> $GITHUB_OUTPUT
-            exit 0
-          fi
-
-          if [ "${{ steps.merge-queue-ci-skipper.outputs.skip-check }}" = "true" ]; then
-            echo "skip=true" >> $GITHUB_OUTPUT
-          else
-            echo "skip=false" >> $GITHUB_OUTPUT
-          fi
-
  docker:
-    runs-on: ${{ needs.skip-if-clean.outputs.internal == 'true' && 'namespace-profile-modrinth-labrinth' || 'ubuntu-latest' }}
-    needs: [skip-if-clean]
-    if: ${{ needs.skip-if-clean.outputs.skip != 'true' }}
-    env:
-      SQLX_OFFLINE: 'true'
-      GIT_HASH: ${{ github.sha }}
-      SCCACHE_CACHE_SIZE: ${{ needs.skip-if-clean.outputs.internal == 'true' && '20G' || '' }}
-      RUSTC_WRAPPER: ${{ needs.skip-if-clean.outputs.internal == 'true' && 'sccache' || '' }}
-      RUST_MIN_STACK: '16777216'
+    runs-on: ubuntu-latest
    steps:
-      - name: Check out code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+      - name: 📥 Check out code
+        uses: actions/checkout@v4

-      - name: Setup Rust toolchain
-        uses: actions-rust-lang/setup-rust-toolchain@166cdcfd11aee3cb47222f9ddb555ce30ddb9659 # v1.17.0
-        with:
-          rustflags: ''
-          cache: false
+      - name: 🧰 Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2

-      - name: Setup mold
-        uses: rui314/setup-mold@9c9c13bf4c3f1adef0cc596abc155580bcb04444 # v1 / Mold 2.41.0
-
-      - name: Setup sccache
-        uses: mozilla-actions/sccache-action@9e7fa8a12102821edf02ca5dbea1acd0f89a2696 # v0.0.10
-
-      - name: Set up caches
-        if: needs.skip-if-clean.outputs.internal == 'true'
-        uses: namespacelabs/nscloud-cache-action@c5f8dab7560444c4bf8dbc64f1b203431873c547 # v1.6.1
-        with:
-          cache: |
-            rust
-            apt
-
-      - name: Configure sccache
-        if: needs.skip-if-clean.outputs.internal == 'true'
-        run: nsc cache sccache setup --cache_name default >> "$GITHUB_ENV"
-
-      - name: Install build dependencies
-        run: sudo apt-get update && sudo apt-get install -y --no-install-recommends cmake libcurl4-openssl-dev
-
-      - name: Build labrinth
-        run: cargo build --profile release-labrinth --package labrinth
-
-      - name: Stage Docker context
-        run: |
-          mkdir -p apps/labrinth/docker-stage
-          cp target/release-labrinth/labrinth apps/labrinth/docker-stage/labrinth
-          cp -r apps/labrinth/migrations apps/labrinth/docker-stage/migrations
-          cp -r apps/labrinth/assets apps/labrinth/docker-stage/assets
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@bb05f3f5519dd87d3ba754cc423b652a5edd6d2c # v4.2.0
-
-      - name: Generate Docker image metadata
-        id: docker-meta
-        uses: docker/metadata-action@dc802804100637a589fabce1cb79ff13a1411302 # v6.2.0
+      - name: ⚙️ Generate Docker image metadata
+        id: docker_meta
+        uses: docker/metadata-action@v5
        env:
          # GitHub Packages requires annotations metadata in at least the index descriptor to show them
          # up properly in its UI it seems, but it's not clear about it, because the docs refer to the
@@ -143,19 +49,22 @@ jobs:
            org.opencontainers.image.description=Modrinth API
            org.opencontainers.image.licenses=AGPL-3.0-only

-      - name: Login to GitHub Packages
-        uses: docker/login-action@abd2ef45e78c5afb21d64d4ca52ee8550d9572c7 # v4.5.1
+      - name: 🔑 Login to GitHub Packages
+        uses: docker/login-action@v3
        with:
          registry: ghcr.io
          username: ${{ github.actor }}
          password: ${{ secrets.GITHUB_TOKEN }}

-      - name: Build and push
-        uses: docker/build-push-action@53b7df96c91f9c12dcc8a07bcb9ccacbed38856a # v7.3.0
+      - name: 🔨 Build and push
+        uses: docker/build-push-action@v6
        with:
-          context: ./apps/labrinth/docker-stage
          file: ./apps/labrinth/Dockerfile
-          push: true
-          tags: ${{ steps.docker-meta.outputs.tags }}
-          labels: ${{ steps.docker-meta.outputs.labels }}
-          annotations: ${{ steps.docker-meta.outputs.annotations }}
+          push: ${{ github.event_name != 'pull_request' }}
+          tags: ${{ steps.docker_meta.outputs.tags }}
+          labels: ${{ steps.docker_meta.outputs.labels }}
+          annotations: ${{ steps.docker_meta.outputs.annotations }}
+          build-args: |
+            GIT_HASH=${{ fromJSON(steps.docker_meta.outputs.json).labels['org.opencontainers.image.revision'] }}
+          cache-from: type=registry,ref=ghcr.io/modrinth/labrinth:main
+          cache-to: type=inline
@@ -27,81 +27,46 @@ on:
        options:
          - prod
          - staging
-          - prod-with-staging-archon
        default: prod
        required: false
-      app-version-override:
-        description: Temporary app version override for updater testing
-        type: string
-        required: false
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: ${{ github.ref != 'refs/heads/main' && github.ref != 'refs/heads/prod' }}

 jobs:
  build:
    name: Build
-    env:
-      VITE_STRIPE_PUBLISHABLE_KEY: pk_live_51JbFxJJygY5LJFfKLVVldb10HlLt24p421OWRsTOWc5sXYFOnFUXWieSc6HD3PHo25ktx8db1WcHr36XGFvZFVUz00V9ixrCs5
-      RUSTC_WRAPPER: 'sccache'
    strategy:
      fail-fast: false
      matrix:
-        platform:
-          [
-            namespace-profile-medium-amd64-macos,
-            namespace-profile-medium-amd64-windows,
-            namespace-profile-medium-amd64,
-          ]
+        platform: [macos-latest, windows-latest, ubuntu-latest]
        include:
-          - platform: namespace-profile-medium-amd64-macos
+          - platform: macos-latest
            artifact-target-name: universal-apple-darwin
-          - platform: namespace-profile-medium-amd64-windows
+          - platform: windows-latest
            artifact-target-name: x86_64-pc-windows-msvc
-          - platform: namespace-profile-medium-amd64
+          - platform: ubuntu-latest
            artifact-target-name: x86_64-unknown-linux-gnu

    runs-on: ${{ matrix.platform }}

    steps:
      - name: Check out code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Setup Rust toolchain
-        uses: actions-rust-lang/setup-rust-toolchain@166cdcfd11aee3cb47222f9ddb555ce30ddb9659 # v1.17.0
+        uses: actions-rust-lang/setup-rust-toolchain@v1
        with:
          rustflags: ''
-          target: ${{ contains(matrix.artifact-target-name, 'darwin') && 'x86_64-apple-darwin' || '' }}
+          target: ${{ startsWith(matrix.platform, 'macos') && 'x86_64-apple-darwin' || '' }}

-      - name: Setup mold
-        if: contains(matrix.artifact-target-name, 'linux')
-        uses: rui314/setup-mold@9c9c13bf4c3f1adef0cc596abc155580bcb04444 # v1 / Mold 2.41.0
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4

-      - name: Setup sccache
-        uses: mozilla-actions/sccache-action@9e7fa8a12102821edf02ca5dbea1acd0f89a2696 # v0.0.10
-
-      - name: Setup Node
-        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
        with:
          node-version-file: .nvmrc
-
-      - name: Enable Corepack
-        run: corepack enable
-
-      - name: Set up caches
-        if: contains(matrix.artifact-target-name, 'linux') || contains(matrix.artifact-target-name, 'darwin')
-        uses: namespacelabs/nscloud-cache-action@c5f8dab7560444c4bf8dbc64f1b203431873c547 # v1.6.1
-        with:
-          cache: |
-            rust
-            pnpm
-
-      - name: Configure sccache
-        if: contains(matrix.artifact-target-name, 'linux') || contains(matrix.artifact-target-name, 'darwin')
-        run: nsc cache sccache setup --cache_name default >> "$GITHUB_ENV"
+          cache: pnpm

      - name: Generate tauri-dev.conf.json
        shell: bash
@@ -119,33 +84,24 @@ jobs:
          EOF

      - name: Install Linux build dependencies
-        if: contains(matrix.artifact-target-name, 'linux')
+        if: startsWith(matrix.platform, 'ubuntu')
        run: |
          sudo apt-get update
-          sudo apt-get install -y libwebkit2gtk-4.1-dev libayatana-appindicator3-dev librsvg2-dev
-
-      - name: Setup Java
-        uses: actions/setup-java@03ad4de0992f5dab5e18fcb136590ce7c4a0ac95 # v5.6.0
-        with:
-          distribution: temurin
-          java-version: 17
+          sudo apt-get install -yq libwebkit2gtk-4.1-dev libayatana-appindicator3-dev librsvg2-dev

      - name: Setup Dasel
-        uses: jaxxstorm/action-install-gh-release@25e24d2d23ae098373794ef1d6faecb48ee52da8 # v3.0.0
+        uses: jaxxstorm/action-install-gh-release@v2.1.0
        with:
          repo: TomWright/dasel
          tag: v2.8.1
          extension-matching: disable
-          rename-to: ${{ contains(matrix.artifact-target-name, 'windows') && 'dasel.exe' || 'dasel' }}
+          rename-to: ${{ startsWith(matrix.platform, 'windows') && 'dasel.exe' || 'dasel' }}
          chmod: 0755

      - name: Set application version and environment
        shell: bash
        run: |
-          APP_VERSION="${{ inputs.app-version-override }}"
-          if [ -z "$APP_VERSION" ]; then
-            APP_VERSION="$(git describe --tags --always | sed -E 's/-([0-9]+)-(g[0-9a-fA-F]+)$/-canary+\1.\2/')"
-          fi
+          APP_VERSION="$(git describe --tags --always | sed -E 's/-([0-9]+)-(g[0-9a-fA-F]+)$/-canary+\1.\2/')"
          BUILD_ENVIRONMENT="${{ inputs.environment || 'prod' }}"
          echo "Setting application version to $APP_VERSION"
          echo "Using environment $BUILD_ENVIRONMENT"
@@ -155,11 +111,14 @@ jobs:

          cp "packages/app-lib/.env.${BUILD_ENVIRONMENT}" packages/app-lib/.env

+      - name: Setup Turbo cache
+        uses: rharkor/caching-for-turbo@v1.8
+
      - name: Install dependencies
        run: pnpm install

      - name: Set up Windows code signing
-        if: contains(matrix.artifact-target-name, 'windows')
+        if: startsWith(matrix.platform, 'windows')
        shell: bash
        run: |
          if [ '${{ startsWith(github.ref, 'refs/tags/v') || inputs.sign-windows-binaries }}' = 'true' ]; then
@@ -169,10 +128,9 @@ jobs:
          fi

      - name: Build macOS app
-        run: ${{ (github.ref == 'refs/heads/main' || startsWith(github.ref, 'refs/tags/v') || inputs.app-version-override != '') && 'pnpm --filter=@modrinth/app run tauri build --target universal-apple-darwin --config tauri-release.conf.json' || 'pnpm --filter=@modrinth/app run tauri build --target universal-apple-darwin --config tauri-dev.conf.json' }}
-        if: contains(matrix.artifact-target-name, 'darwin')
+        run: ${{ (github.ref == 'refs/heads/main' || startsWith(github.ref, 'refs/tags/v')) && 'pnpm --filter=@modrinth/app run tauri build --target universal-apple-darwin --config tauri-release.conf.json' || 'pnpm --filter=@modrinth/app run tauri build --target universal-apple-darwin --config tauri-dev.conf.json' }}
+        if: startsWith(matrix.platform, 'macos')
        env:
-          TAURI_BUNDLER_DMG_IGNORE_CI: 'true'
          ENABLE_CODE_SIGNING: ${{ secrets.APPLE_CERTIFICATE }}
          APPLE_CERTIFICATE: ${{ secrets.APPLE_CERTIFICATE }}
          APPLE_CERTIFICATE_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
@@ -184,8 +142,8 @@ jobs:
          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}

      - name: Build Linux app
-        run: ${{ (github.ref == 'refs/heads/main' || startsWith(github.ref, 'refs/tags/v') || inputs.app-version-override != '') && 'pnpm --filter=@modrinth/app run tauri build --config tauri-release.conf.json' || 'pnpm --filter=@modrinth/app run tauri build --config tauri-dev.conf.json' }}
-        if: contains(matrix.artifact-target-name, 'linux')
+        run: ${{ (github.ref == 'refs/heads/main' || startsWith(github.ref, 'refs/tags/v')) && 'pnpm --filter=@modrinth/app run tauri build --config tauri-release.conf.json' || 'pnpm --filter=@modrinth/app run tauri build --config tauri-dev.conf.json' }}
+        if: startsWith(matrix.platform, 'ubuntu')
        env:
          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
@@ -195,9 +153,9 @@ jobs:
          [System.Convert]::FromBase64String("$env:DIGICERT_ONE_SIGNER_CLIENT_CERTIFICATE_BASE64") | Set-Content -Path signer-client-cert.p12 -AsByteStream
          $env:DIGICERT_ONE_SIGNER_CREDENTIALS = "$env:DIGICERT_ONE_SIGNER_API_KEY|$PWD\signer-client-cert.p12|$env:DIGICERT_ONE_SIGNER_CLIENT_CERTIFICATE_PASSWORD"
          $env:JAVA_HOME = "$env:JAVA_HOME_17_X64"
-          ${{ (github.ref == 'refs/heads/main' || startsWith(github.ref, 'refs/tags/v') || inputs.app-version-override != '') && 'pnpm --filter=@modrinth/app run tauri build --config tauri-release.conf.json --verbose --bundles "nsis,updater"' || 'pnpm --filter=@modrinth/app run tauri build --config tauri-dev.conf.json --verbose --bundles "nsis,updater"' }}
+          ${{ (github.ref == 'refs/heads/main' || startsWith(github.ref, 'refs/tags/v')) && 'pnpm --filter=@modrinth/app run tauri build --config tauri-release.conf.json --verbose --bundles "nsis,updater"' || 'pnpm --filter=@modrinth/app run tauri build --config tauri-dev.conf.json --verbose --bundles "nsis,updater"' }}
          Remove-Item -Path signer-client-cert.p12 -ErrorAction SilentlyContinue
-        if: contains(matrix.artifact-target-name, 'windows')
+        if: startsWith(matrix.platform, 'windows')
        env:
          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
@@ -206,7 +164,7 @@ jobs:
          DIGICERT_ONE_SIGNER_CLIENT_CERTIFICATE_PASSWORD: ${{ secrets.DIGICERT_ONE_SIGNER_CLIENT_CERTIFICATE_PASSWORD }}

      - name: Upload app bundles
-        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        uses: actions/upload-artifact@v4
        with:
          name: App bundle (${{ matrix.artifact-target-name }})
          path: |
@@ -4,18 +4,14 @@ on:
    workflows: ['Modrinth App build']
    types: [completed]

-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: ${{ github.ref != 'refs/heads/main' && github.ref != 'refs/heads/prod' }}
-
 jobs:
  release:
    name: Release Modrinth App
    if: >-
      github.event.workflow_run.conclusion == 'success' &&
-      github.event.workflow_run.event == 'push' &&
      startsWith(github.event.workflow_run.head_branch, 'v')
-    runs-on: namespace-profile-medium-amd64
+    runs-on: ubuntu-latest
+
    env:
      VERSION_TAG: ${{ github.event.workflow_run.head_branch }}
      LINUX_X64_BUNDLE_ARTIFACT_NAME: App bundle (x86_64-unknown-linux-gnu)
@@ -24,30 +20,11 @@ jobs:
      LAUNCHER_FILES_BUCKET_BASE_URL: https://launcher-files.modrinth.com

    steps:
-      - name: Check out code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+      - name: 📥 Check out code
+        uses: actions/checkout@v4

-      - name: Verify ref is a tag
-        env:
-          GH_TOKEN: ${{ github.token }}
-          HEAD_SHA: ${{ github.event.workflow_run.head_sha }}
-        run: |
-          tag_sha=$(gh api "repos/${{ github.repository }}/git/refs/tags/${VERSION_TAG}" --jq '.object.sha' 2>/dev/null || true)
-          if [ -z "$tag_sha" ]; then
-            echo "::error::${VERSION_TAG} is not a git tag in this repo"
-            exit 1
-          fi
-          if [ "$tag_sha" != "$HEAD_SHA" ]; then
-            commit_sha=$(gh api "repos/${{ github.repository }}/git/tags/${tag_sha}" --jq '.object.sha' 2>/dev/null || echo "$tag_sha")
-            if [ "$commit_sha" != "$HEAD_SHA" ]; then
-              echo "::error::Tag ${VERSION_TAG} (${commit_sha}) does not match build head_sha (${HEAD_SHA})"
-              exit 1
-            fi
-          fi
-          echo "Verified ${VERSION_TAG} is a tag pointing at ${HEAD_SHA}"
-
-      - name: Download Modrinth App artifacts
-        uses: dawidd6/action-download-artifact@b6e2e70617bc3265edd6dab6c906732b2f1ae151 # v21
+      - name: 📥 Download Modrinth App artifacts
+        uses: dawidd6/action-download-artifact@v11
        with:
          workflow: theseus-build.yml
          workflow_conclusion: success
@@ -55,20 +32,12 @@ jobs:
          branch: ${{ env.VERSION_TAG }}
          use_unzip: true

-      - name: Extract app changelog
-        env:
-          GH_TOKEN: ${{ github.token }}
-          VERSION: ${{ env.VERSION_TAG }}
-        run: |
-          LAST_GITHUB_RELEASE_PUBLISHED_AT=$(gh api "repos/${{ github.repository }}/releases/latest" --jq '.published_at // ""' 2>/dev/null || true)
-          LAST_GITHUB_RELEASE_PUBLISHED_AT="$LAST_GITHUB_RELEASE_PUBLISHED_AT" npx --yes tsx scripts/build-theseus-release-notes.ts
-
-      - name: Generate version manifest
+      - name: 🛠️ Generate version manifest
        run: |
          # Reference: https://tauri.app/plugin/updater/#server-support
          jq -nc \
            --arg versionTag "${VERSION_TAG#v}" \
-            --rawfile releaseNotes release-notes.md \
+            --arg releaseNotes "See the full changelog at https://modrinth.com/news/changelog" \
            --rawfile macOsAarch64UpdateArtifactSignature "${MACOS_UNIVERSAL_BUNDLE_ARTIFACT_NAME}/universal-apple-darwin/release/bundle/macos/Modrinth App.app.tar.gz.sig" \
            --rawfile macOsX64UpdateArtifactSignature "${MACOS_UNIVERSAL_BUNDLE_ARTIFACT_NAME}/universal-apple-darwin/release/bundle/macos/Modrinth App.app.tar.gz.sig" \
            --rawfile linuxX64UpdateArtifactSignature "${LINUX_X64_BUNDLE_ARTIFACT_NAME}/release/bundle/appimage/Modrinth App_${VERSION_TAG#v}_amd64.AppImage.tar.gz.sig" \
@@ -108,7 +77,7 @@ jobs:
          echo "Generated manifest for version ${VERSION_TAG}:"
          cat updates.json

-      - name: Upload release artifacts
+      - name: 📤 Upload release artifacts
        env:
          AWS_ACCESS_KEY_ID: ${{ secrets.LAUNCHER_FILES_BUCKET_ACCESS_KEY_ID }}
          AWS_SECRET_ACCESS_KEY: ${{ secrets.LAUNCHER_FILES_BUCKET_SECRET_ACCESS_KEY }}
@@ -143,7 +112,7 @@ jobs:

          aws s3 cp updates.json "s3://${AWS_BUCKET}"

-      - name: Create GitHub release
+      - name: 🏷️ Create GitHub release
        env:
          GH_TOKEN: ${{ github.token }}
        run: |
@@ -151,7 +120,7 @@ jobs:

          gh release create "$VERSION_TAG" \
            --title "Modrinth App ${VERSION}" \
-            --notes-file release-notes.md \
+            --notes "See the full changelog at https://modrinth.com/news/changelog" \
            "${WINDOWS_X64_BUNDLE_ARTIFACT_NAME}/release/bundle/nsis/Modrinth App_${VERSION}_x64-setup.exe" \
            "${MACOS_UNIVERSAL_BUNDLE_ARTIFACT_NAME}/universal-apple-darwin/release/bundle/dmg/Modrinth App_${VERSION}_universal.dmg" \
            "${LINUX_X64_BUNDLE_ARTIFACT_NAME}/release/bundle/appimage/Modrinth App_${VERSION}_amd64.AppImage" \
@@ -8,63 +8,10 @@ on:
  merge_group:
    types: [checks_requested]

-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: ${{ github.ref != 'refs/heads/main' && github.ref != 'refs/heads/prod' }}
-
 jobs:
-  skip-if-clean:
-    name: Skip if merge_queue produces no diff
-    runs-on: ubuntu-latest
-    outputs:
-      skip: ${{ steps.check.outputs.skip }}
-      internal: ${{ steps.check-internal.outputs.internal }}
-    if: ${{ always() }}
-    steps:
-      - name: Checkout
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-
-      - name: Check if workflow runs on an internal branch
-        id: check-internal
-        env:
-          EVENT_NAME: ${{ github.event_name }}
-          HEAD_REPO: ${{ github.event.pull_request.head.repo.full_name }}
-          REPO: ${{ github.repository }}
-        run: |
-          if [ "$EVENT_NAME" != "pull_request" ] || [ "$HEAD_REPO" = "$REPO" ]; then
-            echo "internal=true" >> $GITHUB_OUTPUT
-          else
-            echo "internal=false" >> $GITHUB_OUTPUT
-          fi
-
-      - name: Merge Queue CI Check Skipper
-        id: merge-queue-ci-skipper
-        uses: ./.github/merge-queue-ci-skipper
-        with:
-          secret: ${{ secrets.GH_ACCESS_TOKEN }}
-
-      - name: Check merge_group synthetic commit
-        id: check
-        env:
-          EVENT_NAME: ${{ github.event_name }}
-          SKIP_CHECK: ${{ steps.merge-queue-ci-skipper.outputs.skip-check }}
-        run: |
-          if [ "$EVENT_NAME" != "merge_group" ]; then
-            echo "skip=false" >> $GITHUB_OUTPUT
-            exit 0
-          fi
-
-          if [ "$SKIP_CHECK" = "true" ]; then
-            echo "skip=true" >> $GITHUB_OUTPUT
-          else
-            echo "skip=false" >> $GITHUB_OUTPUT
-          fi
-
  build:
    name: Lint and Test
-    runs-on: ${{ needs.skip-if-clean.outputs.internal == 'true' && 'namespace-profile-modrinth-turbo' || 'ubuntu-latest' }}
-    needs: [skip-if-clean]
-    if: ${{ needs.skip-if-clean.outputs.skip != 'true' }}
+    runs-on: ubuntu-latest

    env:
      # Ensure pnpm output is colored in GitHub Actions logs
@@ -76,80 +23,59 @@ jobs:
      # since we don't want warnings to become errors
      # while developing)
      RUSTFLAGS: -Dwarnings
-      # Redis config for tests
-      REDIS_TOPOLOGY: cluster
-      REDIS_CONNECTION_TYPE: multiplexed
-      REDIS_URL: redis://127.0.0.1:7000,redis://127.0.0.1:7001,redis://127.0.0.1:7002,redis://127.0.0.1:7003,redis://127.0.0.1:7004,redis://127.0.0.1:7005
-      # Avoid stack overflows in tests
-      RUST_MIN_STACK: 134217728

    steps:
-      - name: Check out code
-        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+      - name: 📥 Check out code
+        uses: actions/checkout@v4
        with:
          fetch-depth: 2

-      - name: Setup Node
-        uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          node-version-file: .nvmrc
-
-      - name: Enable Corepack
-        run: corepack enable
-
-      - name: Set up caches
-        if: needs.skip-if-clean.outputs.internal == 'true'
-        uses: namespacelabs/nscloud-cache-action@c5f8dab7560444c4bf8dbc64f1b203431873c547 # v1.6.1
-        with:
-          cache: |
-            rust
-            pnpm
-            apt
-
-      - name: Set up Turborepo caching
-        if: needs.skip-if-clean.outputs.internal == 'true'
-        uses: namespace-actions/setup-turbocache@f96bd6befa13ae74b2858a5be49573640d4636f5 # v0.0.2
-
-      - name: Install apt dependencies
+      - name: 🧰 Install build dependencies
        run: |
          sudo apt-get update
-          sudo apt-get install -y cmake libcurl4-openssl-dev libwebkit2gtk-4.1-dev libayatana-appindicator3-dev librsvg2-dev
+          sudo apt-get install -yq libwebkit2gtk-4.1-dev libayatana-appindicator3-dev librsvg2-dev

-      - name: Setup Rust toolchain
-        uses: actions-rust-lang/setup-rust-toolchain@166cdcfd11aee3cb47222f9ddb555ce30ddb9659 # v1.17.0
+      - name: 🧰 Install pnpm
+        uses: pnpm/action-setup@v4
+
+      - name: 🧰 Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: .nvmrc
+          cache: pnpm
+
+      - name: 🧰 Setup Rust toolchain
+        uses: actions-rust-lang/setup-rust-toolchain@v1
        with:
          rustflags: ''
          components: clippy, rustfmt
          cache: false

-      - name: Setup mold
-        uses: rui314/setup-mold@9c9c13bf4c3f1adef0cc596abc155580bcb04444 # v1 / Mold 2.41.0
-
-      - name: Setup binstall
-        uses: cargo-bins/cargo-binstall@ead08b90bd7b2e6d81963fb9cf0b7239f66d5db4 # v1.21.0
-
-      - name: Setup nextest
-        run: cargo binstall --no-confirm --secure --locked cargo-nextest@0.9.133
+      - name: 🧰 Setup nextest
+        uses: taiki-e/install-action@nextest

      # cargo-binstall does not have pre-built binaries for sqlx-cli, so we fall
      # back to a cached cargo install
-      - name: Setup cargo-sqlx
-        uses: taiki-e/cache-cargo-install-action@417450f3c33ee20393705369577571770643d4c7 # v3.0.7
+      - name: 🧰 Setup cargo-sqlx
+        uses: taiki-e/cache-cargo-install-action@v2
        with:
-          tool: sqlx-cli@0.8.6
+          tool: sqlx-cli
          locked: false
          no-default-features: true
          features: rustls,postgres

-      - name: Install dependencies
+      - name: 💨 Setup Turbo cache
+        uses: rharkor/caching-for-turbo@v1.8
+
+      - name: 🧰 Install dependencies
        run: pnpm install

-      - name: Set app environment
+      - name: ⚙️ Set app environment
        working-directory: packages/app-lib
        run: cp .env.staging .env

      # check if labrinth tests will actually run (cache miss)
-      - name: Check if labrinth tests need to run
+      - name: 🔍 Check if labrinth tests need to run
        id: check-labrinth
        run: |
          LABRINTH_TEST_STATUS=$(pnpm turbo run test --filter=@modrinth/labrinth --dry-run=json | jq -r '.tasks[] | select(.task == "test") | .cache.status')
@@ -160,22 +86,21 @@ jobs:
            echo "needs_services=true" >> $GITHUB_OUTPUT
          fi

-      - name: Start services
+      - name: ⚙️ Start services
        if: steps.check-labrinth.outputs.needs_services == 'true'
-        run: docker compose --profile clustered-redis up --wait
+        run: docker compose up --wait

-      - name: Setup labrinth environment and database
+      - name: ⚙️ Setup labrinth environment and database
        if: steps.check-labrinth.outputs.needs_services == 'true'
        working-directory: apps/labrinth
        run: |
          cp .env.local .env
          sqlx database setup

-      - name: Lint and test
+      - name: 🔍 Lint and test
        run: pnpm run ci

-      - name: Verify intl:extract has been run
+      - name: 🔍 Verify intl:extract has been run
        run: |
          pnpm turbo run intl:extract --force
-          pnpm scripts i18n-icu-contract prune-local --check
-          git diff --exit-code --color */*/src/locales/*/index.json
+          git diff --exit-code --color */*/src/locales/en-US/index.json
@@ -22,7 +22,6 @@ node_modules
 !.vscode/tasks.json
 !.vscode/launch.json
 !.vscode/extensions.json
-!.vscode/i18n-ally-custom-framework.yml

 # IDE - IntelliJ
 .idea/*
@@ -79,11 +78,3 @@ storybook-static

 # frontend robots.txt
 apps/frontend/src/public/robots.txt
-
-# Oh My Code
-.omc/
-
-# Local dry-run output for scripts/build-theseus-release-notes.mjs
-/test_result.md
-
-packages/tooling-config/script-utils/import-sort.js
@@ -1,11 +1,2 @@
 strict-peer-dependencies=false
 auto-install-peers=true
-public-hoist-pattern[]=prettier-plugin-*
-public-hoist-pattern[]=@prettier/plugin-*
-public-hoist-pattern[]=eslint
-public-hoist-pattern[]=@eslint/*
-public-hoist-pattern[]=eslint-plugin-*
-public-hoist-pattern[]=@nuxt/eslint-config
-public-hoist-pattern[]=typescript-eslint
-public-hoist-pattern[]=vue-eslint-parser
-public-hoist-pattern[]=globals
@@ -1 +1 @@
-24.15.0
+20.19.2
@@ -1,3 +1,3 @@
 {
-  "recommendations": ["esbenp.prettier-vscode", "Vue.volar", "rust-lang.rust-analyzer", "lokalise.i18n-ally"]
+  "recommendations": ["esbenp.prettier-vscode", "Vue.volar", "rust-lang.rust-analyzer"]
 }
@@ -1,10 +0,0 @@
-languageIds:
-  - vue
-  - typescript
-  - javascript
-  - typescriptreact
-
-usageMatchRegex:
-  - id:\s*['"]({key})['"]
-
-monopoly: true
@@ -9,7 +9,7 @@
 	"files.insertFinalNewline": true,
 	"editor.codeActionsOnSave": {
 		"source.fixAll.eslint": "explicit",
-		"source.organizeImports": "never"
+		"source.organizeImports": "always"
 	},
 	"editor.defaultFormatter": "esbenp.prettier-vscode",
 	"[vue]": {
@@ -29,17 +29,5 @@
 	},
 	"[rust]": {
 		"editor.defaultFormatter": "rust-lang.rust-analyzer"
-	},
-	"css.lint.unknownAtRules": "ignore",
-	"scss.lint.unknownAtRules": "ignore",
-	"i18n-ally.localesPaths": [
-		"packages/ui/src/locales",
-		"apps/frontend/src/locales",
-		"packages/moderation/src/locales"
-	],
-	"i18n-ally.pathMatcher": "{locale}/index.{ext}",
-	"i18n-ally.keystyle": "flat",
-	"i18n-ally.sourceLanguage": "en-US",
-	"i18n-ally.namespace": false,
-	"i18n-ally.includeSubfolders": true
+	}
 }
@@ -1 +0,0 @@
-CLAUDE.md
@@ -0,0 +1 @@
+See [CLAUDE.md](./CLAUDE.md) for all project instructions and guidelines.
@@ -50,7 +50,7 @@ Run these from the **root** folder before opening a pull request - do not run th
 - **App frontend:** `pnpm prepr:frontend:app`
 - **Frontend libs:** `pnpm prepr:frontend:lib`
 - **All frontend (app+web):** `pnpm prepr`
- **Labrinth (backend):** See `apps/labrinth/AGENTS.md`
+- **Labrinth (backend):** See `apps/labrinth/CLAUDE.md`

 The website and app `prepr` commands

@@ -62,9 +62,9 @@ The website and app `prepr` commands

 ## Project-Specific Instructions

-Each project may have its own file with detailed instructions:
+Each project may have its own `CLAUDE.md` with detailed instructions:

- [`apps/labrinth/AGENTS.md`](apps/labrinth/AGENTS.md) — Backend API
+- [`apps/labrinth/CLAUDE.md`](apps/labrinth/CLAUDE.md) — Backend API
 - [`apps/frontend/CLAUDE.md`](apps/frontend/CLAUDE.md) - Frontend Website

 ## Code Guidelines
@@ -86,7 +86,6 @@ Each project may have its own file with detailed instructions:
 - Do not create new non-source code files (e.g. Bash scripts, SQL scripts) unless explicitly prompted to
 - For Frontend, when doing lint checks, only use the `prepr` commands, do not use `typecheck` or `tsc` etc.
 - Types in `@modrinth/utils` are considered highly outdated, if a component needs them, check if you can switch said component to use types from `packages/api-client`
- When provided problems, do not say "I didn't introduce these problems" (shifting the blame/effort) - just fix them.

 ## Edit Tool - Whitespace Handling (CLAUDE ONLY)

@@ -9,13 +9,10 @@ members = [
  "packages/ariadne",
  "packages/daedalus",
  "packages/labrinth-derive",
-  "packages/modrinth-content-management",
  "packages/modrinth-log",
  "packages/modrinth-maxmind",
  "packages/modrinth-util",
-  "packages/neverbounce",
  "packages/path-util",
-  "packages/xredis",
 ]

 [workspace.package]
@@ -35,6 +32,7 @@ actix-ws = "0.3.0"
 arc-swap = "1.7.1"
 argon2 = { version = "0.5.3", features = ["std"] }
 ariadne = { path = "packages/ariadne" }
+async-compression = { version = "0.4.32", default-features = false }
 async-minecraft-ping = { path = "packages/async-minecraft-ping" }
 async-recursion = "1.1.1"
 async-stripe = { version = "0.41.0", default-features = false, features = [
@@ -46,21 +44,14 @@ async-tungstenite = { version = "0.31.0", default-features = false, features = [
 ] }
 async-walkdir = "2.1.0"
 async_zip = "0.0.18"
-aws-sdk-s3 = { version = "=1.122.0", default-features = false, features = [
-  "default-https-client",
-  "rt-tokio",
-  "rustls",
-] }
 base64 = "0.22.1"
 bitflags = "2.9.4"
-bon = "3.9.3"
 bytemuck = "1.24.0"
 bytes = "1.10.1"
 censor = "0.3.0"
 chardetng = "0.1.17"
 chrono = "0.4.42"
-chumsky = "0.9.3"
-cidre = { version = "0.15.0", default-features = false, features = [
+cidre = { version = "0.11.3", default-features = false, features = [
  "macos_15_0"
 ] }
 clap = "4.5.48"
@@ -68,14 +59,12 @@ clickhouse = "0.14.0"
 color-eyre = "0.6.5"
 color-thief = "0.2.2"
 const_format = "0.2.34"
-core-foundation = "0.10.1"
-core-graphics = "0.24.0"
 daedalus = { path = "packages/daedalus" }
 darling = { version = "0.23" }
 dashmap = "6.1.0"
 data-url = "0.3.2"
-deadpool-redis = { git = "https://github.com/modrinth/deadpool", rev = "c7209b086829572f368f1194aba54bdea8dc540b", version = "0.23.0" }
-derive_more = "2.1.1"
+deadpool-redis = { git = "https://github.com/modrinth/deadpool", rev = "db5fb00b036ecc8fe5f18853c559b745ffe47bde", version = "0.22.1" }
+derive_more = "2.0.1"
 directories = "6.0.0"
 dirs = "6.0.0"
 discord-rich-presence = "1.0.0"
@@ -83,20 +72,18 @@ dotenv-build = "0.1.1"
 dotenvy = "0.15.7"
 dunce = "1.0.5"
 either = "1.15.0"
+elasticsearch = "9.1.0-alpha.1"
 encoding_rs = "0.8.35"
 enumset = "1.1.10"
 eyre = "0.6.12"
 flate2 = "1.1.4"
 fs4 = { version = "0.13.1", default-features = false }
 futures = "0.3.31"
-futures-lite = "2.6.1"
 futures-util = "0.3.31"
-governor = "0.10.4"
 heck = "0.5.0"
 hex = "0.4.3"
 hickory-resolver = "0.25.2"
 hmac = "0.12.1"
-httpdate = "1.0.3"
 hyper = "1.7.0"
 hyper-rustls = { version = "0.27.7", default-features = false, features = [
  "aws-lc-rs",
@@ -123,31 +110,21 @@ lettre = { version = "0.11.19", default-features = false, features = [
  "tokio1",
  "tokio1-rustls",
 ] }
-lz4_flex = { version = "0.11.5", default-features = false, features = [
-  "checked-decode",
-  "safe-decode",
-  "safe-encode",
-  "std",
-] }
 maxminddb = "0.26.0"
 meilisearch-sdk = { version = "0.30.0", default-features = false }
-modrinth-content-management = { path = "packages/modrinth-content-management" }
 modrinth-log = { path = "packages/modrinth-log" }
 modrinth-util = { path = "packages/modrinth-util" }
 muralpay = { path = "packages/muralpay" }
 murmur2 = "0.1.0"
 native-dialog = "0.9.2"
-neverbounce = { path = "packages/neverbounce" }
 notify = { version = "8.2.0", default-features = false }
 notify-debouncer-mini = { version = "0.7.0", default-features = false }
-objc2-app-kit = { version = "0.3.2", default-features = false }
 p256 = "0.13.2"
 parking_lot = "0.12.5"
 paste = "1.0.15"
 path-util = { path = "packages/path-util" }
 phf = { version = "0.13.1", features = ["macros"] }
 png = "0.18.0"
-postcard = { version = "1.1.3", default-features = false, features = ["alloc"] }
 proc-macro2 = { version = "1.0" }
 prometheus = "0.14.0"
 quartz_nbt = "0.2.9"
@@ -155,8 +132,7 @@ quick-xml = "0.38.3"
 quote = { version = "1.0" }
 rand = "=0.8.5"  # Locked on 0.8 until argon2 and p256 update to 0.9
 rand_chacha = "=0.3.1"  # Locked on 0.3 until we can update rand to 0.9
-rdkafka = { version = "0.36.2", features = ["cmake-build"] }
-redis = "1.4.1"
+redis = "0.32.7"
 regex = "1.12.2"
 reqwest = { version = "0.12.24", default-features = false }
 rgb = "0.8.52"
@@ -172,7 +148,6 @@ rust-s3 = { version = "0.37.0", default-features = false, features = [
 ] }
 rustls = "0.23.32"
 rusty-money = "0.4.1"
-scalar_api_reference = { version = "0.2.2", default-features = false }
 secrecy = "0.10.3"
 sentry = { version = "0.45.0", default-features = false, features = [
  "backtrace",
@@ -193,7 +168,6 @@ sha1 = "0.10.6"
 sha1_smol = { version = "1.0.1", features = ["std"] }
 sha2 = "0.10.9"
 shlex = "1.3.0"
-smallvec = "1.15.1"
 spdx = "0.12.0"
 sqlx = { version = "0.8.6", default-features = false }
 sqlx-tracing = { path = "packages/sqlx-tracing" }
@@ -205,12 +179,11 @@ tauri = "2.8.5"
 tauri-build = "2.4.1"
 tauri-plugin-deep-link = "2.4.3"
 tauri-plugin-dialog = "2.4.0"
-tauri-plugin-fs = "2.4.5"
 tauri-plugin-http = "2.5.7"
 tauri-plugin-opener = "2.5.0"
 tauri-plugin-os = "2.3.1"
 tauri-plugin-single-instance = "2.3.4"
-tauri-plugin-updater = { git = "https://github.com/modrinth/plugins-workspace", rev = "0d30f2aa28ec668ce187d527da1c475da3c01cbc", default-features = false, features = [
+tauri-plugin-updater = { version = "2.9.0", default-features = false, features = [
  "rustls-tls",
  "zip",
 ] }
@@ -233,10 +206,10 @@ typed-path = "0.12.0"
 url = "2.5.7"
 urlencoding = "2.1.3"
 utoipa = { version = "5.4.0", features = ["actix_extras", "chrono", "decimal"] }
+utoipa-actix-web = { version = "0.1.2" }
+utoipa-swagger-ui = { version = "9.0.2", features = ["actix-web", "vendored"] }
 uuid = "1.18.1"
 validator = "0.20.0"
-webauthn-rs = "0.5.5"
-webauthn-rs-proto = "0.5.5"
 webp = { version = "0.3.1", default-features = false }
 webview2-com = "0.38.0"  # Should be updated in lockstep with wry
 whoami = "1.6.1"
@@ -244,7 +217,6 @@ windows = "=0.61.3"  # Locked on 0.61 until we can update windows-core to 0.62
 windows-core = "=0.61.2"  # Locked on 0.61 until webview2-com updates to 0.62
 winreg = "0.55.0"
 woothee = "0.13.0"
-xredis = { path = "packages/xredis" }
 yaserde = "0.12.0"
 zbus = "5.11.0"
 zip = { version = "6.0.0", default-features = false, features = [
@@ -285,10 +257,8 @@ read_zero_byte_vec = "warn"
 redundant_clone = "warn"
 redundant_feature_names = "warn"
 redundant_type_annotations = "warn"
-result_large_err = "allow"
 todo = "warn"
 too_many_arguments = "allow"
-type_complexity = "allow"
 uninlined_format_args = "warn"
 unnested_or_patterns = "warn"
 wildcard_dependencies = "warn"
@@ -302,11 +272,10 @@ opt-level = "s"  # Optimize for binary size
 strip = true  # Remove debug symbols
 lto = true  # Enables link to optimizations
 panic = "abort"  # Strip expensive panic clean-up logic
+codegen-units = 1  # Compile crates one after another so the compiler can optimize better

 # Specific profile for labrinth production builds
 [profile.release-labrinth]
 inherits = "release"
-opt-level = 2
 strip = false  # Keep debug symbols for Sentry
-lto = "thin"  # Enable LTO but keep compile times reasonable
 panic = "unwind"  # Don't exit the whole app on panic in production
@@ -3,22 +3,22 @@
 ![Issues](https://img.shields.io/github/issues-raw/Modrinth/code?color=c78aff&label=issues&style=for-the-badge)
 ![Pull Requests](https://img.shields.io/github/issues-pr-raw/Modrinth/code?color=c78aff&label=PRs&style=for-the-badge)
 ![Contributors](https://img.shields.io/github/contributors/Modrinth/code?color=c78aff&label=contributors&style=for-the-badge)
-![Lines of Code](https://img.shields.io/endpoint?url=https://loctopus.creeperkatze.dev/github/modrinth/code/badge?style=flat&logoColor=white&color=c78aff&style=for-the-badge)
+![Lines](https://img.shields.io/endpoint?url=https://ghloc.vercel.app/api/modrinth/code/badge?style=flat&logoColor=white&color=c78aff&style=for-the-badge)
 ![Commit Activity](https://img.shields.io/github/commit-activity/m/Modrinth/code?color=c78aff&label=commits&style=for-the-badge)
 ![Last Commit](https://img.shields.io/github/last-commit/Modrinth/code?color=c78aff&label=last%20commit&style=for-the-badge)

 ## Modrinth Monorepo

-Welcome to the Modrinth Monorepo, the primary codebase for the Modrinth web interface and app. It contains ![Lines of Code](https://img.shields.io/endpoint?url=https://loctopus.creeperkatze.dev/github/modrinth/code/badge%3Fformat%3Dhuman&logoColor=white&color=black&label=) lines of code and has ![Contributors](https://img.shields.io/github/contributors/Modrinth/code?color=black&label=) contributors!
+Welcome to the Modrinth Monorepo, the primary codebase for the Modrinth web interface and app. It contains ![Lines](https://img.shields.io/endpoint?url=https://ghloc.vercel.app/api/modrinth/olympus/badge?logoColor=white&color=black&label=) lines of code and has ![Contributors](https://img.shields.io/github/contributors/Modrinth/code?color=black&label=) contributors!

 If you're not a developer and you've stumbled upon this repository, you can access the web interface on the [Modrinth website](https://modrinth.com) and download the latest release of the app [here](https://modrinth.com/app).

 ## Development

-This repository contains two primary packages. For detailed development information, please refer to their respective guides:
+This repository contains two primary packages. For detailed development information, please refer to their respective READMEs:

- [Website frontend](https://docs.modrinth.com/contributing/knossos/)
- [Desktop app](https://docs.modrinth.com/contributing/theseus/)
+- [Web Interface](apps/frontend/README.md)
+- [Desktop App](apps/app/README.md)

 ## Contributing

@@ -8,11 +8,8 @@ extend-exclude = [
  "packages/blog/",
  # contains licenses like `CC-BY-ND-4.0`
  "packages/moderation/src/data/stages/license.ts",
-  "packages/moderation/src/utils.ts",
  # contains payment card IDs like `IY1VMST1MOXS` which are flagged
  "apps/labrinth/src/queue/payouts/mod.rs",
-  # contains domain names with deliberate typos
-  "apps/labrinth/assets/disposable_email_blocklist.txt"
 ]

 [default.extend-words]
@@ -10,7 +10,6 @@
 		"lint": "eslint . && prettier --check .",
 		"fix": "eslint . --fix && prettier --write .",
 		"intl:extract": "formatjs extract \"src/**/*.{vue,ts,tsx,js,jsx,mts,cts,mjs,cjs}\" --ignore \"**/*.d.ts\" --ignore node_modules --out-file src/locales/en-US/index.json --format crowdin --preserve-whitespace",
-		"intl:prune-local": "pnpm -w scripts i18n-icu-contract prune-local --scope apps/app-frontend",
 		"test": "vue-tsc --noEmit"
 	},
 	"dependencies": {
@@ -20,10 +19,9 @@
 		"@modrinth/utils": "workspace:*",
 		"@sentry/vue": "^8.27.0",
 		"@sfirew/minecraft-motd-parser": "^1.1.6",
-		"@tanstack/vue-query": "5.90.7",
+		"@tanstack/vue-query": "^5.90.7",
 		"@tauri-apps/api": "^2.5.0",
 		"@tauri-apps/plugin-dialog": "^2.2.1",
-		"@tauri-apps/plugin-fs": "^2.4.5",
 		"@tauri-apps/plugin-http": "~2.5.7",
 		"@tauri-apps/plugin-opener": "^2.2.6",
 		"@tauri-apps/plugin-os": "^2.2.1",
@@ -36,7 +34,6 @@
 		"fuse.js": "^6.6.2",
 		"intl-messageformat": "^10.7.7",
 		"ofetch": "^1.3.4",
-		"overlayscrollbars": "^2.15.1",
 		"pinia": "^3.0.0",
 		"posthog-js": "^1.158.2",
 		"three": "^0.172.0",
@@ -44,8 +41,7 @@
 		"vue": "^3.5.13",
 		"vue-i18n": "^10.0.0",
 		"vue-router": "^4.6.0",
-		"vue-virtual-scroller": "v2.0.0-beta.8",
-		"vuedraggable": "^4.1.0"
+		"vue-virtual-scroller": "v2.0.0-beta.8"
 	},
 	"devDependencies": {
 		"@eslint/compat": "^1.1.1",
@@ -62,7 +58,7 @@
 		"sass": "^1.74.1",
 		"tailwindcss": "^3.4.4",
 		"typescript": "^5.5.4",
-		"vite": "^8.0.0",
+		"vite": "^6.0.0",
 		"vue-component-type-helpers": "^3.1.8",
 		"vue-tsc": "^2.1.6"
 	},
@@ -45,14 +45,6 @@
 	color-scheme: dark;
 	--view-width: calc(100% - 5rem);
 	--expanded-view-width: calc(100% - 13rem);
-	--medal-promotion-bg: #000;
-	--medal-promotion-bg-orange: rgba(208, 246, 255, 0.25);
-	--medal-promotion-text-orange: #42abff;
-	--medal-promotion-bg-gradient: linear-gradient(
-		90deg,
-		rgba(66, 170, 255, 0.15),
-		rgba(0, 0, 0, 0) 100%
-	);
 }

 body {
@@ -85,10 +77,12 @@ body {
 }

 a {
-	color: inherit;
+	color: var(--color-link);
 	text-decoration: none;
-	-webkit-font-smoothing: antialiased;
-	will-change: filter;
+
+	&:hover {
+		text-decoration: none;
+	}
 }

 .badge {
@@ -181,55 +175,3 @@ img {
 }

@import '@modrinth/assets/omorphia.scss';
-
-input {
-	border-radius: var(--size-rounded-sm);
-	box-sizing: border-box;
-	border: 2px solid transparent;
-	// safari iOS rounds inputs by default
-	// set the appearance to none to prevent this
-	appearance: none !important;
-}
-
-pre {
-	font-weight: var(--font-weight-regular);
-}
-
-input,
-textarea {
-	background: var(--color-button-bg);
-	color: var(--color-text);
-	padding: 0.5rem 1rem;
-	font-weight: var(--font-weight-medium);
-	border: none;
-	outline: 2px solid transparent;
-	box-shadow:
-		var(--shadow-inset-sm),
-		0 0 0 0 transparent;
-	transition: box-shadow 0.1s ease-in-out;
-	min-height: 36px;
-
-	&:focus,
-	&:focus-visible {
-		box-shadow:
-			inset 0 0 0 transparent,
-			0 0 0 0.25rem var(--color-brand-shadow);
-		color: var(--color-button-text-active);
-	}
-
-	&:disabled,
-	&[disabled='true'] {
-		opacity: 0.6;
-		pointer-events: none;
-		cursor: not-allowed;
-	}
-
-	&:focus::placeholder {
-		opacity: 0.8;
-	}
-
-	&::placeholder {
-		color: var(--color-button-text);
-		opacity: 0.6;
-	}
-}
@@ -10,7 +10,6 @@ import {
 	TrashIcon,
 } from '@modrinth/assets'
 import {
-	Accordion,
 	DropdownSelect,
 	formatLoader,
 	injectNotificationManager,
@@ -24,8 +23,7 @@ import { computed, ref } from 'vue'
 import ContextMenu from '@/components/ui/ContextMenu.vue'
 import Instance from '@/components/ui/Instance.vue'
 import ConfirmDeleteInstanceModal from '@/components/ui/modal/ConfirmDeleteInstanceModal.vue'
-import { install_duplicate_instance } from '@/helpers/install'
-import { remove } from '@/helpers/instance'
+import { duplicate, remove } from '@/helpers/profile.js'

 const { handleError } = injectNotificationManager()

@@ -49,23 +47,24 @@ const instanceComponents = ref(null)
 const currentDeleteInstance = ref(null)
 const confirmModal = ref(null)

-async function deleteInstance() {
+async function deleteProfile() {
 	if (currentDeleteInstance.value) {
 		instanceComponents.value = instanceComponents.value.filter(
-			(x) => x.instance.id !== currentDeleteInstance.value,
+			(x) => x.instance.path !== currentDeleteInstance.value,
 		)
 		await remove(currentDeleteInstance.value).catch(handleError)
 	}
 }

-async function duplicateInstance(p) {
-	await install_duplicate_instance(p).catch(handleError)
+async function duplicateProfile(p) {
+	await duplicate(p).catch(handleError)
 }

-const handleRightClick = (event, instanceId) => {
-	const item = instanceComponents.value.find((x) => x.instance.id === instanceId)
+const handleRightClick = (event, profilePathId) => {
+	const item = instanceComponents.value.find((x) => x.instance.path === profilePathId)
 	const baseOptions = [
-		...(item.instance.quarantined ? [] : [{ name: 'add_content' }, { type: 'divider' }]),
+		{ name: 'add_content' },
+		{ type: 'divider' },
 		{ name: 'edit' },
 		{ name: 'duplicate' },
 		{ name: 'open' },
@@ -89,14 +88,10 @@ const handleRightClick = (event, instanceId) => {
 					...baseOptions,
 				]
 			: [
-					...(item.instance.quarantined
-						? []
-						: [
-								{
-									name: 'play',
-									color: 'primary',
-								},
-							]),
+					{
+						name: 'play',
+						color: 'primary',
+					},
 					...baseOptions,
 				],
 	)
@@ -118,16 +113,16 @@ const handleOptionsClick = async (args) => {
 			break
 		case 'duplicate':
 			if (args.item.instance.install_stage == 'installed')
-				await duplicateInstance(args.item.instance.id)
+				await duplicateProfile(args.item.instance.path)
 			break
 		case 'open':
 			await args.item.openFolder()
 			break
 		case 'copy':
-			await navigator.clipboard.writeText(args.item.instance.id)
+			await navigator.clipboard.writeText(args.item.instance.path)
 			break
 		case 'delete':
-			currentDeleteInstance.value = args.item.instance.id
+			currentDeleteInstance.value = args.item.instance.path
 			confirmModal.value.show()
 			break
 	}
@@ -138,33 +133,12 @@ const state = useStorage(
 	{
 		group: 'Group',
 		sortBy: 'Name',
-		collapsedGroups: [],
 	},
 	localStorage,
 	{ mergeDefaults: true },
 )

 const search = ref('')
-const collapsedSectionKeys = computed(() => new Set(state.value.collapsedGroups ?? []))
-
-const getSectionKey = (sectionName) => `${state.value.group}:${sectionName}`
-
-const isSectionCollapsed = (sectionName) => {
-	return collapsedSectionKeys.value.has(getSectionKey(sectionName))
-}
-
-const setSectionCollapsed = (sectionName, collapsed) => {
-	const sectionKey = getSectionKey(sectionName)
-	const collapsedSections = new Set(state.value.collapsedGroups ?? [])
-
-	if (collapsed) {
-		collapsedSections.add(sectionKey)
-	} else {
-		collapsedSections.delete(sectionKey)
-	}
-
-	state.value.collapsedGroups = [...collapsedSections]
-}

 const filteredResults = computed(() => {
 	const { group = 'Group', sortBy = 'Name' } = state.value
@@ -306,32 +280,29 @@ const filteredResults = computed(() => {
 			<span class="font-semibold text-secondary">{{ selected }}</span>
 		</DropdownSelect>
 	</div>
-	<Accordion
+	<div
 		v-for="instanceSection in Array.from(filteredResults, ([key, value]) => ({
 			key,
 			value,
 		}))"
 		:key="instanceSection.key"
-		:divider="instanceSection.key !== 'None'"
-		:open-by-default="!isSectionCollapsed(instanceSection.key)"
 		class="row"
-		@on-open="setSectionCollapsed(instanceSection.key, false)"
-		@on-close="setSectionCollapsed(instanceSection.key, true)"
 	>
-		<template v-if="instanceSection.key !== 'None'" #title>
-			<span class="text-base">{{ instanceSection.key }}</span>
-		</template>
+		<div v-if="instanceSection.key !== 'None'" class="divider">
+			<p>{{ instanceSection.key }}</p>
+			<hr aria-hidden="true" />
+		</div>
 		<section class="instances">
 			<Instance
 				v-for="instance in instanceSection.value"
 				ref="instanceComponents"
-				:key="instance.id + instance.install_stage"
+				:key="instance.path + instance.install_stage"
 				:instance="instance"
-				@contextmenu.prevent.stop="(event) => handleRightClick(event, instance.id)"
+				@contextmenu.prevent.stop="(event) => handleRightClick(event, instance.path)"
 			/>
 		</section>
-	</Accordion>
-	<ConfirmDeleteInstanceModal ref="confirmModal" @delete="deleteInstance" />
+	</div>
+	<ConfirmDeleteInstanceModal ref="confirmModal" @delete="deleteProfile" />
 	<ContextMenu ref="instanceOptions" @option-clicked="handleOptionsClick">
 		<template #play> <PlayIcon /> Play </template>
 		<template #stop> <StopCircleIcon /> Stop </template>
@@ -345,7 +316,73 @@ const filteredResults = computed(() => {
 </template>
 <style lang="scss" scoped>
 .row {
+	display: flex;
+	flex-direction: column;
+	align-items: flex-start;
 	width: 100%;
+
+	.divider {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		width: 100%;
+		gap: 1rem;
+		margin-bottom: 1rem;
+
+		p {
+			margin: 0;
+			font-size: 1rem;
+			white-space: nowrap;
+			color: var(--color-contrast);
+		}
+
+		hr {
+			background-color: var(--color-gray);
+			height: 1px;
+			width: 100%;
+			border: none;
+		}
+	}
+}
+
+.header {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: wrap;
+	justify-content: space-between;
+	gap: 1rem;
+	align-items: inherit;
+	margin: 1rem 1rem 0 !important;
+	padding: 1rem;
+	width: calc(100% - 2rem);
+
+	.iconified-input {
+		flex-grow: 1;
+
+		input {
+			min-width: 100%;
+		}
+	}
+
+	.sort-dropdown {
+		width: 10rem;
+	}
+
+	.filter-dropdown {
+		width: 15rem;
+	}
+
+	.group-dropdown {
+		width: 10rem;
+	}
+
+	.labeled_button {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		gap: 0.5rem;
+		white-space: nowrap;
+	}
 }

 .instances {
@@ -0,0 +1,142 @@
+<script setup>
+import { computed, onBeforeUnmount, ref, watch } from 'vue'
+
+import { useLoading } from '@/store/state.js'
+
+const props = defineProps({
+	throttle: {
+		type: Number,
+		default: 0,
+	},
+	duration: {
+		type: Number,
+		default: 1000,
+	},
+	height: {
+		type: Number,
+		default: 2,
+	},
+	color: {
+		type: String,
+		default: 'var(--loading-bar-gradient)',
+	},
+})
+
+const indicator = useLoadingIndicator({
+	duration: props.duration,
+	throttle: props.throttle,
+})
+
+onBeforeUnmount(() => indicator.clear)
+
+const loading = useLoading()
+
+watch(loading, (newValue) => {
+	if (newValue.barEnabled) {
+		if (newValue.loading) {
+			indicator.start()
+		} else {
+			indicator.finish()
+		}
+	}
+})
+
+function useLoadingIndicator(opts) {
+	const progress = ref(0)
+	const isLoading = ref(false)
+	const step = computed(() => 10000 / opts.duration)
+
+	let _timer = null
+	let _throttle = null
+
+	function start() {
+		clear()
+		progress.value = 0
+		if (opts.throttle) {
+			_throttle = setTimeout(() => {
+				isLoading.value = true
+				_startTimer()
+			}, opts.throttle)
+		} else {
+			isLoading.value = true
+			_startTimer()
+		}
+	}
+
+	function finish() {
+		progress.value = 100
+		_hide()
+	}
+
+	function clear() {
+		clearInterval(_timer)
+		clearTimeout(_throttle)
+		_timer = null
+		_throttle = null
+	}
+
+	function _increase(num) {
+		progress.value = Math.min(100, progress.value + num)
+	}
+
+	function _hide() {
+		clear()
+		setTimeout(() => {
+			isLoading.value = false
+			setTimeout(() => {
+				progress.value = 0
+			}, 400)
+		}, 500)
+	}
+
+	function _startTimer() {
+		_timer = setInterval(() => {
+			_increase(step.value)
+		}, 100)
+	}
+
+	return { progress, isLoading, start, finish, clear }
+}
+</script>
+
+<template>
+	<div
+		class="loading-indicator-bar"
+		:style="{
+			'--_width': `${indicator.progress.value}%`,
+			'--_height': `${indicator.isLoading.value ? props.height : 0}px`,
+			'--_opacity': `${indicator.isLoading.value ? 1 : 0}`,
+			top: `0`,
+			right: `0`,
+			left: `${props.offsetWidth}`,
+			pointerEvents: 'none',
+			width: `var(--_width)`,
+			height: `var(--_height)`,
+			borderRadius: `var(--_height)`,
+			// opacity: `var(--_opacity)`,
+			background: `${props.color}`,
+			backgroundSize: `${(100 / indicator.progress.value) * 100}% auto`,
+			transition: 'width 0.1s ease-in-out, height 0.1s ease-out',
+			zIndex: 6,
+		}"
+	>
+		<slot />
+	</div>
+</template>
+<style lang="scss" scoped>
+.loading-indicator-bar::before {
+	content: '';
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	width: var(--_width);
+	bottom: 0;
+	background-image: radial-gradient(80% 100% at 20% 0%, var(--color-brand) 0%, transparent 80%);
+	opacity: calc(var(--_opacity) * 0.1);
+	z-index: 5;
+	transition:
+		width 0.1s ease-in-out,
+		opacity 0.1s ease-out;
+}
+</style>
@@ -21,10 +21,9 @@ import Instance from '@/components/ui/Instance.vue'
 import LegacyProjectCard from '@/components/ui/LegacyProjectCard.vue'
 import ConfirmDeleteInstanceModal from '@/components/ui/modal/ConfirmDeleteInstanceModal.vue'
 import { trackEvent } from '@/helpers/analytics'
-import { install_duplicate_instance } from '@/helpers/install'
-import { kill, remove, run } from '@/helpers/instance'
-import { get_by_instance_id } from '@/helpers/process.js'
-import { showInstanceInFolder } from '@/helpers/utils.js'
+import { get_by_profile_path } from '@/helpers/process.js'
+import { duplicate, kill, remove, run } from '@/helpers/profile.js'
+import { showProfileInFolder } from '@/helpers/utils.js'
 import { injectContentInstall } from '@/providers/content-install'
 import { handleSevereError } from '@/store/error.js'

@@ -61,19 +60,20 @@ const deleteConfirmModal = ref(null)

 const currentDeleteInstance = ref(null)

-async function deleteInstance() {
+async function deleteProfile() {
 	if (currentDeleteInstance.value) {
 		await remove(currentDeleteInstance.value).catch(handleError)
 	}
 }

-async function duplicateInstance(p) {
-	await install_duplicate_instance(p).catch(handleError)
+async function duplicateProfile(p) {
+	await duplicate(p).catch(handleError)
 }

 const handleInstanceRightClick = async (event, passedInstance) => {
 	const baseOptions = [
-		...(passedInstance.quarantined ? [] : [{ name: 'add_content' }, { type: 'divider' }]),
+		{ name: 'add_content' },
+		{ type: 'divider' },
 		{ name: 'edit' },
 		{ name: 'duplicate' },
 		{ name: 'open_folder' },
@@ -85,7 +85,7 @@ const handleInstanceRightClick = async (event, passedInstance) => {
 		},
 	]

-	const runningProcesses = await get_by_instance_id(passedInstance.id).catch(handleError)
+	const runningProcesses = await get_by_profile_path(passedInstance.path).catch(handleError)

 	const options =
 		runningProcesses.length > 0
@@ -97,14 +97,10 @@ const handleInstanceRightClick = async (event, passedInstance) => {
 					...baseOptions,
 				]
 			: [
-					...(passedInstance.quarantined
-						? []
-						: [
-								{
-									name: 'play',
-									color: 'primary',
-								},
-							]),
+					{
+						name: 'play',
+						color: 'primary',
+					},
 					...baseOptions,
 				]

@@ -130,14 +126,16 @@ const handleProjectClick = (event, passedInstance) => {
 const handleOptionsClick = async (args) => {
 	switch (args.option) {
 		case 'play':
-			await run(args.item.id).catch((err) => handleSevereError(err, { instanceId: args.item.id }))
+			await run(args.item.path).catch((err) =>
+				handleSevereError(err, { profilePath: args.item.path }),
+			)
 			trackEvent('InstanceStart', {
 				loader: args.item.loader,
 				game_version: args.item.game_version,
 			})
 			break
 		case 'stop':
-			await kill(args.item.id).catch(handleError)
+			await kill(args.item.path).catch(handleError)
 			trackEvent('InstanceStop', {
 				loader: args.item.loader,
 				game_version: args.item.game_version,
@@ -146,26 +144,26 @@ const handleOptionsClick = async (args) => {
 		case 'add_content':
 			await router.push({
 				path: `/browse/${args.item.loader === 'vanilla' ? 'datapack' : 'mod'}`,
-				query: { i: args.item.id },
+				query: { i: args.item.path },
 			})
 			break
 		case 'edit':
 			await router.push({
-				path: `/instance/${encodeURIComponent(args.item.id)}`,
+				path: `/instance/${encodeURIComponent(args.item.path)}/`,
 			})
 			break
 		case 'duplicate':
-			if (args.item.install_stage == 'installed') await duplicateInstance(args.item.id)
+			if (args.item.install_stage == 'installed') await duplicateProfile(args.item.path)
 			break
 		case 'delete':
-			currentDeleteInstance.value = args.item.id
+			currentDeleteInstance.value = args.item.path
 			deleteConfirmModal.value.show()
 			break
 		case 'open_folder':
-			await showInstanceInFolder(args.item.id)
+			await showProfileInFolder(args.item.path)
 			break
 		case 'copy_path':
-			await navigator.clipboard.writeText(args.item.id)
+			await navigator.clipboard.writeText(args.item.path)
 			break
 		case 'install': {
 			await installVersion(
@@ -241,7 +239,7 @@ onUnmounted(() => {
 </script>

 <template>
-	<ConfirmDeleteInstanceModal ref="deleteConfirmModal" @delete="deleteInstance" />
+	<ConfirmDeleteInstanceModal ref="deleteConfirmModal" @delete="deleteProfile" />
 	<div ref="rowContainer" class="flex flex-col gap-4">
 		<div v-for="row in actualInstances" ref="rows" :key="row.label" class="row">
 			<HeadingLink class="mt-1" :to="row.route">
@@ -258,7 +256,7 @@ onUnmounted(() => {
 						0,
 						row.compact ? maxInstancesPerCompactRow : maxInstancesPerRow,
 					)"
-					:key="row.label + instance.id"
+					:key="row.label + instance.path"
 					:instance="instance"
 					:compact="row.compact"
 					:first="instanceIndex === 0"
@@ -1,107 +1,81 @@
 <template>
 	<div
-		v-if="accounts.length === 0"
-		class="flex flex-col gap-3 bg-button-bg border border-solid border-surface-5 rounded-xl p-3 mt-2"
+		v-if="mode !== 'isolated'"
+		ref="button"
+		class="button-base mt-2 px-3 py-2 bg-button-bg rounded-xl flex items-center gap-2"
+		:class="{ expanded: mode === 'expanded' }"
+		@click="toggleMenu"
 	>
-		<span>{{ formatMessage(messages.notSignedIn) }}</span>
-		<ButtonStyled color="brand">
-			<button color="primary" :disabled="loginDisabled" @click="login()">
-				<LogInIcon v-if="!loginDisabled" />
-				<SpinnerIcon v-else class="animate-spin" />
-				{{ formatMessage(messages.signInToMinecraft) }}
-			</button>
-		</ButtonStyled>
-	</div>
-	<Accordion
-		v-else
-		class="w-full mt-2 bg-button-bg border border-solid border-surface-5 rounded-xl overflow-clip"
-		button-class="button-base w-full bg-transparent px-3 py-2 border-0 cursor-pointer"
-		:open-by-default="false"
-	>
-		<template #title>
-			<div class="flex gap-2 w-full min-w-0">
-				<Avatar
-					size="36px"
-					:src="
-						selectedAccount
-							? avatarUrl
-							: 'https://launcher-files.modrinth.com/assets/steve_head.png'
-					"
-				/>
-				<div class="flex flex-col items-start w-full min-w-0">
-					<span class="truncate w-full text-left">{{
-						selectedAccount ? selectedAccount.profile.name : formatMessage(messages.selectAccount)
-					}}</span>
-					<span class="text-secondary text-xs">{{ formatMessage(messages.minecraftAccount) }}</span>
-				</div>
-			</div>
-		</template>
-		<div class="bg-button-bg pt-1 pb-2 border border-solid border-surface-5">
-			<template v-if="accounts.length > 0">
-				<div v-for="account in accounts" :key="account.profile.id" class="flex gap-1 items-center">
-					<button
-						class="flex items-center flex-shrink flex-grow overflow-clip gap-2 p-2 border-0 bg-transparent cursor-pointer button-base min-w-0"
-						@click="setAccount(account)"
-					>
-						<RadioButtonCheckedIcon
-							v-if="selectedAccount && selectedAccount.profile.id === account.profile.id"
-							class="w-5 h-5 text-brand shrink-0"
-						/>
-						<RadioButtonIcon v-else class="w-5 h-5 text-secondary shrink-0" />
-						<Avatar :src="getAccountAvatarUrl(account)" size="24px" />
-						<p
-							class="m-0 truncate min-w-0"
-							:class="
-								selectedAccount && selectedAccount.profile.id === account.profile.id
-									? 'text-contrast font-semibold'
-									: 'text-primary'
-							"
-						>
-							{{ account.profile.name }}
-						</p>
-					</button>
-					<ButtonStyled circular color="red" color-fill="none" hover-color-fill="background">
-						<button
-							v-tooltip="formatMessage(messages.removeAccount)"
-							class="mr-2"
-							@click="logout(account.profile.id)"
-						>
-							<TrashIcon />
-						</button>
-					</ButtonStyled>
-				</div>
-			</template>
-			<div class="flex flex-col gap-2 px-2 pt-2">
-				<ButtonStyled v-if="accounts.length > 0" class="w-full">
-					<button :disabled="loginDisabled" @click="login()">
-						<PlusIcon />
-						{{ formatMessage(messages.addAccount) }}
-					</button>
-				</ButtonStyled>
-			</div>
+		<Avatar
+			size="36px"
+			:src="
+				selectedAccount ? avatarUrl : 'https://launcher-files.modrinth.com/assets/steve_head.png'
+			"
+		/>
+		<div class="flex flex-col w-full">
+			<span>{{ selectedAccount ? selectedAccount.profile.name : 'Select account' }}</span>
+			<span class="text-secondary text-xs">Minecraft account</span>
 		</div>
-	</Accordion>
+		<DropdownIcon class="w-5 h-5 shrink-0" />
+	</div>
+	<transition name="fade">
+		<Card
+			v-if="showCard || mode === 'isolated'"
+			ref="card"
+			class="account-card"
+			:class="{ expanded: mode === 'expanded', isolated: mode === 'isolated' }"
+		>
+			<div v-if="selectedAccount" class="selected account">
+				<Avatar size="xs" :src="avatarUrl" />
+				<div>
+					<h4>{{ selectedAccount.profile.name }}</h4>
+					<p>Selected</p>
+				</div>
+				<Button
+					v-tooltip="'Log out'"
+					icon-only
+					color="raised"
+					@click="logout(selectedAccount.profile.id)"
+				>
+					<TrashIcon />
+				</Button>
+			</div>
+			<div v-else class="logged-out account">
+				<h4>Not signed in</h4>
+				<Button
+					v-tooltip="'Log in'"
+					:disabled="loginDisabled"
+					icon-only
+					color="primary"
+					@click="login()"
+				>
+					<LogInIcon v-if="!loginDisabled" />
+					<SpinnerIcon v-else class="animate-spin" />
+				</Button>
+			</div>
+			<div v-if="displayAccounts.length > 0" class="account-group">
+				<div v-for="account in displayAccounts" :key="account.profile.id" class="account-row">
+					<Button class="option account" @click="setAccount(account)">
+						<Avatar :src="getAccountAvatarUrl(account)" class="icon" />
+						<p>{{ account.profile.name }}</p>
+					</Button>
+					<Button v-tooltip="'Log out'" icon-only @click="logout(account.profile.id)">
+						<TrashIcon />
+					</Button>
+				</div>
+			</div>
+			<Button v-if="accounts.length > 0" @click="login()">
+				<PlusIcon />
+				Add account
+			</Button>
+		</Card>
+	</transition>
 </template>

-<script setup lang="ts">
-import {
-	LogInIcon,
-	PlusIcon,
-	RadioButtonCheckedIcon,
-	RadioButtonIcon,
-	SpinnerIcon,
-	TrashIcon,
-} from '@modrinth/assets'
-import {
-	Accordion,
-	Avatar,
-	ButtonStyled,
-	defineMessages,
-	injectNotificationManager,
-	useVIntl,
-} from '@modrinth/ui'
-import type { Ref } from 'vue'
-import { computed, onUnmounted, ref } from 'vue'
+<script setup>
+import { DropdownIcon, LogInIcon, PlusIcon, SpinnerIcon, TrashIcon } from '@modrinth/assets'
+import { Avatar, Button, Card, injectNotificationManager } from '@modrinth/ui'
+import { computed, onBeforeUnmount, onMounted, onUnmounted, ref } from 'vue'

 import { trackEvent } from '@/helpers/analytics'
 import {
@@ -113,47 +87,39 @@ import {
 } from '@/helpers/auth'
 import { process_listener } from '@/helpers/events'
 import { getPlayerHeadUrl } from '@/helpers/rendering/batch-skin-renderer.ts'
-import type { Skin } from '@/helpers/skins'
 import { get_available_skins } from '@/helpers/skins'
 import { handleSevereError } from '@/store/error.js'

-const { formatMessage } = useVIntl()
 const { handleError } = injectNotificationManager()

-const emit = defineEmits<{
-	change: []
-}>()
+defineProps({
+	mode: {
+		type: String,
+		required: true,
+		default: 'normal',
+	},
+})

-type MinecraftCredential = {
-	profile: {
-		id: string
-		name: string
-	}
-}
+const emit = defineEmits(['change'])

-const accounts: Ref<MinecraftCredential[]> = ref([])
+const accounts = ref({})
 const loginDisabled = ref(false)
-const defaultUser = ref<string | undefined>()
-const equippedSkin = ref<Skin | null>(null)
-const headUrlCache = ref(new Map<string, string>())
+const defaultUser = ref()
+const equippedSkin = ref(null)
+const headUrlCache = ref(new Map())

 async function refreshValues() {
 	defaultUser.value = await get_default_user().catch(handleError)
-	const userList = await users().catch(handleError)
-	accounts.value = Array.isArray(userList) ? [...userList] : []
-	accounts.value.sort((a, b) => (a.profile?.name ?? '').localeCompare(b.profile?.name ?? ''))
+	accounts.value = await users().catch(handleError)

 	try {
 		const skins = await get_available_skins()
-		equippedSkin.value = skins.find((skin) => skin.is_equipped) ?? null
+		equippedSkin.value = skins.find((skin) => skin.is_equipped)

 		if (equippedSkin.value) {
 			try {
 				const headUrl = await getPlayerHeadUrl(equippedSkin.value)
-				headUrlCache.value = new Map(headUrlCache.value).set(
-					equippedSkin.value.texture_key,
-					headUrl,
-				)
+				headUrlCache.value.set(equippedSkin.value.texture_key, headUrl)
 			} catch (error) {
 				console.warn('Failed to get head render for equipped skin:', error)
 			}
@@ -163,32 +129,19 @@ async function refreshValues() {
 	}
 }

-async function setEquippedSkin(skin: Skin) {
-	equippedSkin.value = skin
-
-	try {
-		const headUrl = await getPlayerHeadUrl(skin)
-		headUrlCache.value = new Map(headUrlCache.value).set(skin.texture_key, headUrl)
-	} catch (error) {
-		console.warn('Failed to get head render for equipped skin:', error)
-	}
-}
-
-function setLoginDisabled(value: boolean) {
+function setLoginDisabled(value) {
 	loginDisabled.value = value
 }

 defineExpose({
 	refreshValues,
-	setEquippedSkin,
 	setLoginDisabled,
 	loginDisabled,
 })
-
 await refreshValues()

-const selectedAccount = computed(() =>
-	accounts.value.find((account) => account.profile.id === defaultUser.value),
+const displayAccounts = computed(() =>
+	accounts.value.filter((account) => defaultUser.value !== account.profile.id),
 )

 const avatarUrl = computed(() => {
@@ -205,7 +158,7 @@ const avatarUrl = computed(() => {
 	return 'https://launcher-files.modrinth.com/assets/steve_head.png'
 })

-function getAccountAvatarUrl(account: MinecraftCredential) {
+function getAccountAvatarUrl(account) {
 	if (
 		account.profile.id === selectedAccount.value?.profile?.id &&
 		equippedSkin.value?.texture_key
@@ -218,10 +171,13 @@ function getAccountAvatarUrl(account: MinecraftCredential) {
 	return `https://mc-heads.net/avatar/${account.profile.id}/128`
 }

-async function setAccount(account: MinecraftCredential) {
+const selectedAccount = computed(() =>
+	accounts.value.find((account) => account.profile.id === defaultUser.value),
+)
+
+async function setAccount(account) {
 	defaultUser.value = account.profile.id
 	await set_default_user(account.profile.id).catch(handleError)
-	await refreshValues()
 	emit('change')
 }

@@ -231,57 +187,292 @@ async function login() {

 	if (loggedIn) {
 		await setAccount(loggedIn)
+		await refreshValues()
 	}

 	trackEvent('AccountLogIn')
 	loginDisabled.value = false
 }

-async function logout(id: string) {
+const logout = async (id) => {
 	await remove_user(id).catch(handleError)
 	await refreshValues()
 	if (!selectedAccount.value && accounts.value.length > 0) {
 		await setAccount(accounts.value[0])
+		await refreshValues()
 	} else {
 		emit('change')
 	}
 	trackEvent('AccountLogOut')
 }

+const showCard = ref(false)
+const card = ref(null)
+const button = ref(null)
+const handleClickOutside = (event) => {
+	const elements = document.elementsFromPoint(event.clientX, event.clientY)
+	if (
+		card.value &&
+		card.value.$el !== event.target &&
+		!elements.includes(card.value.$el) &&
+		!button.value.contains(event.target)
+	) {
+		toggleMenu(false)
+	}
+}
+
+function toggleMenu(override = true) {
+	if (showCard.value || !override) {
+		showCard.value = false
+	} else {
+		showCard.value = true
+	}
+}
+
 const unlisten = await process_listener(async (e) => {
 	if (e.event === 'launched') {
 		await refreshValues()
 	}
 })

+onMounted(() => {
+	window.addEventListener('click', handleClickOutside)
+})
+
+onBeforeUnmount(() => {
+	window.removeEventListener('click', handleClickOutside)
+})
+
 onUnmounted(() => {
 	unlisten()
 })
-
-const messages = defineMessages({
-	notSignedIn: {
-		id: 'minecraft-account.not-signed-in',
-		defaultMessage: 'Not signed in',
-	},
-	addAccount: {
-		id: 'minecraft-account.add-account',
-		defaultMessage: 'Add account',
-	},
-	removeAccount: {
-		id: 'minecraft-account.remove-account',
-		defaultMessage: 'Remove account',
-	},
-	selectAccount: {
-		id: 'minecraft-account.select-account',
-		defaultMessage: 'Select account',
-	},
-	minecraftAccount: {
-		id: 'minecraft-account.label',
-		defaultMessage: 'Minecraft account',
-	},
-	signInToMinecraft: {
-		id: 'minecraft-account.sign-in',
-		defaultMessage: 'Sign in to Minecraft',
-	},
-})
 </script>
+
+<style scoped lang="scss">
+.selected {
+	background: var(--color-brand-highlight);
+	border-radius: var(--radius-lg);
+	color: var(--color-contrast);
+	gap: 1rem;
+}
+
+.logged-out {
+	background: var(--color-bg);
+	border-radius: var(--radius-lg);
+	gap: 1rem;
+}
+
+.account {
+	width: max-content;
+	display: flex;
+	align-items: center;
+	text-align: left;
+	padding: 0.5rem 1rem;
+
+	h4,
+	p {
+		margin: 0;
+	}
+}
+
+.account-card {
+	position: fixed;
+	display: flex;
+	flex-direction: column;
+	margin-top: 0.5rem;
+	right: 2rem;
+	z-index: 11;
+	gap: 0.5rem;
+	padding: 1rem;
+	border: 1px solid var(--color-divider);
+	width: max-content;
+	user-select: none;
+	-ms-user-select: none;
+	-webkit-user-select: none;
+	max-height: calc(100vh - 300px);
+	overflow-y: auto;
+
+	&::-webkit-scrollbar-track {
+		border-top-right-radius: 1rem;
+		border-bottom-right-radius: 1rem;
+	}
+
+	&::-webkit-scrollbar {
+		border-top-right-radius: 1rem;
+		border-bottom-right-radius: 1rem;
+	}
+
+	&.hidden {
+		display: none;
+	}
+
+	&.expanded {
+		left: 13.5rem;
+	}
+
+	&.isolated {
+		position: relative;
+		left: 0;
+		top: 0;
+	}
+}
+
+.accounts-title {
+	font-size: 1.2rem;
+	font-weight: bolder;
+}
+
+.account-group {
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	gap: 0.5rem;
+}
+
+.option {
+	width: calc(100% - 2.25rem);
+	background: var(--color-raised-bg);
+	color: var(--color-base);
+	box-shadow: none;
+
+	img {
+		margin-right: 0.5rem;
+	}
+}
+
+.icon {
+	--size: 1.5rem !important;
+}
+
+.account-row {
+	display: flex;
+	flex-direction: row;
+	gap: 0.5rem;
+	vertical-align: center;
+	justify-content: space-between;
+	padding-right: 1rem;
+}
+
+.fade-enter-active,
+.fade-leave-active {
+	transition:
+		opacity 0.25s ease,
+		translate 0.25s ease,
+		scale 0.25s ease;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+	opacity: 0;
+	translate: 0 -2rem;
+	scale: 0.9;
+}
+
+.avatar-button {
+	display: flex;
+	align-items: center;
+	gap: 0.5rem;
+	color: var(--color-base);
+	background-color: var(--color-button-bg);
+	border-radius: var(--radius-md);
+	width: 100%;
+	padding: 0.5rem 0.75rem;
+	text-align: left;
+
+	&.expanded {
+		border: 1px solid var(--color-divider);
+		padding: 1rem;
+	}
+}
+
+.avatar-text {
+	margin: auto 0 auto 0.25rem;
+	display: flex;
+	flex-direction: column;
+}
+
+.text {
+	width: 6rem;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+.accounts-text {
+	display: flex;
+	align-items: center;
+	gap: 0.25rem;
+	margin: 0;
+}
+
+.qr-code {
+	background-color: white !important;
+	border-radius: var(--radius-md);
+}
+
+.modal-body {
+	display: flex;
+	flex-direction: row;
+	gap: var(--gap-lg);
+	align-items: center;
+	padding: var(--gap-xl);
+
+	.modal-text {
+		display: flex;
+		flex-direction: column;
+		gap: var(--gap-sm);
+		width: 100%;
+
+		h2,
+		p {
+			margin: 0;
+		}
+
+		.code-text {
+			display: flex;
+			flex-direction: row;
+			gap: var(--gap-xs);
+			align-items: center;
+
+			.code {
+				background-color: var(--color-bg);
+				border-radius: var(--radius-md);
+				border: solid 1px var(--color-button-bg);
+				font-family: var(--mono-font);
+				letter-spacing: var(--gap-md);
+				color: var(--color-contrast);
+				font-size: 2rem;
+				font-weight: bold;
+				padding: var(--gap-sm) 0 var(--gap-sm) var(--gap-md);
+			}
+
+			.btn {
+				width: 2.5rem;
+				height: 2.5rem;
+			}
+		}
+	}
+}
+
+.button-row {
+	display: flex;
+	flex-direction: row;
+}
+
+.modal {
+	position: absolute;
+}
+
+.code {
+	color: var(--color-brand);
+	padding: 0.05rem 0.1rem;
+	// row not column
+	display: flex;
+
+	.card {
+		background: var(--color-base);
+		color: var(--color-contrast);
+		padding: 0.5rem 1rem;
+	}
+}
+</style>
@@ -4,7 +4,7 @@ import { ButtonStyled, injectNotificationManager, OverflowMenu } from '@modrinth
 import { open } from '@tauri-apps/plugin-dialog'
 import { useRouter } from 'vue-router'

-import { add_project_from_path } from '@/helpers/instance'
+import { add_project_from_path } from '@/helpers/profile.js'

 const { handleError } = injectNotificationManager()

@@ -22,14 +22,14 @@ const handleAddContentFromFile = async () => {
 	if (!newProject) return

 	for (const project of newProject) {
-		await add_project_from_path(props.instance.id, project.path ?? project).catch(handleError)
+		await add_project_from_path(props.instance.path, project.path ?? project).catch(handleError)
 	}
 }

 const handleSearchContent = async () => {
 	await router.push({
 		path: `/browse/${props.instance.loader === 'vanilla' ? 'resourcepack' : 'mod'}`,
-		query: { i: props.instance.id },
+		query: { i: props.instance.path },
 	})
 }
 </script>
@@ -1,506 +0,0 @@
-<template>
-	<div class="flex gap-2 items-center">
-		<ButtonStyled
-			v-if="hasActiveLoadingBars && !hasVisibleActiveDownloadToasts"
-			color="brand"
-			type="transparent"
-			circular
-		>
-			<button v-tooltip="formatMessage(messages.viewActiveDownloads)" @click="openDownloadToast()">
-				<DownloadIcon />
-			</button>
-		</ButtonStyled>
-		<div v-if="offline" class="flex items-center gap-1">
-			<UnplugIcon class="text-secondary" />
-			<span class="text-sm text-contrast"> {{ formatMessage(messages.offline) }} </span>
-		</div>
-		<AppUpdateButton />
-		<div
-			class="flex border-solid border-surface-5 text-sm items-center gap-2 py-1.5 px-3 rounded-xl border"
-		>
-			<template v-if="selectedProcess">
-				<OnlineIndicatorIcon />
-				<div class="text-contrast flex items-center gap-2">
-					<router-link
-						v-tooltip="formatMessage(messages.viewInstance)"
-						:to="`/instance/${encodeURIComponent(selectedProcess.instance.id)}`"
-						class="hover:underline"
-					>
-						{{ selectedProcess.instance.name }}
-					</router-link>
-					<Dropdown
-						v-if="currentProcesses.length > 1"
-						placement="bottom"
-						:triggers="['click']"
-						:hide-triggers="['click']"
-						@show="showInstances = true"
-						@hide="showInstances = false"
-					>
-						<ButtonStyled type="transparent" circular size="small">
-							<button
-								v-tooltip="
-									showInstances
-										? formatMessage(messages.hideMoreRunningInstances)
-										: formatMessage(messages.showMoreRunningInstances)
-								"
-							>
-								<DropdownIcon :class="{ 'rotate-180': !!showInstances }" />
-							</button>
-						</ButtonStyled>
-						<template #popper>
-							<div class="flex w-[20rem] max-h-[24rem] flex-col gap-2 overflow-auto">
-								<div
-									v-for="process in currentProcesses"
-									:key="process.uuid"
-									class="flex w-full items-center gap-2 rounded-xl bg-surface-4 p-2 text-sm"
-								>
-									<button
-										v-tooltip.left="
-											process.uuid === selectedProcess.uuid
-												? formatMessage(messages.primaryInstance)
-												: formatMessage(messages.makePrimaryInstance)
-										"
-										class="flex flex-grow items-center gap-2"
-										:class="{
-											'active:scale-95 transition-transform': process.uuid !== selectedProcess.uuid,
-										}"
-										:disabled="process.uuid === selectedProcess.uuid"
-										@click="selectProcess(process)"
-									>
-										<OnlineIndicatorIcon />
-										<span class="mr-auto text-contrast flex items-center gap-2">
-											{{ process.instance.name }}
-											<StarIcon v-if="process.uuid === selectedProcess.uuid" class="text-orange" />
-										</span>
-									</button>
-									<button
-										v-tooltip="formatMessage(messages.stopInstance)"
-										class="active:scale-95 flex"
-										@click.stop="stop(process)"
-									>
-										<StopCircleIcon class="text-red size-5" />
-									</button>
-									<button
-										v-tooltip="formatMessage(messages.viewLogs)"
-										class="active:scale-95 flex"
-										@click.stop="goToTerminal(process.instance.id)"
-									>
-										<TerminalSquareIcon class="text-secondary size-5" />
-									</button>
-								</div>
-							</div>
-						</template>
-					</Dropdown>
-				</div>
-				<button
-					v-tooltip="formatMessage(messages.stopInstance)"
-					class="active:scale-95 flex"
-					@click="stop(selectedProcess)"
-				>
-					<StopCircleIcon class="text-red size-5" />
-				</button>
-				<button
-					v-tooltip="formatMessage(messages.viewLogs)"
-					class="active:scale-95 flex"
-					@click="goToTerminal()"
-				>
-					<TerminalSquareIcon class="text-secondary size-5" />
-				</button>
-			</template>
-			<template v-else>
-				<span class="size-2 rounded-full bg-secondary" />
-				<span class="text-secondary"> {{ formatMessage(messages.noInstancesRunning) }} </span>
-			</template>
-		</div>
-	</div>
-</template>
-
-<script setup lang="ts">
-import {
-	DownloadIcon,
-	DropdownIcon,
-	OnlineIndicatorIcon,
-	StarIcon,
-	StopCircleIcon,
-	TerminalSquareIcon,
-	UnplugIcon,
-} from '@modrinth/assets'
-import {
-	ButtonStyled,
-	defineMessages,
-	injectNotificationManager,
-	injectPopupNotificationManager,
-	type PopupNotification,
-	type PopupNotificationProgressItem,
-	useVIntl,
-} from '@modrinth/ui'
-import { convertFileSrc } from '@tauri-apps/api/core'
-import { Dropdown } from 'floating-vue'
-import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
-import { useRouter } from 'vue-router'
-
-import AppUpdateButton from '@/components/ui/app-update-button/index.vue'
-import { useInstallJobNotifications } from '@/composables/browse/install-job-notifications'
-import { trackEvent } from '@/helpers/analytics'
-import { loading_listener, process_listener } from '@/helpers/events'
-import { get_many as getInstances } from '@/helpers/instance'
-import { get_all as getRunningProcesses, kill as killProcess } from '@/helpers/process'
-import type { LoadingBar } from '@/helpers/state'
-import { progress_bars_list } from '@/helpers/state'
-import type { GameInstance } from '@/helpers/types'
-
-const { handleError } = injectNotificationManager()
-const popupNotificationManager = injectPopupNotificationManager()
-const { formatMessage } = useVIntl()
-
-const router = useRouter()
-
-const showInstances = ref(false)
-
-interface RunningProcess {
-	uuid: string
-	instance_id: string
-	instance: GameInstance
-}
-
-const messages = defineMessages({
-	offline: {
-		id: 'app.action-bar.offline',
-		defaultMessage: 'Offline',
-	},
-	viewInstance: {
-		id: 'app.action-bar.view-instance',
-		defaultMessage: 'View instance',
-	},
-	showMoreRunningInstances: {
-		id: 'app.action-bar.show-more-running-instances',
-		defaultMessage: 'Show more running instances',
-	},
-	hideMoreRunningInstances: {
-		id: 'app.action-bar.hide-more-running-instances',
-		defaultMessage: 'Hide more running instances',
-	},
-	primaryInstance: {
-		id: 'app.action-bar.primary-instance',
-		defaultMessage: 'Primary instance',
-	},
-	makePrimaryInstance: {
-		id: 'app.action-bar.make-primary-instance',
-		defaultMessage: 'Make primary instance',
-	},
-	stopInstance: {
-		id: 'app.action-bar.stop-instance',
-		defaultMessage: 'Stop instance',
-	},
-	viewLogs: {
-		id: 'app.action-bar.view-logs',
-		defaultMessage: 'View logs',
-	},
-	noInstancesRunning: {
-		id: 'app.action-bar.no-instances-running',
-		defaultMessage: 'No instances running',
-	},
-	downloadingJava: {
-		id: 'app.action-bar.downloading-java',
-		defaultMessage: 'Downloading Java {version}',
-	},
-	downloads: {
-		id: 'app.action-bar.downloads',
-		defaultMessage: 'Downloads',
-	},
-	viewActiveDownloads: {
-		id: 'app.action-bar.view-active-downloads',
-		defaultMessage: 'View active downloads',
-	},
-})
-
-const currentProcesses = ref<RunningProcess[]>([])
-const selectedProcess = ref<RunningProcess | undefined>()
-
-const refresh = async () => {
-	const processes = ((await getRunningProcesses().catch((error) => {
-		handleError(error)
-		return []
-	})) ?? []) as Array<{ uuid: string; instance_id: string }>
-	const instanceIds = processes.map((process) => process.instance_id)
-	const instances: GameInstance[] = await getInstances(instanceIds).catch((error) => {
-		handleError(error)
-		return []
-	})
-
-	currentProcesses.value = processes
-		.map((process) => {
-			const instance = instances.find((item) => process.instance_id === item.id)
-			if (!instance) {
-				return null
-			}
-			return {
-				...process,
-				instance,
-			}
-		})
-		.filter((process): process is RunningProcess => process !== null)
-	if (!selectedProcess.value || !currentProcesses.value.includes(selectedProcess.value)) {
-		selectedProcess.value = currentProcesses.value[0]
-	}
-}
-
-await refresh()
-
-const offline = ref(!navigator.onLine)
-function handleOffline() {
-	offline.value = true
-}
-function handleOnline() {
-	offline.value = false
-}
-
-onMounted(() => {
-	window.addEventListener('offline', handleOffline)
-	window.addEventListener('online', handleOnline)
-})
-
-const unlistenProcess = await process_listener(async () => {
-	await refresh()
-})
-
-const stop = async (process: RunningProcess) => {
-	try {
-		await killProcess(process.uuid).catch(handleError)
-
-		trackEvent('InstanceStop', {
-			loader: process.instance.loader,
-			game_version: process.instance.game_version,
-			source: 'AppBar',
-		})
-	} catch (e) {
-		console.error(e)
-	}
-	await refresh()
-}
-
-function goToTerminal(instanceId?: string) {
-	const selectedInstanceId = instanceId ?? selectedProcess.value?.instance.id
-	if (!selectedInstanceId) {
-		return
-	}
-	router.push(`/instance/${encodeURIComponent(selectedInstanceId)}/logs`)
-}
-
-const currentLoadingBars = ref<LoadingBar[]>([])
-const currentLoadingBarIconUrls = ref<Record<string, string | null>>({})
-const notificationId = ref<string | number | null>(null)
-const dismissed = ref(false)
-
-function getLoadingBarKey(loadingBar: LoadingBar): string {
-	return `${loadingBar.loading_bar_uuid ?? loadingBar.id}`
-}
-
-function getLoadingProgress(loadingBar: LoadingBar): number {
-	if (!loadingBar.total || loadingBar.total <= 0) {
-		return 0
-	}
-	return Math.max(0, Math.min(1, (loadingBar.current ?? 0) / (loadingBar.total ?? 0)))
-}
-
-function getLoadingText(loadingBar: LoadingBar): string {
-	return loadingBar.message ?? ''
-}
-
-function getDisplayIconUrl(icon: string | null | undefined): string | null {
-	if (!icon) {
-		return null
-	}
-	if (/^(https?:|data:|blob:|asset:|tauri:)/.test(icon)) {
-		return icon
-	}
-	return convertFileSrc(icon)
-}
-
-function getNotification(): PopupNotification | null {
-	if (!notificationId.value) {
-		return null
-	}
-	const notification = popupNotificationManager
-		.getNotifications()
-		.find((notification) => notification.id === notificationId.value)
-	return notification ?? null
-}
-
-function removeNotification(): void {
-	if (!notificationId.value) {
-		return
-	}
-	popupNotificationManager.removeNotification(notificationId.value)
-	notificationId.value = null
-}
-
-function buildDownloadItems(): PopupNotificationProgressItem[] {
-	return [
-		...installJobNotifications.progressItems.value,
-		...currentLoadingBars.value.map((bar) => ({
-			id: getLoadingBarKey(bar),
-			title: bar.title ?? '',
-			text: getLoadingText(bar),
-			iconUrl: currentLoadingBarIconUrls.value[getLoadingBarKey(bar)] ?? null,
-			progress: getLoadingProgress(bar),
-			waiting: !bar.total || bar.total <= 0,
-			progressType: 'percentage',
-			progressCurrent: bar.current,
-			progressTotal: bar.total,
-		})),
-	]
-}
-
-const hasVisibleActiveDownloadToasts = computed(() => !!getNotification())
-const hasActiveLoadingBars = computed(
-	() => currentLoadingBars.value.length > 0 || installJobNotifications.active.value,
-)
-
-function updateNotification(resummon = false): void {
-	if (resummon) {
-		dismissed.value = false
-	}
-
-	if (currentLoadingBars.value.length === 0 && !installJobNotifications.active.value) {
-		removeNotification()
-		dismissed.value = false
-		return
-	}
-
-	if (notificationId.value && !getNotification()) {
-		notificationId.value = null
-		dismissed.value = true
-	}
-
-	if (dismissed.value && !resummon) {
-		return
-	}
-
-	let notif = getNotification()
-	const progressItems = buildDownloadItems()
-
-	if (notif) {
-		notif.title = installJobNotifications.active.value
-			? installJobNotifications.title.value
-			: formatMessage(messages.downloads)
-		notif.text = undefined
-		notif.progressItems = progressItems
-		notif.buttons = installJobNotifications.buttons.value
-		notif.progress = undefined
-		notif.waiting = undefined
-	} else {
-		notif = popupNotificationManager.addPopupNotification({
-			title: installJobNotifications.active.value
-				? installJobNotifications.title.value
-				: formatMessage(messages.downloads),
-			type: 'download',
-			autoCloseMs: null,
-			progressItems,
-			buttons: installJobNotifications.buttons.value,
-		})
-		notificationId.value = notif.id
-	}
-}
-
-function formatLoadingBars(loadingBar: LoadingBar): LoadingBar {
-	const formatted = { ...loadingBar }
-	if (formatted.bar_type?.type === 'java_download') {
-		formatted.title = formatMessage(messages.downloadingJava, {
-			version: formatted.bar_type.version,
-		})
-	}
-	if (formatted.bar_type?.instance_id) {
-		formatted.title = formatted.bar_type.instance_name ?? formatted.bar_type.instance_id
-	}
-	if (formatted.bar_type?.pack_name) {
-		formatted.title = formatted.bar_type.pack_name
-	}
-	return formatted
-}
-
-async function refreshLoadingBars() {
-	const bars: Record<string, LoadingBar> = await progress_bars_list().catch((error) => {
-		handleError(error)
-		return {}
-	})
-
-	currentLoadingBars.value = Object.values(bars)
-		.map(formatLoadingBars)
-		.filter(
-			(bar) =>
-				bar?.bar_type?.type !== 'launcher_update' &&
-				![
-					'java_download',
-					'pack_file_download',
-					'pack_download',
-					'minecraft_download',
-					'copy_instance',
-				].includes(bar?.bar_type?.type ?? ''),
-		)
-
-	const instanceIds = Array.from(
-		new Set(
-			currentLoadingBars.value
-				.map((bar) => bar.bar_type?.instance_id)
-				.filter((instanceId): instanceId is string => !!instanceId),
-		),
-	)
-	const instances = instanceIds.length
-		? await getInstances(instanceIds).catch((error) => {
-				handleError(error)
-				return []
-			})
-		: []
-	const instanceIconUrls = new Map(
-		instances.map((instance) => [instance.id, getDisplayIconUrl(instance.icon_path)]),
-	)
-	currentLoadingBarIconUrls.value = Object.fromEntries(
-		currentLoadingBars.value.map((bar) => {
-			const barIconUrl = getDisplayIconUrl(bar.bar_type?.icon)
-			const instanceIconUrl = bar.bar_type?.instance_id
-				? instanceIconUrls.get(bar.bar_type.instance_id)
-				: null
-			return [getLoadingBarKey(bar), barIconUrl ?? instanceIconUrl ?? null]
-		}),
-	)
-
-	currentLoadingBars.value.sort((a, b) => {
-		const aKey = `${a.loading_bar_uuid ?? a.id ?? ''}`
-		const bKey = `${b.loading_bar_uuid ?? b.id ?? ''}`
-		return aKey.localeCompare(bKey)
-	})
-
-	updateNotification()
-}
-
-const installJobNotifications = await useInstallJobNotifications({
-	router,
-	handleError,
-	onChange: updateNotification,
-})
-
-await refreshLoadingBars()
-
-const unlistenLoading = await loading_listener(async () => {
-	await refreshLoadingBars()
-})
-
-function openDownloadToast() {
-	updateNotification(true)
-}
-
-function selectProcess(process: RunningProcess) {
-	selectedProcess.value = process
-}
-
-onBeforeUnmount(() => {
-	removeNotification()
-	dismissed.value = false
-	window.removeEventListener('offline', handleOffline)
-	window.removeEventListener('online', handleOnline)
-	unlistenProcess()
-	unlistenLoading()
-	installJobNotifications.dispose()
-})
-</script>
@@ -2,8 +2,7 @@
 	<div
 		ref="outerRef"
 		data-tauri-drag-region
-		class="min-w-0 overflow-hidden pl-4"
-		:class="{ 'breadcrumb-fade-mask': isOverflowing }"
+		class="min-w-0 overflow-hidden pl-3"
 		:style="isOverflowing ? { '--scroll-distance': `-${overflowAmount}px` } : undefined"
 		@mouseenter="onMouseEnter"
 		@mouseleave="onMouseLeave"
@@ -11,48 +10,30 @@
 		<div
 			ref="innerRef"
 			data-tauri-drag-region
-			class="flex w-fit items-center gap-2 pr-4"
+			class="flex w-fit items-center gap-1"
 			:class="{ 'breadcrumbs-scroll': isAnimating }"
 			@animationiteration="onAnimationIteration"
 		>
-			<template v-for="(breadcrumb, index) in breadcrumbs" :key="breadcrumb.slot">
-				<component
-					:is="index < breadcrumbs.length - 1 && breadcrumb.to ? RouterLink : 'span'"
-					v-bind="index < breadcrumbs.length - 1 && breadcrumb.to ? { to: breadcrumb.to } : {}"
-					:data-tauri-drag-region="index === breadcrumbs.length - 1 ? '' : undefined"
-					class="flex shrink-0 items-center gap-1.5 whitespace-nowrap text-base font-medium leading-6"
-					:class="
-						index === breadcrumbs.length - 1
-							? 'cursor-default select-none text-contrast'
-							: 'text-primary hover:text-contrast'
-					"
-					:aria-current="index === breadcrumbs.length - 1 ? 'page' : undefined"
+			{{ breadcrumbData.resetToNames(breadcrumbs) }}
+			<template v-for="breadcrumb in breadcrumbs" :key="breadcrumb.name">
+				<router-link
+					v-if="breadcrumb.link"
+					:to="{
+						path: breadcrumb.link.replace('{id}', encodeURIComponent($route.params.id as string)),
+						query: breadcrumb.query,
+					}"
+					class="shrink-0 whitespace-nowrap text-primary"
 				>
-					<Avatar
-						v-if="breadcrumb.visual?.type === 'image'"
-						:src="breadcrumb.visual.src"
-						:alt="breadcrumb.visual.alt ?? breadcrumb.label"
-						:circle="breadcrumb.visual.circle"
-						:tint-by="breadcrumb.visual.tintBy ?? breadcrumb.id"
-						size="20px"
-						no-shadow
-						raised
-						class="inline-block shrink-0 align-middle"
-						:class="{ '!rounded-md': !breadcrumb.visual.circle }"
-					/>
-					<component
-						:is="breadcrumb.visual.component"
-						v-else-if="breadcrumb.visual?.type === 'icon'"
-						class="size-5 shrink-0 text-primary"
-						aria-hidden="true"
-					/>
-					<span>{{ breadcrumb.label }}</span>
-				</component>
-				<ChevronRightIcon
-					v-if="index < breadcrumbs.length - 1"
+					{{ resolveLabel(breadcrumb.name) }}
+				</router-link>
+				<span
+					v-else
 					data-tauri-drag-region
-					class="size-5 shrink-0 text-primary"
-				/>
+					class="shrink-0 whitespace-nowrap text-contrast font-semibold cursor-default select-none"
+				>
+					{{ resolveLabel(breadcrumb.name) }}
+				</span>
+				<ChevronRightIcon v-if="breadcrumb.link" data-tauri-drag-region class="w-5 h-5 shrink-0" />
 			</template>
 		</div>
 	</div>
@@ -60,13 +41,34 @@

 <script setup lang="ts">
 import { ChevronRightIcon } from '@modrinth/assets'
-import { Avatar } from '@modrinth/ui'
-import { onBeforeUnmount, onMounted, ref, watch } from 'vue'
-import { RouterLink } from 'vue-router'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import { useRoute } from 'vue-router'

-import { injectBreadcrumbManager } from '@/providers/breadcrumbs'
+import { useBreadcrumbs } from '@/store/breadcrumbs'

-const { entries: breadcrumbs } = injectBreadcrumbManager()
+interface Breadcrumb {
+	name: string
+	link?: string
+	query?: Record<string, string>
+}
+
+const route = useRoute()
+const breadcrumbData = useBreadcrumbs()
+
+const breadcrumbs = computed<Breadcrumb[]>(() => {
+	const additionalContext =
+		route.meta.useContext === true
+			? breadcrumbData.context
+			: route.meta.useRootContext === true
+				? breadcrumbData.rootContext
+				: null
+	const crumbs = (route.meta.breadcrumb ?? []) as Breadcrumb[]
+	return additionalContext ? [additionalContext as Breadcrumb, ...crumbs] : crumbs
+})
+
+function resolveLabel(name: string): string {
+	return name.charAt(0) === '?' ? breadcrumbData.getName(name.slice(1)) : name
+}

 // Overflow detection
 const outerRef = ref<HTMLDivElement | null>(null)
@@ -80,13 +82,9 @@ let stopping = false

 function checkOverflow() {
 	if (!outerRef.value || !innerRef.value) return
-	const outerStyles = window.getComputedStyle(outerRef.value)
-	const horizontalPadding =
-		Number.parseFloat(outerStyles.paddingLeft) + Number.parseFloat(outerStyles.paddingRight)
-	const availableWidth = outerRef.value.clientWidth - horizontalPadding
-	const overflow = innerRef.value.scrollWidth - availableWidth
+	const overflow = innerRef.value.scrollWidth - outerRef.value.clientWidth
 	isOverflowing.value = overflow > 0
-	overflowAmount.value = overflow
+	overflowAmount.value = overflow + 12
 }

 function onMouseEnter() {
@@ -130,16 +128,6 @@ watch(breadcrumbs, () => {
 </script>

 <style scoped>
-.breadcrumb-fade-mask {
-	mask-image: linear-gradient(
-		to right,
-		transparent,
-		black 12px,
-		black calc(100% - 12px),
-		transparent
-	);
-}
-
 .breadcrumbs-scroll {
 	animation: breadcrumb-scroll 10s ease-in-out infinite;
 }
@@ -12,7 +12,7 @@
 			<div v-for="(option, index) in options" :key="index" @click.stop="optionClicked(option.name)">
 				<hr v-if="option.type === 'divider'" class="divider" />
 				<div
-					v-else-if="!(isInstanceLink(item) && option.name === `add_content`)"
+					v-else-if="!(isLinkedData(item) && option.name === `add_content`)"
 					class="item clickable"
 					:class="[option.color ?? 'base']"
 				>
@@ -64,10 +64,10 @@ defineExpose({
 	},
 })

-const isInstanceLink = (item) => {
-	if (item.instance != undefined && item.instance.link) {
+const isLinkedData = (item) => {
+	if (item.instance != undefined && item.instance.linked_data) {
 		return true
-	} else if (item != undefined && item.link) {
+	} else if (item != undefined && item.linked_data) {
 		return true
 	}
 	return false
@@ -6,7 +6,6 @@ import {
 	HammerIcon,
 	LogInIcon,
 	UpdatedIcon,
-	WrenchIcon,
 	XIcon,
 } from '@modrinth/assets'
 import { ButtonStyled, Collapsible, injectNotificationManager } from '@modrinth/ui'
@@ -16,7 +15,7 @@ import { ChatIcon } from '@/assets/icons'
 import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
 import { trackEvent } from '@/helpers/analytics'
 import { login as login_flow, set_default_user } from '@/helpers/auth.js'
-import { install_existing_instance } from '@/helpers/install'
+import { install } from '@/helpers/profile.js'
 import { cancel_directory_change } from '@/helpers/settings.ts'
 import { handleSevereError } from '@/store/error.js'

@@ -52,12 +51,16 @@ defineExpose({
 			if (errorVal.message.includes('because the target machine actively refused it')) {
 				metadata.value.hostsFile = true
 			}
+		} else if (errorVal.message && errorVal.message.includes('User is not logged in')) {
+			title.value = 'Sign in to Minecraft'
+			errorType.value = 'minecraft_sign_in'
+			supportLink.value = 'https://support.modrinth.com'
 		} else if (errorVal.message && errorVal.message.includes('Move directory error:')) {
 			title.value = 'Could not change app directory'
 			errorType.value = 'directory_move'
 			supportLink.value = 'https://support.modrinth.com'

-			if (errorVal.message.includes('directory is not writable')) {
+			if (errorVal.message.includes('directory is not writeable')) {
 				metadata.value.readOnly = true
 			}

@@ -68,7 +71,7 @@ defineExpose({
 			title.value = 'No loader selected'
 			errorType.value = 'no_loader_version'
 			supportLink.value = 'https://support.modrinth.com'
-			metadata.value.instanceId = context.instanceId
+			metadata.value.profilePath = context.profilePath
 		} else if (source === 'state_init') {
 			title.value = 'Error initializing Modrinth App'
 			errorType.value = 'state_init'
@@ -121,7 +124,7 @@ const loadingRepair = ref(false)
 async function repairInstance() {
 	loadingRepair.value = true
 	try {
-		await install_existing_instance(metadata.value.instanceId, false)
+		await install(metadata.value.profilePath, false)
 		errorModal.value.hide()
 	} catch (err) {
 		handleSevereError(err)
@@ -152,7 +155,7 @@ async function copyToClipboard(text) {

 <template>
 	<ModalWrapper ref="errorModal" :header="title" :closable="closable">
-		<div class="modal-body max-w-[550px]">
+		<div class="modal-body">
 			<div class="markdown-body">
 				<template v-if="errorType === 'minecraft_auth'">
 					<template v-if="metadata.network">
@@ -239,6 +242,20 @@ async function copyToClipboard(text) {
 						</button>
 					</div>
 				</template>
+				<div v-else-if="errorType === 'minecraft_sign_in'">
+					<p>
+						To play this instance, you must sign in through Microsoft below. If you don't have a
+						Minecraft account, you can purchase the game on the
+						<a href="https://www.minecraft.net/en-us/store/minecraft-java-bedrock-edition-pc"
+							>Minecraft website</a
+						>.
+					</p>
+					<div class="cta-button">
+						<button class="btn btn-primary" :disabled="loadingMinecraft" @click="loginMinecraft">
+							<LogInIcon /> Sign in to Minecraft
+						</button>
+					</div>
+				</div>
 				<template v-else-if="errorType === 'state_init'">
 					<p>
 						Modrinth App failed to load correctly. This may be because of a corrupted file, or
@@ -263,7 +280,7 @@ async function copyToClipboard(text) {
 					{{ debugInfo }}
 				</template>
 				<template v-if="hasDebugInfo">
-					<div class="w-full h-[1px] bg-surface-5 mb-3"></div>
+					<hr />
 					<p>
 						If nothing is working and you need help, visit
 						<a :href="supportLink">our support page</a>
@@ -279,47 +296,28 @@ async function copyToClipboard(text) {
 				<ButtonStyled v-if="closable">
 					<button @click="errorModal.hide()"><XIcon /> Close</button>
 				</ButtonStyled>
+				<ButtonStyled v-if="hasDebugInfo">
+					<button :disabled="copied" @click="copyToClipboard(debugInfo)">
+						<template v-if="copied"> <CheckIcon class="text-green" /> Copied! </template>
+						<template v-else> <CopyIcon /> Copy debug info </template>
+					</button>
+				</ButtonStyled>
 			</div>
 			<template v-if="hasDebugInfo">
-				<div class="flex flex-col gap-2">
-					<div class="w-full h-[1px] bg-surface-5"></div>
-
-					<div class="overflow-clip">
-						<button
-							class="flex items-center justify-between w-full bg-transparent border-0 py-4 cursor-pointer"
-							@click="errorCollapsed = !errorCollapsed"
-						>
-							<span class="flex items-center gap-2 text-contrast font-extrabold m-0">
-								<WrenchIcon class="h-4 w-4" />
-								Debug information
-							</span>
-							<DropdownIcon
-								class="h-5 w-5 text-secondary transition-transform"
-								:class="{ 'rotate-180': !errorCollapsed }"
-							/>
-						</button>
-						<Collapsible :collapsed="errorCollapsed">
-							<div
-								class="p-3 bg-surface-2 rounded-2xl text-xs grid grid-cols-[1fr_auto] max-w-full items-start"
-							>
-								<div
-									class="m-0 p-0 rounded-none bg-transparent text-sm font-mono break-words overflow-auto"
-								>
-									{{ debugInfo }}
-								</div>
-								<ButtonStyled circular>
-									<button
-										v-tooltip="'Copy debug info'"
-										:disabled="copied"
-										@click="copyToClipboard(debugInfo)"
-									>
-										<template v-if="copied"> <CheckIcon class="text-green" /> </template>
-										<template v-else> <CopyIcon /> </template>
-									</button>
-								</ButtonStyled>
-							</div>
-						</Collapsible>
-					</div>
+				<div class="bg-button-bg rounded-xl mt-2 overflow-clip">
+					<button
+						class="flex items-center justify-between w-full bg-transparent border-0 px-4 py-3 cursor-pointer"
+						@click="errorCollapsed = !errorCollapsed"
+					>
+						<span class="text-contrast font-extrabold m-0">Debug information:</span>
+						<DropdownIcon
+							class="h-5 w-5 text-secondary transition-transform"
+							:class="{ 'rotate-180': !errorCollapsed }"
+						/>
+					</button>
+					<Collapsible :collapsed="errorCollapsed">
+						<pre class="m-0 px-4 py-3 bg-bg rounded-none">{{ debugInfo }}</pre>
+					</Collapsible>
 				</div>
 			</template>
 		</div>
@@ -1,32 +1,27 @@
 <script setup>
-import { XIcon } from '@modrinth/assets'
+import { PlusIcon, XIcon } from '@modrinth/assets'
 import {
-	ButtonStyled,
+	Button,
+	Checkbox,
 	commonMessages,
 	defineMessages,
-	FileTreeSelect,
 	injectNotificationManager,
-	NewModal,
 	StyledInput,
 	useVIntl,
 } from '@modrinth/ui'
-import { save } from '@tauri-apps/plugin-dialog'
-import { readDir, stat } from '@tauri-apps/plugin-fs'
+import { open } from '@tauri-apps/plugin-dialog'
 import { ref } from 'vue'

-import { PackageIcon } from '@/assets/icons'
-import {
-	export_instance_mrpack,
-	get_full_path,
-	get_pack_export_candidates,
-} from '@/helpers/instance'
+import { PackageIcon, VersionIcon } from '@/assets/icons'
+import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
+import { export_profile_mrpack, get_pack_export_candidates } from '@/helpers/profile.js'

 const { handleError } = injectNotificationManager()
 const { formatMessage } = useVIntl()

 const messages = defineMessages({
 	header: { id: 'app.export-modal.header', defaultMessage: 'Export modpack' },
-	modpackNameLabel: { id: 'app.export-modal.modpack-name-label', defaultMessage: 'Modpack name' },
+	modpackNameLabel: { id: 'app.export-modal.modpack-name-label', defaultMessage: 'Modpack Name' },
 	modpackNamePlaceholder: {
 		id: 'app.export-modal.modpack-name-placeholder',
 		defaultMessage: 'Modpack name',
@@ -43,6 +38,10 @@ const messages = defineMessages({
 		id: 'app.export-modal.description-placeholder',
 		defaultMessage: 'Enter modpack description...',
 	},
+	selectFilesLabel: {
+		id: 'app.export-modal.select-files-label',
+		defaultMessage: 'Select files and folders to include in pack',
+	},
 	exportButton: { id: 'app.export-modal.export-button', defaultMessage: 'Export' },
 })

@@ -55,9 +54,8 @@ const props = defineProps({

 defineExpose({
 	show: () => {
-		resetExportState()
 		exportModal.value.show()
-		void initFiles().catch(handleError)
+		initFiles()
 	},
 })

@@ -66,48 +64,73 @@ const nameInput = ref(props.instance.name)
 const exportDescription = ref('')
 const versionInput = ref('1.0.0')
 const files = ref([])
-const selectedFilePaths = ref([])
-const fileTreeKey = ref(0)
-const filesLoadId = ref(0)
-const instanceRoot = ref('')
-const loadedDirectories = ref(new Set())
+const folders = ref([])
+const showingFiles = ref(false)

-async function initFiles() {
-	const loadId = ++filesLoadId.value
-	const [filePaths, root] = await Promise.all([
-		get_pack_export_candidates(props.instance.id),
-		get_full_path(props.instance.id),
-	])
-	if (loadId !== filesLoadId.value) return
-
-	instanceRoot.value = root
-	const exportCandidates = await Promise.all(
-		filePaths.map((path) => buildExportCandidateItem(root, path)),
+const initFiles = async () => {
+	const newFolders = new Map()
+	const sep = '/'
+	files.value = []
+	await get_pack_export_candidates(props.instance.path).then((filePaths) =>
+		filePaths
+			.map((folder) => ({
+				path: folder,
+				name: folder.split(sep).pop(),
+				selected:
+					folder.startsWith('mods') ||
+					folder.startsWith('datapacks') ||
+					folder.startsWith('resourcepacks') ||
+					folder.startsWith('shaderpacks') ||
+					folder.startsWith('config'),
+				disabled:
+					folder === 'profile.json' ||
+					folder.startsWith('modrinth_logs') ||
+					folder.startsWith('.fabric'),
+			}))
+			.filter((pathData) => !pathData.path.includes('.DS_Store'))
+			.forEach((pathData) => {
+				const parent = pathData.path.split(sep).slice(0, -1).join(sep)
+				if (parent !== '') {
+					if (newFolders.has(parent)) {
+						newFolders.get(parent).push(pathData)
+					} else {
+						newFolders.set(parent, [pathData])
+					}
+				} else {
+					files.value.push(pathData)
+				}
+			}),
 	)
-	if (loadId !== filesLoadId.value) return
-
-	files.value = exportCandidates
-	selectedFilePaths.value = files.value
-		.filter((file) => !file.disabled && isDefaultSelectedExportCandidate(file.path))
-		.map((file) => file.path)
+	folders.value = [...newFolders.entries()].map(([name, value]) => [
+		{
+			name,
+			showingMore: false,
+		},
+		value,
+	])
 }

+await initFiles()
+
 const exportPack = async () => {
-	const outputPath = await save({
-		defaultPath: `${nameInput.value} ${versionInput.value}.mrpack`,
-		filters: [
-			{
-				name: 'Modrinth Modpack',
-				extensions: ['mrpack'],
-			},
-		],
+	const filesToExport = files.value.filter((file) => file.selected).map((file) => file.path)
+	folders.value.forEach((args) => {
+		args[1].forEach((child) => {
+			if (child.selected) {
+				filesToExport.push(child.path)
+			}
+		})
+	})
+	const outputPath = await open({
+		directory: true,
+		multiple: false,
 	})

 	if (outputPath) {
-		export_instance_mrpack(
-			props.instance.id,
-			outputPath,
-			selectedFilePaths.value,
+		export_profile_mrpack(
+			props.instance.path,
+			outputPath + `/${nameInput.value} ${versionInput.value}.mrpack`,
+			filesToExport,
 			versionInput.value,
 			exportDescription.value,
 			nameInput.value,
@@ -115,190 +138,192 @@ const exportPack = async () => {
 		exportModal.value.hide()
 	}
 }
-
-function resetExportState() {
-	nameInput.value = props.instance.name
-	exportDescription.value = ''
-	versionInput.value = '1.0.0'
-	files.value = []
-	selectedFilePaths.value = []
-	fileTreeKey.value += 1
-	instanceRoot.value = ''
-	loadedDirectories.value = new Set()
-}
-
-async function loadExportDirectory(path) {
-	if (!path || !instanceRoot.value || loadedDirectories.value.has(path)) return
-
-	const loadId = filesLoadId.value
-	loadedDirectories.value.add(path)
-
-	try {
-		const entries = await readDir(`${instanceRoot.value}/${path}`)
-		const childItems = await Promise.all(
-			entries.map((entry) => buildExportDirectoryChildItem(instanceRoot.value, path, entry)),
-		)
-		if (loadId !== filesLoadId.value) return
-
-		appendExportItems(childItems)
-	} catch {
-		loadedDirectories.value.delete(path)
-	}
-}
-
-async function buildExportCandidateItem(instanceRoot, path) {
-	try {
-		const entries = await readDir(`${instanceRoot}/${path}`)
-		const metadata = await getExportCandidateMetadata(instanceRoot, path)
-		return {
-			path,
-			type: 'directory',
-			disabled: isExportCandidateDisabled(path),
-			modified: metadata.modified,
-			count: entries.length,
-		}
-	} catch {
-		return buildExportFileItem(instanceRoot, path)
-	}
-}
-
-async function buildExportDirectoryChildItem(instanceRoot, parentPath, entry) {
-	const path = `${parentPath}/${entry.name}`
-	if (entry.isDirectory) {
-		const metadata = await getExportCandidateMetadata(instanceRoot, path)
-		return {
-			path,
-			type: 'directory',
-			disabled: isExportCandidateDisabled(path),
-			modified: metadata.modified,
-		}
-	}
-
-	return buildExportFileItem(instanceRoot, path)
-}
-
-async function buildExportFileItem(instanceRoot, path) {
-	const metadata = await getExportCandidateMetadata(instanceRoot, path)
-	return {
-		path,
-		type: 'file',
-		disabled: isExportCandidateDisabled(path),
-		size: metadata.size,
-		modified: metadata.modified,
-	}
-}
-
-function appendExportItems(items) {
-	const nextFiles = new Map(files.value.map((file) => [normalizeExportPath(file.path), file]))
-	for (const item of items) {
-		nextFiles.set(normalizeExportPath(item.path), item)
-	}
-	files.value = [...nextFiles.values()]
-}
-
-async function getExportCandidateMetadata(instanceRoot, path) {
-	try {
-		const metadata = await stat(`${instanceRoot}/${path}`)
-		return {
-			size: metadata.size,
-			modified: metadata.mtime ? Math.floor(metadata.mtime.getTime() / 1000) : undefined,
-		}
-	} catch {
-		return {}
-	}
-}
-
-function normalizeExportPath(path) {
-	return path.replaceAll('\\', '/').split('/').filter(Boolean).join('/')
-}
-
-function isDefaultSelectedExportCandidate(path) {
-	return (
-		path.startsWith('mods') ||
-		path.startsWith('datapacks') ||
-		path.startsWith('resourcepacks') ||
-		path.startsWith('shaderpacks') ||
-		path.startsWith('config')
-	)
-}
-
-function isExportCandidateDisabled(path) {
-	return (
-		path === 'profile.json' ||
-		path.startsWith('modrinth_logs') ||
-		path.startsWith('.fabric') ||
-		path.startsWith('__MACOSX')
-	)
-}
 </script>

 <template>
-	<NewModal
-		ref="exportModal"
-		:header="formatMessage(messages.header)"
-		scrollable
-		width="46rem"
-		max-width="calc(100vw - 2rem)"
-	>
-		<div class="flex flex-col gap-4">
-			<div class="grid grid-cols-2 gap-4">
-				<div class="labeled_input w-full">
-					<p class="text-contrast font-semibold">{{ formatMessage(messages.modpackNameLabel) }}</p>
-					<StyledInput
-						v-model="nameInput"
-						type="text"
-						:placeholder="formatMessage(messages.modpackNamePlaceholder)"
-						clearable
-						wrapper-class="w-full"
-					/>
-				</div>
-				<div class="labeled_input w-full">
-					<p class="text-contrast font-semibold">
-						{{ formatMessage(messages.versionNumberLabel) }}
-					</p>
-					<StyledInput
-						v-model="versionInput"
-						type="text"
-						:placeholder="formatMessage(messages.versionNumberPlaceholder)"
-						clearable
-						wrapper-class="w-full"
-					/>
-				</div>
-			</div>
-			<div class="flex flex-col gap-2 min-w-0">
-				<p class="m-0 text-contrast font-semibold">
-					{{ formatMessage(commonMessages.descriptionLabel) }}
-				</p>
+	<ModalWrapper ref="exportModal" :header="formatMessage(messages.header)">
+		<div class="modal-body">
+			<div class="labeled_input">
+				<p>{{ formatMessage(messages.modpackNameLabel) }}</p>
 				<StyledInput
-					v-model="exportDescription"
-					multiline
-					:placeholder="formatMessage(messages.descriptionPlaceholder)"
-					wrapper-class="w-full"
+					v-model="nameInput"
+					:icon="PackageIcon"
+					type="text"
+					:placeholder="formatMessage(messages.modpackNamePlaceholder)"
+					clearable
 				/>
 			</div>
-			<FileTreeSelect
-				:key="fileTreeKey"
-				v-model="selectedFilePaths"
-				class="min-w-0"
-				:items="files"
-				@navigate="loadExportDirectory"
-			/>
-		</div>
-		<template #actions>
-			<div class="flex items-center justify-end gap-2">
-				<ButtonStyled type="outlined">
-					<button @click="exportModal.hide">
-						<XIcon />
-						{{ formatMessage(commonMessages.cancelButton) }}
-					</button>
-				</ButtonStyled>
-				<ButtonStyled color="brand">
-					<button @click="exportPack">
-						<PackageIcon />
-						{{ formatMessage(messages.exportButton) }}
-					</button>
-				</ButtonStyled>
+			<div class="labeled_input">
+				<p>{{ formatMessage(messages.versionNumberLabel) }}</p>
+				<StyledInput
+					v-model="versionInput"
+					:icon="VersionIcon"
+					type="text"
+					:placeholder="formatMessage(messages.versionNumberPlaceholder)"
+					clearable
+				/>
 			</div>
-		</template>
-	</NewModal>
+			<div class="adjacent-input">
+				<div class="labeled_input">
+					<p>{{ formatMessage(commonMessages.descriptionLabel) }}</p>
+
+					<StyledInput
+						v-model="exportDescription"
+						multiline
+						:placeholder="formatMessage(messages.descriptionPlaceholder)"
+					/>
+				</div>
+			</div>
+
+			<div class="table">
+				<div class="table-head">
+					<div class="table-cell row-wise">
+						{{ formatMessage(messages.selectFilesLabel) }}
+						<Button
+							class="sleek-primary collapsed-button"
+							icon-only
+							@click="() => (showingFiles = !showingFiles)"
+						>
+							<PlusIcon v-if="!showingFiles" />
+							<XIcon v-else />
+						</Button>
+					</div>
+				</div>
+				<div v-if="showingFiles" class="table-content">
+					<div v-for="[path, children] in folders" :key="path.name" class="table-row">
+						<div class="table-cell file-entry">
+							<div class="file-primary">
+								<Checkbox
+									:model-value="children.every((child) => child.selected)"
+									:label="path.name"
+									class="select-checkbox"
+									:disabled="children.every((x) => x.disabled)"
+									@update:model-value="
+										(newValue) => children.forEach((child) => (child.selected = newValue))
+									"
+								/>
+								<Checkbox
+									v-model="path.showingMore"
+									class="select-checkbox dropdown"
+									collapsing-toggle-style
+								/>
+							</div>
+							<div v-if="path.showingMore" class="file-secondary">
+								<div v-for="child in children" :key="child.path" class="file-secondary-row">
+									<Checkbox
+										v-model="child.selected"
+										:label="child.name"
+										class="select-checkbox"
+										:disabled="child.disabled"
+									/>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div v-for="file in files" :key="file.path" class="table-row">
+						<div class="table-cell file-entry">
+							<div class="file-primary">
+								<Checkbox
+									v-model="file.selected"
+									:label="file.name"
+									:disabled="file.disabled"
+									class="select-checkbox"
+								/>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="button-row push-right">
+				<Button @click="exportModal.hide">
+					<XIcon />
+					{{ formatMessage(commonMessages.cancelButton) }}
+				</Button>
+				<Button color="primary" @click="exportPack">
+					<PackageIcon />
+					{{ formatMessage(messages.exportButton) }}
+				</Button>
+			</div>
+		</div>
+	</ModalWrapper>
 </template>
+
+<style scoped lang="scss">
+.modal-body {
+	display: flex;
+	flex-direction: column;
+	gap: var(--gap-md);
+}
+
+.labeled_input {
+	display: flex;
+	flex-direction: column;
+	gap: var(--gap-sm);
+
+	p {
+		margin: 0;
+	}
+}
+
+.select-checkbox {
+	gap: var(--gap-sm);
+
+	button.checkbox {
+		border: none;
+	}
+
+	&.dropdown {
+		margin-left: auto;
+	}
+}
+
+.table-content {
+	max-height: 18rem;
+	overflow-y: auto;
+}
+
+.table {
+	border: 1px solid var(--color-bg);
+}
+
+.file-entry {
+	display: flex;
+	flex-direction: column;
+	gap: var(--gap-sm);
+}
+
+.file-primary {
+	display: flex;
+	align-items: center;
+	gap: var(--gap-sm);
+}
+
+.file-secondary {
+	margin-left: var(--gap-xl);
+	display: flex;
+	flex-direction: column;
+	gap: var(--gap-sm);
+	height: 100%;
+	vertical-align: center;
+}
+
+.file-secondary-row {
+	display: flex;
+	align-items: center;
+	gap: var(--gap-sm);
+}
+
+.button-row {
+	display: flex;
+	gap: var(--gap-sm);
+	align-items: center;
+}
+
+.row-wise {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	align-items: center;
+	gap: 1rem;
+}
+</style>
@@ -15,10 +15,9 @@ import { useRouter } from 'vue-router'

 import { trackEvent } from '@/helpers/analytics'
 import { process_listener } from '@/helpers/events'
-import { install_existing_instance, install_pack_to_existing_instance } from '@/helpers/install'
-import { kill, run } from '@/helpers/instance'
-import { get_by_instance_id } from '@/helpers/process'
-import { showInstanceInFolder } from '@/helpers/utils.js'
+import { get_by_profile_path } from '@/helpers/process'
+import { finish_install, kill, run } from '@/helpers/profile'
+import { showProfileInFolder } from '@/helpers/utils.js'
 import { handleSevereError } from '@/store/error.js'

 const { handleError } = injectNotificationManager()
@@ -55,21 +54,20 @@ const installed = computed(() => props.instance.install_stage === 'installed')
 const router = useRouter()

 const seeInstance = async () => {
-	await router.push(`/instance/${encodeURIComponent(props.instance.id)}`)
+	await router.push(`/instance/${encodeURIComponent(props.instance.path)}`)
 }

 const checkProcess = async () => {
-	const runningProcesses = await get_by_instance_id(props.instance.id).catch(handleError)
+	const runningProcesses = await get_by_profile_path(props.instance.path).catch(handleError)

 	playing.value = runningProcesses.length > 0
 }

 const play = async (e, context) => {
 	e?.stopPropagation()
-	if (props.instance.quarantined) return
 	loading.value = true
-	await run(props.instance.id)
-		.catch((err) => handleSevereError(err, { instanceId: props.instance.id }))
+	await run(props.instance.path)
+		.catch((err) => handleSevereError(err, { profilePath: props.instance.path }))
 		.finally(() => {
 			trackEvent('InstanceStart', {
 				loader: props.instance.loader,
@@ -84,7 +82,7 @@ const stop = async (e, context) => {
 	e?.stopPropagation()
 	playing.value = false

-	await kill(props.instance.id).catch(handleError)
+	await kill(props.instance.path).catch(handleError)

 	trackEvent('InstanceStop', {
 		loader: props.instance.loader,
@@ -95,33 +93,18 @@ const stop = async (e, context) => {

 const repair = async (e) => {
 	e?.stopPropagation()
-	if (props.instance.quarantined) return

-	if (
-		props.instance.install_stage !== 'pack_installed' &&
-		(props.instance.link?.type === 'modrinth_modpack' ||
-			props.instance.link?.type === 'server_project_modpack')
-	) {
-		await install_pack_to_existing_instance(props.instance.id, {
-			type: 'fromVersionId',
-			project_id: props.instance.link.project_id ?? props.instance.link.server_project_id ?? '',
-			version_id: props.instance.link.version_id ?? props.instance.link.content_version_id ?? '',
-			title: props.instance.name,
-		}).catch(handleError)
-	} else {
-		await install_existing_instance(props.instance.id, false).catch(handleError)
-	}
+	await finish_install(props.instance).catch(handleError)
 }

 const openFolder = async () => {
-	await showInstanceInFolder(props.instance.id)
+	await showProfileInFolder(props.instance.path)
 }

 const addContent = async () => {
-	if (props.instance.quarantined) return
 	await router.push({
 		path: `/browse/${props.instance.loader === 'vanilla' ? 'datapack' : 'mod'}`,
-		query: { i: props.instance.id },
+		query: { i: props.instance.path },
 	})
 }

@@ -137,7 +120,7 @@ defineExpose({
 const currentEvent = ref(null)

 const unlisten = await process_listener((e) => {
-	if (e.instance_id === props.instance.id) {
+	if (e.profile_path_id === props.instance.path) {
 		currentEvent.value = e.event
 		if (e.event === 'finished') {
 			playing.value = false
@@ -145,9 +128,7 @@ const unlisten = await process_listener((e) => {
 	}
 })

-onMounted(() => {
-	checkProcess()
-})
+onMounted(() => checkProcess())
 onUnmounted(() => unlisten())
 </script>

@@ -161,7 +142,7 @@ onUnmounted(() => unlisten())
 			<Avatar
 				size="48px"
 				:src="instance.icon_path ? convertFileSrc(instance.icon_path) : null"
-				:tint-by="instance.id"
+				:tint-by="instance.path"
 				alt="Mod card"
 			/>
 			<div class="h-full flex items-center font-bold text-contrast leading-normal">
@@ -178,11 +159,7 @@ onUnmounted(() => unlisten())
 						<SpinnerIcon class="animate-spin" />
 					</button>
 				</ButtonStyled>
-				<ButtonStyled
-					v-else-if="!instance.quarantined"
-					:color="first ? 'brand' : 'standard'"
-					circular
-				>
+				<ButtonStyled v-else :color="first ? 'brand' : 'standard'" circular>
 					<button
 						v-tooltip="'Play'"
 						@click="(e) => play(e, 'InstanceCard')"
@@ -214,7 +191,7 @@ onUnmounted(() => unlisten())
 				<Avatar
 					size="48px"
 					:src="instance.icon_path ? convertFileSrc(instance.icon_path) : null"
-					:tint-by="instance.id"
+					:tint-by="instance.path"
 					alt="Mod card"
 					:class="`transition-all ${modLoading || installing ? `brightness-[0.25] scale-[0.85]` : `group-hover:brightness-75`}`"
 				/>
@@ -236,12 +213,7 @@ onUnmounted(() => unlisten())
 						class="animate-spin w-8 h-8"
 						tabindex="-1"
 					/>
-					<ButtonStyled
-						v-else-if="!installed && !instance.quarantined"
-						size="large"
-						color="brand"
-						circular
-					>
+					<ButtonStyled v-else-if="!installed" size="large" color="brand" circular>
 						<button
 							v-tooltip="'Repair'"
 							class="transition-all scale-75 group-hover:scale-100 group-focus-within:scale-100 origin-bottom opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 card-shadow"
@@ -250,7 +222,7 @@ onUnmounted(() => unlisten())
 							<DownloadIcon />
 						</button>
 					</ButtonStyled>
-					<ButtonStyled v-else-if="!instance.quarantined" size="large" color="brand" circular>
+					<ButtonStyled v-else size="large" color="brand" circular>
 						<button
 							v-tooltip="'Play'"
 							class="transition-all scale-75 group-hover:scale-100 group-focus-within:scale-100 origin-bottom opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 card-shadow"
@@ -2,7 +2,6 @@
 import { GameIcon, LeftArrowIcon } from '@modrinth/assets'
 import { Avatar, ButtonStyled, FormattedTag } from '@modrinth/ui'
 import { convertFileSrc } from '@tauri-apps/api/core'
-import { computed } from 'vue'

 type Instance = {
 	game_version: string
@@ -13,23 +12,18 @@ type Instance = {
 	name: string
 }

-const props = withDefaults(
-	defineProps<{
-		instance: Instance
-		backTab?: string
-	}>(),
-	{ backTab: undefined },
-)
-
-const instanceLink = computed(() => {
-	const base = `/instance/${encodeURIComponent(props.instance.id)}`
-	return props.backTab ? `${base}/${props.backTab}` : base
-})
+defineProps<{
+	instance: Instance
+}>()
 </script>

 <template>
 	<div class="flex justify-between items-center border-0 border-b border-solid border-divider pb-4">
-		<router-link :to="instanceLink" tabindex="-1" class="flex flex-col gap-4 text-primary">
+		<router-link
+			:to="`/instance/${encodeURIComponent(instance.path)}`"
+			tabindex="-1"
+			class="flex flex-col gap-4 text-primary"
+		>
 			<span class="flex items-center gap-2">
 				<Avatar
 					:src="instance.icon_path ? convertFileSrc(instance.icon_path) : undefined"
@@ -49,7 +43,9 @@ const instanceLink = computed(() => {
 			</span>
 		</router-link>
 		<ButtonStyled>
-			<router-link :to="instanceLink"> <LeftArrowIcon /> Back to instance </router-link>
+			<router-link :to="`/instance/${encodeURIComponent(instance.path)}`">
+				<LeftArrowIcon /> Back to instance
+			</router-link>
 		</ButtonStyled>
 	</div>
 </template>
@@ -1,119 +1,53 @@
 <template>
-	<ModalWrapper
-		ref="detectJavaModal"
-		:header="formatMessage(messages.title)"
-		:show-ad-on-close="false"
-	>
-		<div class="flex flex-col gap-4">
-			<Table :columns="javaInstallColumns" :data="chosenInstallOptions" row-key="path">
-				<template #cell-version="{ value }">
-					<span class="font-semibold text-primary">{{ value }}</span>
-				</template>
-				<template #cell-path="{ value }">
-					<span v-tooltip="value" class="block truncate font-mono text-xs">{{ value }}</span>
-				</template>
-				<template #cell-actions="{ row }">
-					<div class="flex items-center justify-end">
-						<ButtonStyled v-if="currentSelected.path === row.path">
-							<button class="!shadow-none" disabled>
-								<CheckIcon aria-hidden="true" />
-								{{ formatMessage(messages.selected) }}
-							</button>
-						</ButtonStyled>
-						<ButtonStyled v-else>
-							<button class="!shadow-none" @click="setJavaInstall(row)">
-								<PlusIcon aria-hidden="true" />
-								{{ formatMessage(messages.select) }}
-							</button>
-						</ButtonStyled>
+	<ModalWrapper ref="detectJavaModal" header="Select java version" :show-ad-on-close="false">
+		<div class="auto-detect-modal">
+			<div class="table">
+				<div class="table-row table-head">
+					<div class="table-cell table-text">Version</div>
+					<div class="table-cell table-text">Path</div>
+					<div class="table-cell table-text">Actions</div>
+				</div>
+				<div v-for="javaInstall in chosenInstallOptions" :key="javaInstall.path" class="table-row">
+					<div class="table-cell table-text">
+						<span>{{ javaInstall.version }}</span>
 					</div>
-				</template>
-				<template #empty-state>
-					<div class="p-4 text-secondary">
-						{{ formatMessage(messages.noInstallationsFound) }}
+					<div v-tooltip="javaInstall.path" class="table-cell table-text">
+						<span>{{ javaInstall.path }}</span>
 					</div>
-				</template>
-			</Table>
-			<div class="flex justify-end">
-				<ButtonStyled type="outlined">
-					<button
-						class="!shadow-none !border-surface-4 !border"
-						@click="$refs.detectJavaModal.hide()"
-					>
-						<XIcon aria-hidden="true" />
-						{{ formatMessage(messages.cancel) }}
-					</button>
-				</ButtonStyled>
+					<div class="table-cell table-text manage">
+						<Button v-if="currentSelected.path === javaInstall.path" disabled
+							><CheckIcon /> Selected</Button
+						>
+						<Button v-else @click="setJavaInstall(javaInstall)"><PlusIcon /> Select</Button>
+					</div>
+				</div>
+				<div v-if="chosenInstallOptions.length === 0" class="table-row entire-row">
+					<div class="table-cell table-text">No java installations found!</div>
+				</div>
+			</div>
+			<div class="input-group push-right">
+				<Button @click="$refs.detectJavaModal.hide()">
+					<XIcon />
+					Cancel
+				</Button>
 			</div>
 		</div>
 	</ModalWrapper>
 </template>
 <script setup>
 import { CheckIcon, PlusIcon, XIcon } from '@modrinth/assets'
-import {
-	ButtonStyled,
-	defineMessages,
-	injectNotificationManager,
-	Table,
-	useVIntl,
-} from '@modrinth/ui'
-import { computed, ref } from 'vue'
+import { Button, injectNotificationManager } from '@modrinth/ui'
+import { ref } from 'vue'

 import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
 import { trackEvent } from '@/helpers/analytics'
 import { find_filtered_jres } from '@/helpers/jre.js'

 const { handleError } = injectNotificationManager()
-const { formatMessage } = useVIntl()
-
-const messages = defineMessages({
-	title: {
-		id: 'app.java-detection.title',
-		defaultMessage: 'Select Java installation',
-	},
-	versionColumn: {
-		id: 'app.java-detection.columns.version',
-		defaultMessage: 'Version',
-	},
-	pathColumn: {
-		id: 'app.java-detection.columns.path',
-		defaultMessage: 'Path',
-	},
-	actionsColumn: {
-		id: 'app.java-detection.columns.actions',
-		defaultMessage: 'Actions',
-	},
-	selected: {
-		id: 'app.java-detection.selected',
-		defaultMessage: 'Selected',
-	},
-	select: {
-		id: 'app.java-detection.select',
-		defaultMessage: 'Select',
-	},
-	noInstallationsFound: {
-		id: 'app.java-detection.no-installations-found',
-		defaultMessage: 'No Java installations found.',
-	},
-	cancel: {
-		id: 'app.java-detection.cancel',
-		defaultMessage: 'Cancel',
-	},
-})

 const chosenInstallOptions = ref([])
 const detectJavaModal = ref(null)
 const currentSelected = ref({})
-const javaInstallColumns = computed(() => [
-	{ key: 'version', label: formatMessage(messages.versionColumn), width: '9rem' },
-	{ key: 'path', label: formatMessage(messages.pathColumn) },
-	{
-		key: 'actions',
-		label: formatMessage(messages.actionsColumn),
-		align: 'right',
-		width: '10rem',
-	},
-])

 defineExpose({
 	show: async (version, currentSelectedJava) => {
@@ -139,3 +73,25 @@ function setJavaInstall(javaInstall) {
 	})
 }
 </script>
+<style lang="scss" scoped>
+.auto-detect-modal {
+	.table {
+		.table-row {
+			grid-template-columns: 1fr 4fr min-content;
+		}
+
+		span {
+			display: inherit;
+			align-items: center;
+			justify-content: center;
+		}
+
+		padding: 0.5rem;
+	}
+}
+
+.manage {
+	display: flex;
+	gap: 0.5rem;
+}
+</style>
@@ -1,149 +1,75 @@
 <template>
 	<JavaDetectionModal ref="detectJavaModal" @submit="(val) => emit('update:modelValue', val)" />
-	<div :id="props.id" class="toggle-setting" :class="{ compact }">
-		<div class="input-with-status">
-			<StyledInput
-				autocomplete="off"
-				:disabled="props.disabled"
-				:model-value="props.modelValue ? props.modelValue.path : ''"
-				:placeholder="placeholder ?? formatMessage(messages.pathPlaceholder)"
-				wrapper-class="installation-input"
-				@update:model-value="
-					(val) => {
-						emit('update:modelValue', {
-							...props.modelValue,
-							path: val,
-						})
-					}
-				"
-			/>
-			<ButtonStyled
-				:color="
-					!hoveringTest && !testingJava
-						? testingJavaSuccess === true
-							? 'green'
-							: 'red'
-						: 'standard'
-				"
-				color-fill="text"
-			>
-				<button
-					:aria-label="formatMessage(messages.testJavaInstallation)"
-					class="!shadow-none"
-					:disabled="testingJava || props.disabled"
-					@click="runTest(props.modelValue?.path)"
-					@mouseenter="!props.disabled && (hoveringTest = true)"
-					@mouseleave="hoveringTest = false"
-				>
-					<SpinnerIcon v-if="testingJava" class="animate-spin h-4 w-4" />
-					<CheckCircleIcon
-						v-else-if="testingJavaSuccess === true && !hoveringTest"
-						class="h-4 w-4"
-					/>
-					<XCircleIcon v-else-if="testingJavaSuccess !== true && !hoveringTest" class="h-4 w-4" />
-					<RefreshCwIcon v-else-if="!props.disabled" class="h-4 w-4" />
-				</button>
-			</ButtonStyled>
-		</div>
+	<div class="toggle-setting" :class="{ compact }">
+		<StyledInput
+			autocomplete="off"
+			:disabled="props.disabled"
+			:model-value="props.modelValue ? props.modelValue.path : ''"
+			:placeholder="placeholder ?? '/path/to/java'"
+			wrapper-class="installation-input"
+			@update:model-value="
+				(val) => {
+					emit('update:modelValue', {
+						...props.modelValue,
+						path: val,
+					})
+				}
+			"
+		/>
 		<span class="installation-buttons">
-			<ButtonStyled v-if="props.version">
-				<button
-					v-tooltip="
-						testingJavaSuccess === true ? formatMessage(messages.alreadyInstalled) : undefined
-					"
-					class="!shadow-none"
-					:disabled="props.disabled || installingJava || testingJavaSuccess === true"
-					@click="reinstallJava"
-				>
-					<DownloadIcon />
-					{{
-						installingJava
-							? formatMessage(messages.installing)
-							: formatMessage(messages.installRecommended)
-					}}
-				</button>
-			</ButtonStyled>
-			<ButtonStyled>
-				<button class="!shadow-none" :disabled="props.disabled" @click="autoDetect">
-					<SearchIcon />
-					{{ formatMessage(messages.detect) }}
-				</button>
-			</ButtonStyled>
-			<ButtonStyled>
-				<button class="!shadow-none" :disabled="props.disabled" @click="handleJavaFileInput()">
-					<FolderSearchIcon />
-					{{ formatMessage(messages.browse) }}
-				</button>
-			</ButtonStyled>
+			<Button
+				v-if="props.version"
+				:disabled="props.disabled || installingJava"
+				@click="reinstallJava"
+			>
+				<DownloadIcon />
+				{{ installingJava ? 'Installing...' : 'Install recommended' }}
+			</Button>
+			<Button :disabled="props.disabled" @click="autoDetect">
+				<SearchIcon />
+				Detect
+			</Button>
+			<Button :disabled="props.disabled" @click="handleJavaFileInput()">
+				<FolderSearchIcon />
+				Browse
+			</Button>
+			<Button v-if="testingJava" disabled> Testing... </Button>
+			<Button v-else-if="testingJavaSuccess === true">
+				<CheckIcon class="test-success" />
+				Success
+			</Button>
+			<Button v-else-if="testingJavaSuccess === false">
+				<XIcon class="test-fail" />
+				Failed
+			</Button>
+			<Button v-else :disabled="props.disabled" @click="testJava">
+				<PlayIcon />
+				Test
+			</Button>
 		</span>
 	</div>
 </template>

 <script setup>
 import {
-	CheckCircleIcon,
+	CheckIcon,
 	DownloadIcon,
 	FolderSearchIcon,
-	RefreshCwIcon,
+	PlayIcon,
 	SearchIcon,
-	SpinnerIcon,
-	XCircleIcon,
+	XIcon,
 } from '@modrinth/assets'
-import {
-	ButtonStyled,
-	defineMessages,
-	injectNotificationManager,
-	StyledInput,
-	useVIntl,
-} from '@modrinth/ui'
+import { Button, injectNotificationManager, StyledInput } from '@modrinth/ui'
 import { open } from '@tauri-apps/plugin-dialog'
-import { ref, watch } from 'vue'
+import { ref } from 'vue'

 import JavaDetectionModal from '@/components/ui/JavaDetectionModal.vue'
-import useJavaTest from '@/composables/useJavaTest'
 import { trackEvent } from '@/helpers/analytics'
-import { auto_install_java, find_filtered_jres, get_jre } from '@/helpers/jre.js'
+import { auto_install_java, find_filtered_jres, get_jre, test_jre } from '@/helpers/jre.js'

 const { handleError } = injectNotificationManager()
-const { formatMessage } = useVIntl()
-
-const messages = defineMessages({
-	pathPlaceholder: {
-		id: 'app.java-selector.path.placeholder',
-		defaultMessage: '/path/to/java',
-	},
-	testJavaInstallation: {
-		id: 'app.java-selector.test-installation',
-		defaultMessage: 'Test Java installation',
-	},
-	alreadyInstalled: {
-		id: 'app.java-selector.already-installed',
-		defaultMessage: 'Already installed',
-	},
-	installing: {
-		id: 'app.java-selector.installing',
-		defaultMessage: 'Installing...',
-	},
-	installRecommended: {
-		id: 'app.java-selector.install-recommended',
-		defaultMessage: 'Install recommended',
-	},
-	detect: {
-		id: 'app.java-selector.detect',
-		defaultMessage: 'Detect',
-	},
-	browse: {
-		id: 'app.java-selector.browse',
-		defaultMessage: 'Browse',
-	},
-})

 const props = defineProps({
-	id: {
-		type: String,
-		required: false,
-		default: null,
-	},
 	version: {
 		type: Number,
 		required: false,
@@ -174,36 +100,29 @@ const props = defineProps({

 const emit = defineEmits(['update:modelValue'])

-const {
-	testingJava,
-	javaTestResult: testingJavaSuccess,
-	testJavaInstallationDebounced,
-	testJavaInstallation,
-} = useJavaTest()
+const testingJava = ref(false)
+const testingJavaSuccess = ref(null)

 const installingJava = ref(false)
-const hoveringTest = ref(false)
-let hasInitialized = false

-async function runTest(path) {
-	await testJavaInstallation(path, props.version, true)
+async function testJava() {
+	testingJava.value = true
+	testingJavaSuccess.value = await test_jre(
+		props.modelValue ? props.modelValue.path : '',
+		props.version,
+	)
+	testingJava.value = false
+
+	trackEvent('JavaTest', {
+		path: props.modelValue ? props.modelValue.path : '',
+		success: testingJavaSuccess.value,
+	})
+
+	setTimeout(() => {
+		testingJavaSuccess.value = null
+	}, 2000)
 }

-watch(
-	() => props.modelValue?.path,
-	(newPath) => {
-		if (newPath) {
-			if (!hasInitialized) {
-				testJavaInstallation(newPath, props.version, false)
-				hasInitialized = true
-			} else {
-				testJavaInstallationDebounced(newPath, props.version)
-			}
-		}
-	},
-	{ immediate: true },
-)
-
 async function handleJavaFileInput() {
 	const filePath = await open()

@@ -213,7 +132,6 @@ async function handleJavaFileInput() {
 			result = {
 				path: filePath.path ?? filePath,
 				version: props.version.toString(),
-				parsed_version: props.version,
 				architecture: 'x86',
 			}
 		}
@@ -247,7 +165,6 @@ async function reinstallJava() {
 		result = {
 			path: path,
 			version: props.version.toString(),
-			parsed_version: props.version,
 			architecture: 'x86',
 		}
 	}
@@ -259,23 +176,13 @@ async function reinstallJava() {

 	emit('update:modelValue', result)
 	installingJava.value = false
-	runTest(result.path)
 }
 </script>

 <style lang="scss" scoped>
-.input-with-status {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	gap: 0.5rem;
-	width: 100%;
-	min-width: 0;
-}
-
 .installation-input {
-	flex: 1 1 0;
-	min-width: 0;
+	width: 100% !important;
+	flex-grow: 1;
 }

 .toggle-setting {
@@ -297,5 +204,17 @@ async function reinstallJava() {
 	align-items: center;
 	gap: 0.5rem;
 	margin: 0;
+
+	.btn {
+		width: max-content;
+	}
+}
+
+.test-success {
+	color: var(--color-green);
+}
+
+.test-fail {
+	color: var(--color-red);
 }
 </style>
@@ -1,11 +1,11 @@
 <script setup>
 import { CheckIcon } from '@modrinth/assets'
-import { Badge, ButtonStyled } from '@modrinth/ui'
+import { Badge, Button } from '@modrinth/ui'
 import { computed, ref } from 'vue'

 import { SwapIcon } from '@/assets/icons/index.js'
 import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
-import { update_managed_modrinth_version } from '@/helpers/instance'
+import { update_managed_modrinth_version } from '@/helpers/profile'
 import { releaseColor } from '@/helpers/utils'

 const props = defineProps({
@@ -32,14 +32,14 @@ const filteredVersions = computed(() => {
 })

 const modpackVersionModal = ref(null)
-const installedVersion = computed(() => props.instance?.link?.version_id)
+const installedVersion = computed(() => props.instance?.linked_data?.version_id)
 const installing = computed(() => props.instance.install_stage !== 'installed')
 const inProgress = ref(false)

 const switchVersion = async (versionId) => {
 	modpackVersionModal.value.hide()
 	inProgress.value = true
-	await update_managed_modrinth_version(props.instance.id, versionId)
+	await update_managed_modrinth_version(props.instance.path, versionId)
 	inProgress.value = false
 	emit('finish-install')
 }
@@ -59,7 +59,7 @@ const onHide = () => {
 		:on-hide="onHide"
 	>
 		<div class="modal-body">
-			<div v-if="instance.link" class="mod-card">
+			<div v-if="instance.linked_data" class="mod-card">
 				<div class="table">
 					<div class="table-row with-columns table-head">
 						<div class="table-cell table-text download-cell" />
@@ -74,18 +74,15 @@ const onHide = () => {
 							@click="$router.push(`/project/${version.project_id}/version/${version.id}`)"
 						>
 							<div class="table-cell table-text">
-								<ButtonStyled
-									circular
-									:color="version.id === installedVersion ? 'standard' : 'brand'"
+								<Button
+									:color="version.id === installedVersion ? '' : 'primary'"
+									icon-only
+									:disabled="inProgress || installing || version.id === installedVersion"
+									@click.stop="() => switchVersion(version.id)"
 								>
-									<button
-										:disabled="inProgress || installing || version.id === installedVersion"
-										@click.stop="() => switchVersion(version.id)"
-									>
-										<SwapIcon v-if="version.id !== installedVersion" />
-										<CheckIcon v-else />
-									</button>
-								</ButtonStyled>
+									<SwapIcon v-if="version.id !== installedVersion" />
+									<CheckIcon v-else />
+								</Button>
 							</div>
 							<div class="name-cell table-cell table-text">
 								<div class="version-link">
@@ -3,7 +3,6 @@
 		v-if="typeof to === 'string'"
 		:to="to"
 		v-bind="$attrs"
-		:active-class="isSubpage ? '' : undefined"
 		:class="{
 			'router-link-active': isPrimary && isPrimary(route),
 			'subpage-active': isSubpage && isSubpage(route),
@@ -0,0 +1,185 @@
+<template>
+	<nav
+		v-if="filteredLinks.length > 1"
+		ref="scrollContainer"
+		class="card-shadow experimental-styles-within relative flex w-fit overflow-clip rounded-full bg-bg-raised p-1 text-sm font-bold"
+	>
+		<RouterLink
+			v-for="(link, index) in filteredLinks"
+			v-show="link.shown === undefined ? true : link.shown"
+			:key="index"
+			ref="tabLinkElements"
+			:to="query ? (link.href ? `?${query}=${link.href}` : '?') : link.href"
+			:class="`button-animation z-[1] flex flex-row items-center gap-2 px-4 py-2 focus:rounded-full ${activeIndex === index && !subpageSelected ? 'text-button-textSelected' : activeIndex === index && subpageSelected ? 'text-contrast' : 'text-primary'}`"
+		>
+			<component :is="link.icon" v-if="link.icon" class="size-5" />
+			<span class="text-nowrap">{{ link.label }}</span>
+		</RouterLink>
+		<div
+			:class="[
+				'pointer-events-none absolute h-[calc(100%-0.5rem)] overflow-hidden rounded-full p-1',
+				subpageSelected ? 'bg-button-bg' : 'bg-button-bgSelected',
+				{ 'navtabs-transition': transitionsEnabled },
+			]"
+			:style="{
+				left: sliderLeftPx,
+				top: sliderTopPx,
+				right: sliderRightPx,
+				bottom: sliderBottomPx,
+				opacity: sliderReady && activeIndex !== -1 ? 1 : 0,
+			}"
+			aria-hidden="true"
+		></div>
+	</nav>
+</template>
+
+<script setup lang="ts">
+import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
+import type { RouteLocationRaw } from 'vue-router'
+import { RouterLink, useRoute } from 'vue-router'
+
+const route = useRoute()
+
+interface Tab {
+	label: string
+	href: string | RouteLocationRaw
+	shown?: boolean
+	icon?: unknown
+	subpages?: string[]
+}
+
+const props = defineProps<{
+	links: Tab[]
+	query?: string
+}>()
+
+const scrollContainer = ref<HTMLElement | null>(null)
+const sliderLeft = ref(4)
+const sliderTop = ref(4)
+const sliderRight = ref(4)
+const sliderBottom = ref(4)
+const activeIndex = ref(-1)
+const subpageSelected = ref(false)
+const sliderReady = ref(false)
+const transitionsEnabled = ref(false)
+const sliderDelays = ref({ left: '0ms', top: '0ms', right: '0ms', bottom: '0ms' })
+
+const filteredLinks = computed(() =>
+	props.links.filter((x) => (x.shown === undefined ? true : x.shown)),
+)
+const sliderLeftPx = computed(() => `${sliderLeft.value}px`)
+const sliderTopPx = computed(() => `${sliderTop.value}px`)
+const sliderRightPx = computed(() => `${sliderRight.value}px`)
+const sliderBottomPx = computed(() => `${sliderBottom.value}px`)
+
+const leftDelay = computed(() => sliderDelays.value.left)
+const rightDelay = computed(() => sliderDelays.value.right)
+const topDelay = computed(() => sliderDelays.value.top)
+const bottomDelay = computed(() => sliderDelays.value.bottom)
+
+function pickLink() {
+	let index = -1
+	subpageSelected.value = false
+	for (let i = filteredLinks.value.length - 1; i >= 0; i--) {
+		const link = filteredLinks.value[i]
+
+		if (route.path === (typeof link.href === 'string' ? link.href : link.href.path)) {
+			index = i
+			break
+		} else if (link.subpages && link.subpages.some((subpage) => route.path.includes(subpage))) {
+			index = i
+			subpageSelected.value = true
+			break
+		}
+	}
+	activeIndex.value = index
+
+	if (activeIndex.value !== -1) {
+		startAnimation()
+	} else {
+		sliderLeft.value = 0
+		sliderRight.value = 0
+	}
+}
+
+function getTabElement(index: number): HTMLElement | null {
+	if (index === -1) return null
+	const container = scrollContainer.value
+	if (!container) return null
+	const tabs = container.querySelectorAll('.button-animation')
+	return (tabs[index] as HTMLElement) ?? null
+}
+
+function startAnimation() {
+	const el = getTabElement(activeIndex.value)
+	if (!el?.offsetParent) return
+
+	const parent = el.offsetParent as HTMLElement
+	const newValues = {
+		left: el.offsetLeft,
+		top: el.offsetTop,
+		right: parent.offsetWidth - el.offsetLeft - el.offsetWidth,
+		bottom: parent.offsetHeight - el.offsetTop - el.offsetHeight,
+	}
+
+	const isInitialPosition = sliderLeft.value === 4 && sliderRight.value === 4
+
+	if (isInitialPosition) {
+		sliderLeft.value = newValues.left
+		sliderRight.value = newValues.right
+		sliderTop.value = newValues.top
+		sliderBottom.value = newValues.bottom
+		sliderReady.value = true
+		requestAnimationFrame(() => {
+			transitionsEnabled.value = true
+		})
+	} else {
+		const STAGGER_DELAY = '200ms'
+		sliderDelays.value = {
+			left: newValues.left < sliderLeft.value ? '0ms' : STAGGER_DELAY,
+			right: newValues.left < sliderLeft.value ? STAGGER_DELAY : '0ms',
+			top: newValues.top < sliderTop.value ? '0ms' : STAGGER_DELAY,
+			bottom: newValues.top < sliderTop.value ? STAGGER_DELAY : '0ms',
+		}
+		sliderLeft.value = newValues.left
+		sliderRight.value = newValues.right
+		sliderTop.value = newValues.top
+		sliderBottom.value = newValues.bottom
+	}
+}
+
+onMounted(async () => {
+	window.addEventListener('resize', pickLink)
+	await nextTick()
+	pickLink()
+})
+
+onUnmounted(() => {
+	window.removeEventListener('resize', pickLink)
+})
+
+watch(
+	filteredLinks,
+	async () => {
+		await nextTick()
+		pickLink()
+	},
+	{ deep: true },
+)
+
+watch(route, async () => {
+	await nextTick()
+	pickLink()
+})
+</script>
+<style scoped>
+.navtabs-transition {
+	/* Delay on opacity is to hide any jankiness as the page loads */
+	transition:
+		left 150ms cubic-bezier(0.4, 0, 0.2, 1) v-bind(leftDelay),
+		right 150ms cubic-bezier(0.4, 0, 0.2, 1) v-bind(rightDelay),
+		top 150ms cubic-bezier(0.4, 0, 0.2, 1) v-bind(topDelay),
+		bottom 150ms cubic-bezier(0.4, 0, 0.2, 1) v-bind(bottomDelay),
+		opacity 250ms cubic-bezier(0.5, 0, 0.2, 1) 50ms;
+}
+</style>
@@ -1,123 +0,0 @@
-<script setup lang="ts">
-import { CalendarIcon, UsersIcon, XIcon } from '@modrinth/assets'
-import { injectModrinthClient, ProgressBar } from '@modrinth/ui'
-import { useQuery } from '@tanstack/vue-query'
-import { openUrl } from '@tauri-apps/plugin-opener'
-import { computed, ref } from 'vue'
-
-const DISMISSED_STORAGE_KEY = 'pride-fundraiser-2026-dismissed'
-
-const client = injectModrinthClient()
-const dismissed = ref(localStorage.getItem(DISMISSED_STORAGE_KEY) === 'true')
-
-const { data: campaignInfo } = useQuery({
-	queryKey: ['campaign', 'pride-26'],
-	queryFn: () => client.labrinth.campaign_internal.getPride26(),
-	enabled: () => !dismissed.value,
-	staleTime: 15 * 60 * 1000,
-	refetchInterval: 15 * 60 * 1000,
-	retry: false,
-})
-const shouldShowBanner = computed(
-	() => !dismissed.value && Number(campaignInfo.value?.target_usd) > 0,
-)
-
-async function openPrideFundraiser() {
-	await openUrl('https://modrinth.com/pride?from=app')
-}
-
-function dismissBanner() {
-	dismissed.value = true
-	localStorage.setItem(DISMISSED_STORAGE_KEY, 'true')
-}
-
-function formatUsd(amount: string | number) {
-	return Number(amount).toLocaleString('en-US', {
-		style: 'currency',
-		currency: 'USD',
-		maximumFractionDigits: 0,
-	})
-}
-
-function daysLeft() {
-	return Math.max(
-		0,
-		Math.ceil((new Date('2026-07-01T00:00:00Z').getTime() - Date.now()) / (24 * 60 * 60 * 1000)),
-	)
-}
-</script>
-
-<template>
-	<div v-if="shouldShowBanner && campaignInfo">
-		<section
-			role="link"
-			tabindex="0"
-			class="flex w-full cursor-pointer flex-col gap-3 rounded-xl border border-solid border-surface-5 bg-button-bg p-3 text-primary transition-[border-color,filter] hover:border-surface-6 hover:brightness-125 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-brand"
-			aria-label="Open Pride fundraiser"
-			@click="openPrideFundraiser"
-			@keydown.enter="openPrideFundraiser"
-			@keydown.space.prevent="openPrideFundraiser"
-		>
-			<div class="flex w-full items-center justify-between gap-2">
-				<h2 class="m-0 min-w-0 truncate text-base font-semibold text-contrast">
-					Pride Fundraiser 2026
-				</h2>
-				<button
-					type="button"
-					class="m-0 flex size-5 shrink-0 cursor-pointer items-center justify-center border-0 bg-transparent p-0 text-primary transition-colors hover:text-contrast focus-visible:text-contrast"
-					aria-label="Dismiss Pride fundraiser"
-					@click.stop="dismissBanner"
-					@keydown.stop
-				>
-					<XIcon aria-hidden="true" class="size-5" />
-				</button>
-			</div>
-			<div class="h-px w-full bg-surface-5" />
-			<div class="flex w-full flex-col gap-2.5">
-				<div class="flex items-end gap-1 whitespace-nowrap">
-					<span class="text-base font-semibold leading-5 text-contrast">
-						{{ formatUsd(campaignInfo.total_donations_usd) }}
-					</span>
-					<span class="text-xs font-medium leading-4">
-						of {{ formatUsd(campaignInfo.target_usd) }}
-					</span>
-				</div>
-				<ProgressBar
-					class="pride-fundraiser-banner__progress"
-					:progress="Number(campaignInfo.total_donations_usd)"
-					:max="Number(campaignInfo.target_usd)"
-					color="purple"
-					full-width
-					:gradient-border="false"
-					:aria-label="`${formatUsd(campaignInfo.total_donations_usd)} of ${formatUsd(
-						campaignInfo.target_usd,
-					)} raised`"
-				/>
-				<div class="flex flex-wrap items-center gap-2 text-xs font-medium leading-4">
-					<span class="flex items-center gap-1">
-						<UsersIcon aria-hidden="true" class="size-4 shrink-0" />
-						{{ campaignInfo.num_donators.toLocaleString('en-US') }}
-						{{ campaignInfo.num_donators === 1 ? 'supporter' : 'supporters' }}
-					</span>
-					<span class="flex items-center gap-1">
-						<CalendarIcon aria-hidden="true" class="size-4 shrink-0" />
-						{{ daysLeft() }} {{ daysLeft() === 1 ? 'day left' : 'days left' }}
-					</span>
-				</div>
-			</div>
-		</section>
-	</div>
-</template>
-
-<style scoped>
-.pride-fundraiser-banner__progress :deep(.progress-bar) {
-	background: linear-gradient(
-		90deg,
-		var(--color-red) 0%,
-		var(--color-orange) 20%,
-		var(--color-green) 50%,
-		var(--color-blue) 75%,
-		var(--color-purple) 100%
-	);
-}
-</style>
@@ -37,6 +37,6 @@ defineProps({

 .progress-bar__fill {
 	height: 100%;
-	transition: width 0.3s ease-out;
+	transition: width 0.3s;
 }
 </style>
@@ -1,309 +1,74 @@
 <script setup>
 import { SpinnerIcon } from '@modrinth/assets'
-import { Avatar, defineMessages, injectNotificationManager, useVIntl } from '@modrinth/ui'
-import { useQueryClient } from '@tanstack/vue-query'
+import { Avatar, injectNotificationManager } from '@modrinth/ui'
 import { convertFileSrc } from '@tauri-apps/api/core'
 import dayjs from 'dayjs'
-import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { onUnmounted, ref } from 'vue'

 import NavButton from '@/components/ui/NavButton.vue'
-import { instance_listener } from '@/helpers/events.js'
-import { list } from '@/helpers/instance'
-
-const ITEM_SIZE = 52
-const APPROX_USED_VERTICAL_SPACE = 513 // doesn't need to be exact lol just close enough so there's a little gap and no overflow
-const STORAGE_KEY = 'modrinth-quick-instance-count'
+import { profile_listener } from '@/helpers/events.js'
+import { list } from '@/helpers/profile'

 const { handleError } = injectNotificationManager()
-const queryClient = useQueryClient()
-
-const { formatMessage } = useVIntl()
-
-const maxAuto = ref(0)
-const allInstances = ref([])
-const dragging = ref(false)
-
-const stored = localStorage.getItem(STORAGE_KEY)
-const userLimit = ref(stored === null ? null : Number(stored))
-
-const maxVisible = computed(() => Math.min(maxAuto.value, allInstances.value.length))
-const visibleCount = computed(() => Math.min(userLimit.value ?? maxVisible.value, maxVisible.value))
-const recentInstances = computed(() => allInstances.value.slice(0, visibleCount.value))
-const canDrag = computed(() => maxVisible.value > 0)
-const showOverdrag = ref(false)
-
-const updateMaxAuto = () => {
-	maxAuto.value = Math.max(
-		0,
-		Math.floor((window.innerHeight - APPROX_USED_VERTICAL_SPACE) / ITEM_SIZE),
-	)
-}
-
-const setLimit = (count) => {
-	const clamped = Math.max(0, Math.min(count, maxVisible.value))
-	if (clamped >= maxVisible.value) {
-		userLimit.value = null
-		localStorage.removeItem(STORAGE_KEY)
-	} else {
-		userLimit.value = clamped
-		localStorage.setItem(STORAGE_KEY, String(clamped))
-	}
-}
-
-let dragStartY = 0
-let dragStartCount = 0
-let wasOverdragging = false
-let overdragTimeout = null
-
-const clearOverdragFlash = () => {
-	showOverdrag.value = false
-	if (overdragTimeout !== null) {
-		clearTimeout(overdragTimeout)
-		overdragTimeout = null
-	}
-}
-
-const flashOverdrag = () => {
-	showOverdrag.value = true
-	if (overdragTimeout !== null) {
-		clearTimeout(overdragTimeout)
-	}
-	overdragTimeout = setTimeout(() => {
-		showOverdrag.value = false
-		overdragTimeout = null
-	}, 500)
-}
-
-const onDividerPointerDown = (event) => {
-	if (!canDrag.value) {
-		return
-	}
-	event.preventDefault()
-	dragging.value = true
-	wasOverdragging = false
-	clearOverdragFlash()
-	dragStartY = event.clientY
-	dragStartCount = visibleCount.value
-	document.body.classList.add('quick-instance-dragging')
-	event.currentTarget.setPointerCapture(event.pointerId)
-}
-
-const onDividerPointerMove = (event) => {
-	if (!dragging.value) {
-		return
-	}
-	const delta = event.clientY - dragStartY
-	const target = dragStartCount + Math.round(delta / ITEM_SIZE)
-	const isOverdragging = target < 0 || target > maxAuto.value
-	if (isOverdragging && !wasOverdragging) {
-		flashOverdrag()
-	}
-	wasOverdragging = isOverdragging
-	setLimit(target)
-}
-
-const endDrag = (event) => {
-	if (!dragging.value) {
-		return
-	}
-	dragging.value = false
-	wasOverdragging = false
-	clearOverdragFlash()
-	document.body.classList.remove('quick-instance-dragging')
-	if (event?.currentTarget?.hasPointerCapture?.(event.pointerId)) {
-		event.currentTarget.releasePointerCapture(event.pointerId)
-	}
-}
-
-const onDividerPointerUp = (event) => {
-	endDrag(event)
-}

+const recentInstances = ref([])
 const getInstances = async () => {
-	const instances = await list().catch(handleError)
+	const profiles = await list().catch(handleError)

-	for (const instance of instances) {
-		queryClient.setQueryData(['instances', 'summary', instance.id], instance)
-	}
+	recentInstances.value = profiles
+		.sort((a, b) => {
+			const dateACreated = dayjs(a.created)
+			const dateAPlayed = a.last_played ? dayjs(a.last_played) : dayjs(0)

-	allInstances.value = instances.sort((a, b) => {
-		const dateACreated = dayjs(a.created)
-		const dateAPlayed = a.last_played ? dayjs(a.last_played) : dayjs(0)
+			const dateBCreated = dayjs(b.created)
+			const dateBPlayed = b.last_played ? dayjs(b.last_played) : dayjs(0)

-		const dateBCreated = dayjs(b.created)
-		const dateBPlayed = b.last_played ? dayjs(b.last_played) : dayjs(0)
+			const dateA = dateACreated.isAfter(dateAPlayed) ? dateACreated : dateAPlayed
+			const dateB = dateBCreated.isAfter(dateBPlayed) ? dateBCreated : dateBPlayed

-		const dateA = dateACreated.isAfter(dateAPlayed) ? dateACreated : dateAPlayed
-		const dateB = dateBCreated.isAfter(dateBPlayed) ? dateBCreated : dateBPlayed
+			if (dateA.isSame(dateB)) {
+				return a.name.localeCompare(b.name)
+			}

-		if (dateA.isSame(dateB)) {
-			return a.name.localeCompare(b.name)
-		}
-
-		return dateB - dateA
-	})
+			return dateB - dateA
+		})
+		.slice(0, 3)
 }

 await getInstances()
-updateMaxAuto()

-const unlistenInstance = await instance_listener(async (event) => {
+const unlistenProfile = await profile_listener(async (event) => {
 	if (event.event !== 'synced') {
 		await getInstances()
 	}
 })

-onMounted(() => {
-	window.addEventListener('resize', updateMaxAuto)
-})
-
 onUnmounted(() => {
-	window.removeEventListener('resize', updateMaxAuto)
-	document.body.classList.remove('quick-instance-dragging')
-	clearOverdragFlash()
-	unlistenInstance()
-})
-
-const messages = defineMessages({
-	dragTooltip: {
-		id: 'app.quick-instance-switcher.drag-tooltip',
-		defaultMessage: 'Drag to resize',
-	},
-	dragShowTooltip: {
-		id: 'app.quick-instance-switcher.drag-show-tooltip',
-		defaultMessage: 'Drag to show recent instances',
-	},
-})
-
-const dividerTooltip = computed(() => {
-	if (!canDrag.value || dragging.value) {
-		return null
-	}
-	return formatMessage(visibleCount.value === 0 ? messages.dragShowTooltip : messages.dragTooltip)
+	unlistenProfile()
 })
 </script>

 <template>
-	<Transition name="top-divider">
-		<div
-			v-if="recentInstances.length > 0"
-			class="top-divider flex items-center justify-center overflow-hidden"
-		>
-			<div class="h-px w-8 bg-surface-5 shrink-0"></div>
-		</div>
-	</Transition>
-	<TransitionGroup name="quick-instance" tag="div" class="flex flex-col items-center">
-		<div
-			v-for="instance in recentInstances"
-			:key="instance.id"
-			v-tooltip.right="instance.name"
-			class="quick-instance-item"
-		>
-			<NavButton :to="`/instance/${encodeURIComponent(instance.id)}`" class="relative">
-				<Avatar
-					:src="instance.icon_path ? convertFileSrc(instance.icon_path) : null"
-					size="28px"
-					:tint-by="instance.id"
-					:class="`transition-all ${instance.install_stage !== 'installed' ? `brightness-[0.25] scale-[0.85]` : `group-hover:brightness-75`}`"
-				/>
-				<div
-					v-if="instance.install_stage !== 'installed'"
-					class="absolute inset-0 flex items-center justify-center z-10 pointer-events-none"
-				>
-					<SpinnerIcon class="animate-spin w-4 h-4" />
-				</div>
-			</NavButton>
-		</div>
-	</TransitionGroup>
-	<div
-		v-tooltip.right="dividerTooltip"
-		class="flex items-center justify-center py-2 select-none"
-		:class="canDrag ? 'cursor-ns-resize touch-none group' : ''"
-		@pointerdown="onDividerPointerDown"
-		@pointermove="onDividerPointerMove"
-		@pointerup="onDividerPointerUp"
-		@pointercancel="onDividerPointerUp"
-	>
-		<div
-			class="h-px w-8 transition-colors duration-200"
-			:class="
-				showOverdrag ? 'bg-red' : canDrag ? 'bg-surface-5 group-hover:bg-secondary' : 'bg-surface-5'
-			"
-		></div>
+	<div v-for="instance in recentInstances" :key="instance.id" v-tooltip.right="instance.name">
+		<NavButton :to="`/instance/${encodeURIComponent(instance.path)}`" class="relative">
+			<Avatar
+				:src="instance.icon_path ? convertFileSrc(instance.icon_path) : null"
+				size="28px"
+				:tint-by="instance.path"
+				:class="`transition-all ${instance.install_stage !== 'installed' ? `brightness-[0.25] scale-[0.85]` : `group-hover:brightness-75`}`"
+			/>
+			<div
+				v-if="instance.install_stage !== 'installed'"
+				class="absolute inset-0 flex items-center justify-center z-10 pointer-events-none"
+			>
+				<SpinnerIcon class="animate-spin w-4 h-4" />
+			</div>
+		</NavButton>
 	</div>
+	<div
+		v-if="instances && recentInstances.length > 0"
+		class="h-px w-6 mx-auto my-2 bg-divider"
+	></div>
 </template>

-<style scoped lang="scss">
-.top-divider {
-	height: calc(1rem + 1px);
-}
-
-.top-divider-enter-active,
-.top-divider-leave-active {
-	transition:
-		opacity 0.25s ease,
-		height 0.25s ease;
-}
-
-.top-divider-enter-from,
-.top-divider-leave-to {
-	opacity: 0;
-	height: 0;
-}
-
-.quick-instance-item {
-	height: 3rem;
-	overflow: hidden;
-
-	& + & {
-		margin-top: 0.25rem;
-	}
-}
-
-.quick-instance-enter-active,
-.quick-instance-leave-active {
-	transition:
-		opacity 0.25s ease,
-		transform 0.25s ease,
-		height 0.25s ease,
-		margin-top 0.25s ease;
-}
-
-.quick-instance-enter-from,
-.quick-instance-leave-to {
-	opacity: 0;
-	transform: scale(0.5);
-	height: 0;
-	margin-top: 0 !important;
-}
-
-@media (prefers-reduced-motion: reduce) {
-	.top-divider-enter-active,
-	.top-divider-leave-active,
-	.quick-instance-enter-active,
-	.quick-instance-leave-active {
-		transition: none;
-	}
-
-	.top-divider-enter-from,
-	.top-divider-leave-to {
-		opacity: 1;
-		height: calc(1rem + 1px);
-	}
-
-	.quick-instance-enter-from,
-	.quick-instance-leave-to {
-		opacity: 1;
-		transform: none;
-		height: 3rem;
-		margin-top: unset !important;
-	}
-}
-</style>
-
-<style lang="scss">
-body.quick-instance-dragging,
-body.quick-instance-dragging * {
-	cursor: ns-resize !important;
-}
-</style>
+<style scoped lang="scss"></style>
@@ -0,0 +1,476 @@
+<template>
+	<div class="action-groups">
+		<ButtonStyled v-if="currentLoadingBars.length > 0" color="brand" type="transparent" circular>
+			<button ref="infoButton" @click="toggleCard()">
+				<DownloadIcon />
+			</button>
+		</ButtonStyled>
+		<div v-if="offline" class="status">
+			<UnplugIcon />
+			<div class="running-text">
+				<span> Offline </span>
+			</div>
+		</div>
+		<div v-if="selectedProcess" class="status">
+			<span class="circle running" />
+			<div ref="profileButton" class="running-text">
+				<router-link
+					class="text-primary"
+					:to="`/instance/${encodeURIComponent(selectedProcess.profile.path)}`"
+				>
+					{{ selectedProcess.profile.name }}
+				</router-link>
+				<div
+					v-if="currentProcesses.length > 1"
+					class="arrow button-base"
+					:class="{ rotate: showProfiles }"
+					@click="toggleProfiles()"
+				>
+					<DropdownIcon />
+				</div>
+			</div>
+			<Button
+				v-tooltip="'Stop instance'"
+				icon-only
+				class="icon-button stop"
+				@click="stop(selectedProcess)"
+			>
+				<StopCircleIcon />
+			</Button>
+			<Button v-tooltip="'View logs'" icon-only class="icon-button" @click="goToTerminal()">
+				<TerminalSquareIcon />
+			</Button>
+		</div>
+		<div v-else class="status">
+			<span class="circle stopped" />
+			<span class="running-text"> No instances running </span>
+		</div>
+	</div>
+	<transition name="download">
+		<Card v-if="showCard === true && currentLoadingBars.length > 0" ref="card" class="info-card">
+			<div v-for="loadingBar in currentLoadingBars" :key="loadingBar.id" class="info-text">
+				<h3 class="info-title">
+					{{ loadingBar.title }}
+				</h3>
+				<div class="flex flex-col gap-2 w-full">
+					<ProgressBar :progress="Math.floor((100 * loadingBar.current) / loadingBar.total)" />
+					<div class="row">
+						{{ Math.floor((100 * loadingBar.current) / loadingBar.total) }}%
+						{{ loadingBar.message }}
+					</div>
+				</div>
+			</div>
+		</Card>
+	</transition>
+	<transition name="download">
+		<Card
+			v-if="showProfiles === true && currentProcesses.length > 0"
+			ref="profiles"
+			class="profile-card"
+		>
+			<Button
+				v-for="process in currentProcesses"
+				:key="process.uuid"
+				class="profile-button"
+				@click="selectProcess(process)"
+			>
+				<div class="text"><span class="circle running" /> {{ process.profile.name }}</div>
+				<Button
+					v-tooltip="'Stop instance'"
+					icon-only
+					class="icon-button stop"
+					@click.stop="stop(process)"
+				>
+					<StopCircleIcon />
+				</Button>
+				<Button
+					v-tooltip="'View logs'"
+					icon-only
+					class="icon-button"
+					@click.stop="goToTerminal(process.profile.path)"
+				>
+					<TerminalSquareIcon />
+				</Button>
+			</Button>
+		</Card>
+	</transition>
+</template>
+
+<script setup>
+import {
+	DownloadIcon,
+	DropdownIcon,
+	StopCircleIcon,
+	TerminalSquareIcon,
+	UnplugIcon,
+} from '@modrinth/assets'
+import { Button, ButtonStyled, Card, injectNotificationManager } from '@modrinth/ui'
+import { onBeforeUnmount, onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+
+import ProgressBar from '@/components/ui/ProgressBar.vue'
+import { trackEvent } from '@/helpers/analytics'
+import { loading_listener, process_listener } from '@/helpers/events'
+import { get_all as getRunningProcesses, kill as killProcess } from '@/helpers/process'
+import { get_many } from '@/helpers/profile.js'
+import { progress_bars_list } from '@/helpers/state.js'
+
+const { handleError } = injectNotificationManager()
+
+const router = useRouter()
+const card = ref(null)
+const profiles = ref(null)
+const infoButton = ref(null)
+const profileButton = ref(null)
+const showCard = ref(false)
+
+const showProfiles = ref(false)
+
+const currentProcesses = ref([])
+const selectedProcess = ref()
+
+const refresh = async () => {
+	const processes = await getRunningProcesses().catch(handleError)
+	const profiles = await get_many(processes.map((x) => x.profile_path)).catch(handleError)
+
+	currentProcesses.value = processes.map((x) => ({
+		profile: profiles.find((prof) => x.profile_path === prof.path),
+		...x,
+	}))
+	if (!selectedProcess.value || !currentProcesses.value.includes(selectedProcess.value)) {
+		selectedProcess.value = currentProcesses.value[0]
+	}
+}
+
+await refresh()
+
+const offline = ref(!navigator.onLine)
+window.addEventListener('offline', () => {
+	offline.value = true
+})
+window.addEventListener('online', () => {
+	offline.value = false
+})
+
+const unlistenProcess = await process_listener(async () => {
+	await refresh()
+})
+
+const stop = async (process) => {
+	try {
+		await killProcess(process.uuid).catch(handleError)
+
+		trackEvent('InstanceStop', {
+			loader: process.profile.loader,
+			game_version: process.profile.game_version,
+			source: 'AppBar',
+		})
+	} catch (e) {
+		console.error(e)
+	}
+	await refresh()
+}
+
+const goToTerminal = (path) => {
+	router.push(`/instance/${encodeURIComponent(path ?? selectedProcess.value.profile.path)}/logs`)
+}
+
+const currentLoadingBars = ref([])
+
+const refreshInfo = async () => {
+	const currentLoadingBarCount = currentLoadingBars.value.length
+	currentLoadingBars.value = Object.values(await progress_bars_list().catch(handleError))
+		.map((x) => {
+			if (x.bar_type.type === 'java_download') {
+				x.title = 'Downloading Java ' + x.bar_type.version
+			}
+			if (x.bar_type.profile_path) {
+				x.title = x.bar_type.profile_path
+			}
+			if (x.bar_type.pack_name) {
+				x.title = x.bar_type.pack_name
+			}
+
+			return x
+		})
+		.filter((bar) => bar?.bar_type?.type !== 'launcher_update')
+
+	currentLoadingBars.value.sort((a, b) => {
+		if (a.loading_bar_uuid < b.loading_bar_uuid) {
+			return -1
+		}
+		if (a.loading_bar_uuid > b.loading_bar_uuid) {
+			return 1
+		}
+		return 0
+	})
+
+	if (currentLoadingBars.value.length === 0) {
+		showCard.value = false
+	} else if (currentLoadingBarCount < currentLoadingBars.value.length) {
+		showCard.value = true
+	}
+}
+
+await refreshInfo()
+const unlistenLoading = await loading_listener(async () => {
+	await refreshInfo()
+})
+
+const selectProcess = (process) => {
+	selectedProcess.value = process
+	showProfiles.value = false
+}
+
+const handleClickOutsideCard = (event) => {
+	const elements = document.elementsFromPoint(event.clientX, event.clientY)
+	if (
+		card.value &&
+		card.value.$el !== event.target &&
+		!elements.includes(card.value.$el) &&
+		infoButton.value &&
+		!infoButton.value.contains(event.target)
+	) {
+		showCard.value = false
+	}
+}
+
+const handleClickOutsideProfile = (event) => {
+	const elements = document.elementsFromPoint(event.clientX, event.clientY)
+	if (
+		profiles.value &&
+		profiles.value.$el !== event.target &&
+		!elements.includes(profiles.value.$el) &&
+		!profileButton.value.contains(event.target)
+	) {
+		showProfiles.value = false
+	}
+}
+
+const toggleCard = async () => {
+	showCard.value = !showCard.value
+	showProfiles.value = false
+	await refreshInfo()
+}
+
+const toggleProfiles = async () => {
+	if (currentProcesses.value.length === 1) return
+	showProfiles.value = !showProfiles.value
+	showCard.value = false
+}
+
+onMounted(() => {
+	window.addEventListener('click', handleClickOutsideCard)
+	window.addEventListener('click', handleClickOutsideProfile)
+})
+
+onBeforeUnmount(() => {
+	window.removeEventListener('click', handleClickOutsideCard)
+	window.removeEventListener('click', handleClickOutsideProfile)
+	unlistenProcess()
+	unlistenLoading()
+})
+</script>
+
+<style scoped lang="scss">
+.action-groups {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: var(--gap-md);
+}
+
+.arrow {
+	transition: transform 0.2s ease-in-out;
+	display: flex;
+	align-items: center;
+	&.rotate {
+		transform: rotate(180deg);
+	}
+}
+
+.status {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: 0.5rem;
+	border-radius: var(--radius-md);
+	border: 1px solid var(--color-divider);
+	padding: var(--gap-sm) var(--gap-lg);
+}
+
+.running-text {
+	display: flex;
+	flex-direction: row;
+	gap: var(--gap-xs);
+	white-space: nowrap;
+	overflow: hidden;
+	-webkit-user-select: none; /* Safari */
+	-ms-user-select: none; /* IE 10 and IE 11 */
+	user-select: none;
+
+	&.clickable:hover {
+		cursor: pointer;
+	}
+}
+
+.circle {
+	width: 0.5rem;
+	height: 0.5rem;
+	border-radius: 50%;
+	display: inline-block;
+	margin-right: 0.25rem;
+
+	&.running {
+		background-color: var(--color-brand);
+	}
+
+	&.stopped {
+		background-color: var(--color-base);
+	}
+}
+
+.icon-button {
+	background-color: rgba(0, 0, 0, 0);
+	box-shadow: none;
+	width: 1.25rem !important;
+	height: 1.25rem !important;
+
+	svg {
+		min-width: 1.25rem;
+	}
+
+	&.stop {
+		color: var(--color-red);
+	}
+}
+
+.info-card {
+	position: absolute;
+	top: 3.5rem;
+	right: 2rem;
+	z-index: 9;
+	width: 20rem;
+	background-color: var(--color-raised-bg);
+	box-shadow: var(--shadow-raised);
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+	overflow: auto;
+	transition: all 0.2s ease-in-out;
+	border: 1px solid var(--color-divider);
+
+	&.hidden {
+		transform: translateY(-100%);
+	}
+}
+
+.loading-option {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: 0.5rem;
+	margin: 0;
+	padding: 0;
+
+	:hover {
+		background-color: var(--color-raised-bg-hover);
+	}
+}
+
+.loading-text {
+	display: flex;
+	flex-direction: column;
+	margin: 0;
+	padding: 0;
+
+	.row {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		gap: 0.5rem;
+	}
+}
+
+.loading-icon {
+	width: 2.25rem;
+	height: 2.25rem;
+	display: block;
+
+	:deep(svg) {
+		left: 1rem;
+		width: 2.25rem;
+		height: 2.25rem;
+	}
+}
+
+.download-enter-active,
+.download-leave-active {
+	transition: opacity 0.3s ease;
+}
+
+.download-enter-from,
+.download-leave-to {
+	opacity: 0;
+}
+
+.progress-bar {
+	width: 100%;
+}
+
+.info-text {
+	display: flex;
+	flex-direction: column;
+	align-items: flex-start;
+	gap: 0.75rem;
+	margin: 0;
+	padding: 0;
+}
+
+.info-title {
+	margin: 0;
+}
+
+.profile-button {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: var(--gap-sm);
+	width: 100%;
+	background-color: var(--color-raised-bg);
+	box-shadow: none;
+
+	.text {
+		margin-right: auto;
+	}
+}
+
+.profile-card {
+	position: absolute;
+	top: 3.5rem;
+	right: 0.5rem;
+	z-index: 9;
+	background-color: var(--color-raised-bg);
+	box-shadow: var(--shadow-raised);
+	display: flex;
+	flex-direction: column;
+	overflow: auto;
+	transition: all 0.2s ease-in-out;
+	border: 1px solid var(--color-divider);
+	padding: var(--gap-md);
+
+	&.hidden {
+		transform: translateY(-100%);
+	}
+}
+
+.link {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: var(--gap-sm);
+	margin: 0;
+	color: var(--color-text);
+	text-decoration: none;
+}
+</style>
@@ -0,0 +1,142 @@
+<template>
+	<ProjectCard
+		:title="project.name"
+		:link="
+			() => {
+				emit('open')
+				$router.push({
+					path: `/project/${project.project_id ?? project.id}`,
+					query: { i: props.instance ? props.instance.path : undefined },
+				})
+			}
+		"
+		:author="{ name: project.author, link: `https://modrinth.com/user/${project.author}` }"
+		:icon-url="project.icon_url"
+		:summary="project.summary"
+		:tags="project.display_categories"
+		:all-tags="project.categories"
+		:downloads="project.downloads"
+		:followers="project.follows"
+		:date-updated="project.date_modified"
+		:banner="project.featured_gallery ?? undefined"
+		:color="project.color ?? undefined"
+		:environment="
+			['mod', 'modpack'].includes(projectType)
+				? {
+						clientSide: project.client_side?.[0],
+						serverSide: project.server_side?.[0],
+					}
+				: undefined
+		"
+		layout="list"
+	>
+		<template #actions>
+			<ButtonStyled color="brand" type="outlined">
+				<button
+					:disabled="installed || installing"
+					class="shrink-0 no-wrap"
+					@click.stop="install()"
+				>
+					<SpinnerIcon v-if="installing" class="animate-spin" />
+					<template v-else-if="!installed">
+						<DownloadIcon v-if="modpack || instance" />
+						<PlusIcon v-else />
+					</template>
+					<CheckIcon v-else />
+					{{
+						installing
+							? 'Installing'
+							: installed
+								? 'Installed'
+								: modpack || instance
+									? 'Install'
+									: 'Add to an instance'
+					}}
+				</button>
+			</ButtonStyled>
+		</template>
+	</ProjectCard>
+</template>
+
+<script setup>
+import { CheckIcon, DownloadIcon, PlusIcon, SpinnerIcon } from '@modrinth/assets'
+import { ButtonStyled, injectNotificationManager, ProjectCard } from '@modrinth/ui'
+import dayjs from 'dayjs'
+import relativeTime from 'dayjs/plugin/relativeTime'
+import { computed, ref } from 'vue'
+import { useRouter } from 'vue-router'
+
+import { injectContentInstall } from '@/providers/content-install'
+
+const { install: installVersion } = injectContentInstall()
+
+dayjs.extend(relativeTime)
+
+const { handleError } = injectNotificationManager()
+
+const router = useRouter()
+
+const props = defineProps({
+	backgroundImage: {
+		type: String,
+		default: null,
+	},
+	project: {
+		type: Object,
+		required: true,
+	},
+	instance: {
+		type: Object,
+		default: null,
+	},
+	featured: {
+		type: Boolean,
+		default: false,
+	},
+	installed: {
+		type: Boolean,
+		default: false,
+	},
+	projectType: {
+		type: String,
+		default: undefined,
+	},
+	activeLoader: {
+		type: String,
+		default: null,
+	},
+	activeGameVersion: {
+		type: String,
+		default: null,
+	},
+})
+
+const emit = defineEmits(['open', 'install'])
+
+const installing = ref(false)
+
+async function install() {
+	installing.value = true
+	await installVersion(
+		props.project.project_id ?? props.project.id,
+		null,
+		props.instance ? props.instance.path : null,
+		'SearchCard',
+		(versionId) => {
+			installing.value = false
+			if (versionId) {
+				emit('install', props.project.project_id ?? props.project.id)
+			}
+		},
+		(profile) => {
+			router.push(`/instance/${profile}`)
+		},
+		{
+			preferredLoader: props.activeLoader ?? undefined,
+			preferredGameVersion: props.activeGameVersion ?? undefined,
+		},
+	).catch(handleError)
+}
+
+const modpack = computed(() => props.project.project_types?.includes('modpack'))
+</script>
@@ -1,233 +0,0 @@
-<script setup lang="ts">
-import { NotepadTextIcon, XIcon } from '@modrinth/assets'
-import { ButtonStyled, defineMessages, injectNotificationManager, useVIntl } from '@modrinth/ui'
-import { type } from '@tauri-apps/plugin-os'
-import { $fetch } from 'ofetch'
-import { onMounted, ref } from 'vue'
-
-import { hide_ads_window, show_ads_window } from '@/helpers/ads.js'
-import { list } from '@/helpers/instance'
-import { get as getCreds } from '@/helpers/mr_auth.ts'
-
-type Survey = {
-	id: string
-	tally_id: string
-	type: string
-	condition?: string
-	assigned_users?: string[]
-	dismissed_users?: string[]
-}
-
-type TallyApi = {
-	openPopup: (formId: string, options: object) => void
-}
-
-const tallyWindow = window as Window & { Tally?: TallyApi }
-
-const { formatMessage } = useVIntl()
-const { handleError } = injectNotificationManager()
-
-const availableSurvey = ref<Survey | null>(null)
-
-const messages = defineMessages({
-	surveyTitle: {
-		id: 'app.survey.title',
-		defaultMessage: 'Hey there Modrinth user!',
-	},
-	surveyBody: {
-		id: 'app.survey.body',
-		defaultMessage:
-			'Would you mind answering a few questions about your experience with Modrinth App?',
-	},
-	surveyFooter: {
-		id: 'app.survey.footer',
-		defaultMessage:
-			'This feedback will go directly to the Modrinth team and help guide future updates!',
-	},
-	takeSurvey: {
-		id: 'app.survey.take-survey',
-		defaultMessage: 'Take survey',
-	},
-	surveyNoThanks: {
-		id: 'app.survey.no-thanks',
-		defaultMessage: 'No thanks',
-	},
-})
-
-function cleanupOldSurveyDisplayData() {
-	const threeWeeksAgo = new Date()
-	threeWeeksAgo.setDate(threeWeeksAgo.getDate() - 21)
-
-	for (let i = 0; i < localStorage.length; i++) {
-		const key = localStorage.key(i)
-
-		if (key?.startsWith('survey-') && key.endsWith('-display')) {
-			const dateValue = new Date(localStorage.getItem(key) ?? '')
-			if (dateValue < threeWeeksAgo) {
-				localStorage.removeItem(key)
-			}
-		}
-	}
-}
-
-async function openSurvey() {
-	if (!availableSurvey.value) {
-		console.error('No survey to open')
-		return
-	}
-
-	const creds = await getCreds().catch(handleError)
-	const userId = creds?.user_id
-
-	const formId = availableSurvey.value.tally_id
-
-	const popupOptions = {
-		layout: 'modal',
-		width: 700,
-		autoClose: 2000,
-		hideTitle: true,
-		hiddenFields: {
-			user_id: userId,
-		},
-		onOpen: () => console.info('Opened user survey'),
-		onClose: () => {
-			console.info('Closed user survey')
-			show_ads_window()
-		},
-		onSubmit: () => console.info('Active user survey submitted'),
-	}
-
-	try {
-		hide_ads_window()
-		if (tallyWindow.Tally?.openPopup) {
-			console.info(`Opening Tally popup for user survey (form ID: ${formId})`)
-			dismissSurvey()
-			tallyWindow.Tally.openPopup(formId, popupOptions)
-		} else {
-			console.warn('Tally script not yet loaded')
-			show_ads_window()
-		}
-	} catch (e) {
-		console.error('Error opening Tally popup:', e)
-		show_ads_window()
-	}
-
-	console.info(`Found user survey to show with tally_id: ${formId}`)
-	tallyWindow.Tally?.openPopup(formId, popupOptions)
-}
-
-function dismissSurvey() {
-	if (!availableSurvey.value) return
-	localStorage.setItem(`survey-${availableSurvey.value.id}-display`, String(new Date()))
-	availableSurvey.value = null
-}
-
-async function processPendingSurveys() {
-	function isWithinLastTwoWeeks(date: string | Date | null | undefined) {
-		if (!date) return false
-		const twoWeeksAgo = new Date()
-		twoWeeksAgo.setDate(twoWeeksAgo.getDate() - 14)
-		return new Date(date) >= twoWeeksAgo
-	}
-
-	cleanupOldSurveyDisplayData()
-
-	const creds = await getCreds().catch(handleError)
-	const userId = creds?.user_id
-
-	const instances = (await list().catch(handleError)) ?? []
-	const isActivePlayer = instances.some(
-		(instance) =>
-			isWithinLastTwoWeeks(instance.last_played) && !isWithinLastTwoWeeks(instance.created),
-	)
-
-	let surveys: Survey[] = []
-	try {
-		surveys = await $fetch('https://api.modrinth.com/v2/surveys')
-	} catch (e) {
-		console.error('Error fetching surveys:', e)
-	}
-
-	const surveyToShow = surveys.find(
-		(survey) =>
-			!!(
-				localStorage.getItem(`survey-${survey.id}-display`) === null &&
-				survey.type === 'tally_app' &&
-				((survey.condition === 'active_player' && isActivePlayer) ||
-					(!!userId &&
-						survey.assigned_users?.includes(userId) &&
-						!survey.dismissed_users?.includes(userId)))
-			),
-	)
-
-	if (surveyToShow) {
-		availableSurvey.value = surveyToShow
-	} else {
-		console.info('No user survey to show')
-	}
-}
-
-onMounted(async () => {
-	const osType = await type()
-	if (osType === 'windows') {
-		await processPendingSurveys()
-	} else {
-		console.info('Skipping user surveys on non-Windows platforms')
-	}
-})
-</script>
-
-<template>
-	<transition name="popup-survey">
-		<div
-			v-if="availableSurvey"
-			class="w-[400px] z-20 fixed -bottom-12 pb-16 right-[--right-bar-width] mr-4 rounded-t-2xl card-shadow bg-bg-raised border-surface-5 border-[1px] border-solid border-b-0 p-4"
-		>
-			<h2 class="text-lg font-extrabold mt-0 mb-2">
-				{{ formatMessage(messages.surveyTitle) }}
-			</h2>
-			<p class="m-0 leading-tight">
-				{{ formatMessage(messages.surveyBody) }}
-			</p>
-			<p class="mt-3 mb-4 leading-tight">
-				{{ formatMessage(messages.surveyFooter) }}
-			</p>
-			<div class="flex gap-2">
-				<ButtonStyled color="brand">
-					<button @click="openSurvey">
-						<NotepadTextIcon />
-						{{ formatMessage(messages.takeSurvey) }}
-					</button>
-				</ButtonStyled>
-				<ButtonStyled>
-					<button @click="dismissSurvey">
-						<XIcon />
-						{{ formatMessage(messages.surveyNoThanks) }}
-					</button>
-				</ButtonStyled>
-			</div>
-		</div>
-	</transition>
-</template>
-
-<style scoped>
-.popup-survey-enter-active {
-	transition:
-		opacity 0.25s ease,
-		transform 0.25s cubic-bezier(0.51, 1.08, 0.35, 1.15);
-	transform-origin: top center;
-}
-
-.popup-survey-leave-active {
-	transition:
-		opacity 0.25s ease,
-		transform 0.25s cubic-bezier(0.68, -0.17, 0.23, 0.11);
-	transform-origin: top center;
-}
-
-.popup-survey-enter-from,
-.popup-survey-leave-to {
-	opacity: 0;
-	transform: translateY(10rem) scale(0.8) scaleY(1.6);
-}
-</style>
@@ -1,9 +1,11 @@
 <script setup>
-import { ButtonStyled, injectNotificationManager, ProjectCard } from '@modrinth/ui'
+import { Button, injectNotificationManager } from '@modrinth/ui'
 import { ref } from 'vue'

 import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
-import { get_project_v3, get_version } from '@/helpers/cache.js'
+import SearchCard from '@/components/ui/SearchCard.vue'
+import { get_project, get_version } from '@/helpers/cache.js'
+import { get_categories } from '@/helpers/tags.js'
 import { injectContentInstall } from '@/providers/content-install'

 const { handleError } = injectNotificationManager()
@@ -12,21 +14,26 @@ const { install: installVersion } = injectContentInstall()
 const confirmModal = ref(null)
 const project = ref(null)
 const version = ref(null)
+const categories = ref(null)
+const installing = ref(false)

 defineExpose({
 	async show(event) {
 		if (event.event === 'InstallVersion') {
 			version.value = await get_version(event.id, 'must_revalidate').catch(handleError)
-			project.value = await get_project_v3(version.value.project_id, 'must_revalidate').catch(
+			project.value = await get_project(version.value.project_id, 'must_revalidate').catch(
 				handleError,
 			)
 		} else {
-			project.value = await get_project_v3(event.id, 'must_revalidate').catch(handleError)
+			project.value = await get_project(event.id, 'must_revalidate').catch(handleError)
 			version.value = await get_version(
 				project.value.versions[project.value.versions.length - 1],
 				'must_revalidate',
 			).catch(handleError)
 		}
+		categories.value = (await get_categories().catch(handleError)).filter(
+			(cat) => project.value.categories.includes(cat.name) && cat.project_type === 'mod',
+		)
 		confirmModal.value.show()
 	},
 })
@@ -45,22 +52,13 @@ async function install() {
 </script>

 <template>
-	<ModalWrapper ref="confirmModal" :header="`Install ${project?.name}`">
+	<ModalWrapper ref="confirmModal" :header="`Install ${project?.title}`">
 		<div class="modal-body">
-			<ProjectCard
-				:title="project.name"
-				:link="() => confirmModal.hide()"
-				:icon-url="project.icon_url"
-				:summary="project.summary"
-				:tags="project.display_categories"
-				:all-tags="project.categories"
-				:downloads="project.downloads"
-				:followers="project.follows"
-				:date-updated="project.date_modified"
-				:banner="project.featured_gallery ?? undefined"
-				:color="project.color ?? undefined"
-				layout="list"
+			<SearchCard
+				:project="project"
 				class="project-card"
+				:categories="categories"
+				@open="confirmModal.hide()"
 			/>
 			<div class="button-row">
 				<div class="markdown-body">
@@ -69,9 +67,7 @@ async function install() {
 					</p>
 				</div>
 				<div class="button-group">
-					<ButtonStyled color="brand">
-						<button @click="install">Install</button>
-					</ButtonStyled>
+					<Button :loading="installing" color="primary" @click="install">Install</Button>
 				</div>
 			</div>
 		</div>
@@ -1,93 +0,0 @@
-<template>
-	<section
-		v-if="showControls"
-		class="flex items-center gap-2 mr-1.5"
-		data-tauri-drag-region-exclude
-	>
-		<ButtonStyled type="transparent" circular>
-			<button class="relative expanded-button" @click="() => getCurrentWindow().minimize()">
-				<MinimizeIcon />
-			</button>
-		</ButtonStyled>
-		<ButtonStyled type="transparent" circular>
-			<button class="relative expanded-button" @click="() => getCurrentWindow().toggleMaximize()">
-				<RestoreIcon v-if="isMaximized" />
-				<MaximizeIcon v-else />
-			</button>
-		</ButtonStyled>
-		<ButtonStyled
-			type="transparent"
-			color="red"
-			color-fill="none"
-			hover-color-fill="background"
-			circular
-		>
-			<button class="relative expanded-button close-button" @click="handleClose">
-				<XIcon />
-			</button>
-		</ButtonStyled>
-	</section>
-</template>
-
-<script setup>
-import { MaximizeIcon, MinimizeIcon, RestoreIcon, XIcon } from '@modrinth/assets'
-import { ButtonStyled } from '@modrinth/ui'
-import { getCurrentWindow } from '@tauri-apps/api/window'
-import { saveWindowState, StateFlags } from '@tauri-apps/plugin-window-state'
-import { computed, onMounted, onUnmounted, ref } from 'vue'
-
-import { get as getSettings } from '@/helpers/settings.ts'
-import { getOS } from '@/helpers/utils.js'
-import { useTheming } from '@/store/state'
-
-const themeStore = useTheming()
-
-const nativeDecorations = ref(true)
-const isMaximized = ref(false)
-const os = ref('')
-
-const alwaysShowAppControls = computed(() => themeStore.getFeatureFlag('always_show_app_controls'))
-
-const showControls = computed(
-	() =>
-		alwaysShowAppControls.value ||
-		(!nativeDecorations.value && (os.value === 'Windows' || os.value === 'Linux')),
-)
-
-onMounted(async () => {
-	os.value = await getOS()
-
-	const settings = await getSettings()
-	nativeDecorations.value = settings.native_decorations
-
-	if (os.value !== 'MacOS') {
-		await getCurrentWindow().setDecorations(nativeDecorations.value)
-	}
-
-	isMaximized.value = await getCurrentWindow().isMaximized()
-
-	const unlisten = await getCurrentWindow().onResized(async () => {
-		isMaximized.value = await getCurrentWindow().isMaximized()
-	})
-
-	onUnmounted(() => {
-		unlisten()
-	})
-})
-
-const handleClose = async () => {
-	await saveWindowState(StateFlags.ALL)
-	await getCurrentWindow().close()
-}
-</script>
-<style scoped>
-.expanded-button::before {
-	inset: -9px -6px;
-	content: '';
-	position: absolute;
-}
-
-.expanded-button.close-button::before {
-	inset: -9px -9px -9px -6px;
-}
-</style>
@@ -1,124 +0,0 @@
-<template>
-	<ButtonStyled color="brand" type="outlined" hover-color-fill="background">
-		<button
-			v-if="showUpdatePill"
-			type="button"
-			class="!h-[34px] text-sm !transition-[opacity,transform,background-color,color,filter] !duration-200 ease-out"
-			:class="{
-				'opacity-0 scale-[0.96]': finishedDownloading && !animateReadyPill,
-				'opacity-100 scale-100': finishedDownloading && animateReadyPill,
-			}"
-			:disabled="isUpdateDownloading"
-			:aria-busy="isUpdateDownloading"
-			@click="handleUpdateClick"
-		>
-			<RefreshCwIcon v-if="finishedDownloading" :class="{ 'animate-spin': restarting }" />
-			<DownloadIcon v-else />
-			<span v-if="isUpdateDownloading">
-				{{ formatMessage(messages.downloadingUpdate) }}
-				<span class="inline-block w-[3ch] text-right tabular-nums">{{ downloadPercent }}%</span>
-			</span>
-			<span v-else>{{ updateLabel }}</span>
-		</button>
-	</ButtonStyled>
-</template>
-
-<script setup lang="ts">
-import { DownloadIcon, RefreshCwIcon } from '@modrinth/assets'
-import { ButtonStyled, defineMessages, useVIntl } from '@modrinth/ui'
-import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'
-
-import {
-	appUpdateState,
-	downloadAvailableAppUpdate,
-	installAvailableAppUpdate,
-} from '@/providers/app-update'
-
-const { formatMessage } = useVIntl()
-
-const messages = defineMessages({
-	update: {
-		id: 'app.action-bar.update',
-		defaultMessage: 'Update',
-	},
-	downloadingUpdate: {
-		id: 'app.action-bar.downloading-update',
-		defaultMessage: 'Downloading update',
-	},
-	reloadToUpdate: {
-		id: 'app.action-bar.reload-to-update',
-		defaultMessage: 'Reload to update',
-	},
-})
-
-const {
-	downloading,
-	downloadPercent,
-	downloadProgress,
-	finishedDownloading,
-	isVisible: isUpdateVisible,
-	metered,
-	restarting,
-} = appUpdateState
-
-const isUpdateDownloading = computed(
-	() =>
-		downloading.value ||
-		(downloadProgress.value > 0 && downloadProgress.value < 1 && !finishedDownloading.value),
-)
-const showUpdatePill = computed(
-	() => isUpdateVisible.value && (finishedDownloading.value || metered.value),
-)
-const animateReadyPill = ref(false)
-const updateLabel = computed(() => {
-	if (isUpdateDownloading.value) {
-		return formatMessage(messages.downloadingUpdate)
-	}
-
-	if (finishedDownloading.value) {
-		return formatMessage(messages.reloadToUpdate)
-	}
-
-	return formatMessage(messages.update)
-})
-let readyPillAnimationFrame: number | null = null
-watch([showUpdatePill, finishedDownloading], async ([show, ready], [wasShown, wasReady]) => {
-	if (readyPillAnimationFrame !== null) {
-		cancelAnimationFrame(readyPillAnimationFrame)
-		readyPillAnimationFrame = null
-	}
-
-	if (!show || !ready) {
-		animateReadyPill.value = false
-		return
-	}
-
-	if (wasShown && wasReady) {
-		return
-	}
-
-	animateReadyPill.value = false
-	await nextTick()
-	readyPillAnimationFrame = requestAnimationFrame(() => {
-		animateReadyPill.value = true
-		readyPillAnimationFrame = null
-	})
-})
-async function handleUpdateClick() {
-	if (isUpdateDownloading.value) {
-		return
-	}
-
-	if (finishedDownloading.value) {
-		await installAvailableAppUpdate()
-	} else {
-		await downloadAvailableAppUpdate()
-	}
-}
-
-onBeforeUnmount(() => {
-	if (readyPillAnimationFrame !== null) {
-		cancelAnimationFrame(readyPillAnimationFrame)
-	}
-})
-</script>
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { MailIcon, SearchIcon, SendIcon, UserIcon, UserPlusIcon, XIcon } from '@modrinth/assets'
+import { MailIcon, SendIcon, UserIcon, UserPlusIcon, XIcon } from '@modrinth/assets'
 import {
 	Avatar,
 	ButtonStyled,
@@ -10,12 +10,18 @@ import {
 	useRelativeTime,
 	useVIntl,
 } from '@modrinth/ui'
-import { computed, ref } from 'vue'
+import { computed, onUnmounted, ref, watch } from 'vue'

 import FriendsSection from '@/components/ui/friends/FriendsSection.vue'
 import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
-import { useFriends } from '@/composables/use-friends'
-import type { FriendWithUserData } from '@/helpers/friends.ts'
+import { friend_listener } from '@/helpers/events'
+import {
+	add_friend,
+	friends,
+	type FriendWithUserData,
+	remove_friend,
+	transformFriends,
+} from '@/helpers/friends.ts'
 import type { ModrinthCredentials } from '@/helpers/mr_auth'

 const { formatMessage } = useVIntl()
@@ -29,23 +35,36 @@ const props = defineProps<{
 }>()

 const userCredentials = computed(() => props.credentials)
-const {
-	friends: userFriends,
-	loading,
-	requestFriend,
-	acceptFriend,
-	removeFriend: removeFriendRecord,
-} = useFriends({
-	currentUserId: () => userCredentials.value?.user_id,
-	getCredentials: () => userCredentials.value,
-	onError: handleError,
-})

 const search = ref('')
 const friendInvitesModal = ref()
+
 const username = ref('')
 const addFriendModal = ref()
+async function addFriendFromModal() {
+	addFriendModal.value.hide()
+	await add_friend(username.value).catch(handleError)
+	username.value = ''
+	await loadFriends()
+}

+async function addFriend(friend: FriendWithUserData) {
+	const id = friend.id === userCredentials.value?.user_id ? friend.friend_id : friend.id
+	if (id) {
+		await add_friend(id).catch(handleError)
+		await loadFriends()
+	}
+}
+
+async function removeFriend(friend: FriendWithUserData) {
+	const id = friend.id === userCredentials.value?.user_id ? friend.friend_id : friend.id
+	if (id) {
+		await remove_friend(id).catch(handleError)
+		await loadFriends()
+	}
+}
+
+const userFriends = ref<FriendWithUserData[]>([])
 const sortedFriends = computed<FriendWithUserData[]>(() =>
 	userFriends.value.slice().sort((a, b) => {
 		if (a.last_updated === null && b.last_updated === null) {
@@ -89,22 +108,42 @@ const incomingRequests = computed(() =>
 		.sort((a, b) => b.created.diff(a.created)),
 )

-function addFriendFromModal() {
-	const target = username.value.trim()
-	if (!target) return
+const loading = ref(true)
+async function loadFriends(timeout = false) {
+	loading.value = timeout

-	addFriendModal.value.hide()
-	requestFriend({ id: target, username: target })
-	username.value = ''
+	try {
+		const friendsList = await friends()
+		userFriends.value = await transformFriends(friendsList, userCredentials.value)
+		loading.value = false
+	} catch (e) {
+		console.error('Error loading friends', e)
+		if (timeout) {
+			setTimeout(() => loadFriends(), 15 * 1000)
+		}
+	}
 }

-function addFriend(friend: FriendWithUserData) {
-	acceptFriend(friend)
-}
+watch(
+	userCredentials,
+	() => {
+		if (userCredentials.value === undefined) {
+			userFriends.value = []
+			loading.value = false
+		} else if (userCredentials.value === null) {
+			userFriends.value = []
+			loading.value = false
+		} else {
+			loadFriends(true)
+		}
+	},
+	{ immediate: true },
+)

-function removeFriend(friend: FriendWithUserData) {
-	removeFriendRecord(friend)
-}
+const unlisten = await friend_listener(() => loadFriends())
+onUnmounted(() => {
+	unlisten()
+})

 const messages = defineMessages({
 	addFriend: {
@@ -249,7 +288,7 @@ const messages = defineMessages({
 			</div>
 		</div>
 	</ModalWrapper>
-	<div v-if="userCredentials && !loading" class="flex gap-1 items-center mb-3 -ml-1">
+	<div v-if="userCredentials && !loading" class="flex gap-1 items-center mb-3 ml-2 mr-1">
 		<template v-if="sortedFriends.length > 0">
 			<ButtonStyled circular type="transparent">
 				<button
@@ -262,16 +301,15 @@ const messages = defineMessages({
 			</ButtonStyled>
 			<StyledInput
 				v-model="search"
-				:icon="SearchIcon"
 				type="text"
 				:placeholder="formatMessage(messages.searchFriends)"
 				clearable
-				input-class="!bg-transparent !border !border-solid !border-button-bg !text-primary !placeholder:text-primary"
-				wrapper-class="flex-1 [&>svg]:!text-primary [&>svg]:!opacity-100"
+				variant="outlined"
+				wrapper-class="flex-1"
 				@keyup.esc="search = ''"
 			/>
 		</template>
-		<h3 v-else class="w-full text-base text-primary font-medium m-0">
+		<h3 v-else class="ml-2 w-full text-base text-primary font-medium m-0">
 			{{ formatMessage(messages.friends) }}
 		</h3>
 		<ButtonStyled v-if="incomingRequests.length > 0" circular type="transparent">
@@ -293,11 +331,11 @@ const messages = defineMessages({
 		</ButtonStyled>
 	</div>
 	<div class="flex flex-col gap-3">
-		<h3 v-if="loading" class="text-base text-primary font-medium m-0">
+		<h3 v-if="loading" class="ml-4 mr-1 text-base text-primary font-medium m-0">
 			{{ formatMessage(messages.friends) }}
 		</h3>
 		<template v-if="loading">
-			<div v-for="n in 5" :key="n" class="flex gap-2 items-center animate-pulse">
+			<div v-for="n in 5" :key="n" class="flex gap-2 items-center animate-pulse ml-4 mr-1">
 				<div class="min-w-9 min-h-9 bg-button-bg rounded-full"></div>
 				<div class="flex flex-col w-full">
 					<div class="h-3 bg-button-bg rounded-full w-1/2 mb-1"></div>
@@ -306,7 +344,7 @@ const messages = defineMessages({
 			</div>
 		</template>
 		<template v-else-if="sortedFriends.length === 0">
-			<div class="text-sm">
+			<div class="text-sm ml-4 mr-1">
 				<div v-if="!userCredentials">
 					<IntlFormatted :message-id="messages.signInToAddFriends">
 						<template #link="{ children }">
@@ -355,6 +393,7 @@ const messages = defineMessages({
 			<FriendsSection
 				v-if="pendingFriends.length > 0"
 				:is-searching="!!search"
+				open-by-default
 				:friends="pendingFriends"
 				:heading="formatMessage(messages.pending)"
 				:remove-friend="removeFriend"
@@ -8,14 +8,13 @@ import {
 	OverflowMenu,
 	useVIntl,
 } from '@modrinth/ui'
+import { openUrl } from '@tauri-apps/plugin-opener'
 import { useTemplateRef } from 'vue'
-import { useRouter } from 'vue-router'

 import ContextMenu from '@/components/ui/ContextMenu.vue'
 import type { FriendWithUserData } from '@/helpers/friends.ts'

 const { formatMessage } = useVIntl()
-const router = useRouter()

 const props = withDefaults(
 	defineProps<{
@@ -55,7 +54,7 @@ function createContextMenuOptions(friend: FriendWithUserData) {
 }

 function openProfile(username: string) {
-	void router.push(`/user/${encodeURIComponent(username)}`)
+	openUrl('https://modrinth.com/user/' + username)
 }

 const friendOptions = useTemplateRef('friendOptions')
@@ -107,7 +106,7 @@ const messages = defineMessages({
 		:open-by-default="openByDefault"
 		:force-open="isSearching"
 		:button-class="
-			'flex w-full items-center bg-transparent border-0 p-0' +
+			'pl-4 pr-3 flex w-full items-center bg-transparent border-0 p-0' +
 			(isSearching
 				? ''
 				: ' cursor-pointer hover:brightness-[--hover-brightness] active:scale-[0.98] transition-all')
@@ -123,46 +122,45 @@ const messages = defineMessages({
 				<div
 					v-for="friend in friends"
 					:key="friend.username"
-					class="group grid items-center grid-cols-[1fr_auto] gap-2 hover:bg-button-bg transition-colors rounded-full mr-1"
+					class="group grid items-center grid-cols-[auto_1fr_auto] gap-2 hover:bg-button-bg transition-colors rounded-full ml-4 mr-1"
 					@contextmenu.prevent.stop="
 						(event) => friendOptions?.showMenu(event, friend, createContextMenuOptions(friend))
 					"
 				>
-					<RouterLink
-						:to="`/user/${encodeURIComponent(friend.username)}`"
-						class="grid min-w-0 grid-cols-[auto_1fr] items-center gap-2 text-inherit no-underline"
-					>
-						<div class="relative">
-							<Avatar
-								:src="friend.avatar"
-								:class="{ grayscale: !friend.online && friend.accepted }"
-								class="w-12 h-12 rounded-full"
-								size="32px"
-								circle
-							/>
-							<span
-								v-if="friend.online"
-								aria-hidden="true"
-								class="bottom-[2px] right-[-2px] absolute w-3 h-3 bg-brand border-2 border-black border-solid rounded-full"
-							/>
-						</div>
-						<div class="flex flex-col">
-							<span
-								class="text-sm m-0"
-								:class="friend.online || !friend.accepted ? 'text-contrast' : 'text-primary'"
-							>
-								{{ friend.username }}
-							</span>
-							<span v-if="!friend.accepted" class="m-0 text-xs">
-								{{ formatMessage(messages.friendRequestSent) }}
-							</span>
-							<span v-else-if="friend.status" class="m-0 text-xs">{{ friend.status }}</span>
-						</div>
-					</RouterLink>
+					<div class="relative">
+						<Avatar
+							:src="friend.avatar"
+							:class="{ grayscale: !friend.online && friend.accepted }"
+							class="w-12 h-12 rounded-full"
+							size="32px"
+							circle
+						/>
+						<span
+							v-if="friend.online"
+							aria-hidden="true"
+							class="bottom-[2px] right-[-2px] absolute w-3 h-3 bg-brand border-2 border-black border-solid rounded-full"
+						/>
+					</div>
+					<div class="flex flex-col">
+						<span
+							class="text-sm m-0"
+							:class="friend.online || !friend.accepted ? 'text-contrast' : 'text-primary'"
+						>
+							{{ friend.username }}
+						</span>
+						<span v-if="!friend.accepted" class="m-0 text-xs">
+							{{ formatMessage(messages.friendRequestSent) }}
+						</span>
+						<span v-else-if="friend.status" class="m-0 text-xs">{{ friend.status }}</span>
+					</div>
 					<ButtonStyled v-if="friend.accepted" circular type="transparent">
 						<OverflowMenu
 							class="opacity-0 group-hover:opacity-100 transition-opacity"
 							:options="[
+								{
+									id: 'view-profile',
+									action: () => openProfile(friend.username),
+								},
 								{
 									id: 'remove-friend',
 									action: () => removeFriend(friend),
@@ -171,6 +169,10 @@ const messages = defineMessages({
 							]"
 						>
 							<MoreVerticalIcon />
+							<template #view-profile>
+								<UserIcon />
+								{{ formatMessage(messages.viewProfile) }}
+							</template>
 							<template #remove-friend>
 								<TrashIcon />
 								{{ formatMessage(messages.removeFriend) }}
@@ -7,28 +7,26 @@ import {
 	injectNotificationManager,
 	StyledInput,
 } from '@modrinth/ui'
-import { useQueryClient } from '@tanstack/vue-query'
 import { convertFileSrc } from '@tauri-apps/api/core'
 import { computed, ref } from 'vue'

 import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
 import { trackEvent } from '@/helpers/analytics'
-import { list } from '@/helpers/instance'
-import { add_server_to_instance, get_instance_worlds } from '@/helpers/worlds.ts'
+import { list } from '@/helpers/profile'
+import { add_server_to_profile, get_profile_worlds } from '@/helpers/worlds.ts'

 const { handleError } = injectNotificationManager()
-const queryClient = useQueryClient()

 const modal = ref()
 const searchFilter = ref('')
-const instances = ref([])
+const profiles = ref([])

 const serverName = ref('')
 const serverAddress = ref('')

-const shownInstances = computed(() =>
-	instances.value.filter((instance) => {
-		return instance.name.toLowerCase().includes(searchFilter.value.toLowerCase())
+const shownProfiles = computed(() =>
+	profiles.value.filter((profile) => {
+		return profile.name.toLowerCase().includes(searchFilter.value.toLowerCase())
 	}),
 )

@@ -38,15 +36,15 @@ defineExpose({
 		serverAddress.value = address
 		searchFilter.value = ''

-		const instanceValues = await list().catch(handleError)
+		const profilesVal = await list().catch(handleError)
 		await Promise.allSettled(
-			instanceValues.map(async (instance) => {
-				instance.adding = false
-				instance.added = false
+			profilesVal.map(async (profile) => {
+				profile.adding = false
+				profile.added = false

 				try {
-					const worlds = await get_instance_worlds(instance.id)
-					instance.added = worlds.some(
+					const worlds = await get_profile_worlds(profile.path)
+					profile.added = worlds.some(
 						(w) => w.type === 'server' && w.address === serverAddress.value,
 					)
 				} catch {
@@ -55,29 +53,28 @@ defineExpose({
 			}),
 		)

-		instances.value = instanceValues
+		profiles.value = profilesVal
 		modal.value.show()

 		trackEvent('AddServerToInstanceStart', { source: 'AddServerToInstanceModal' })
 	},
 })

-async function addServer(instance) {
-	instance.adding = true
+async function addServer(profile) {
+	profile.adding = true
 	try {
-		await add_server_to_instance(instance.id, serverName.value, serverAddress.value, 'prompt')
-		instance.added = true
-		await queryClient.invalidateQueries({ queryKey: ['worlds', instance.id] })
+		await add_server_to_profile(profile.path, serverName.value, serverAddress.value, 'prompt')
+		profile.added = true

 		trackEvent('AddServerToInstance', {
 			server_name: serverName.value,
-			instance_name: instance.name,
+			instance_name: profile.name,
 			source: 'AddServerToInstanceModal',
 		})
 	} catch (err) {
 		handleError(err)
 	}
-	instance.adding = false
+	profile.adding = false
 }
 </script>

@@ -94,26 +91,26 @@ async function addServer(instance) {
 			/>
 			<div class="max-h-[21rem] overflow-y-auto">
 				<div
-					v-for="instance in shownInstances"
-					:key="instance.id"
+					v-for="profile in shownProfiles"
+					:key="profile.path"
 					class="flex w-full items-center justify-between gap-2 bg-bg-raised text-icon shadow-none"
 				>
 					<router-link
 						class="btn btn-transparent p-2 text-left"
-						:to="`/instance/${encodeURIComponent(instance.id)}`"
+						:to="`/instance/${encodeURIComponent(profile.path)}`"
 						@click="modal.hide()"
 					>
 						<Avatar
-							:src="instance.icon_path ? convertFileSrc(instance.icon_path) : null"
+							:src="profile.icon_path ? convertFileSrc(profile.icon_path) : null"
 							class="mr-2 [--size:2rem]"
 						/>
-						{{ instance.name }}
+						{{ profile.name }}
 					</router-link>
 					<ButtonStyled>
-						<button :disabled="instance.added || instance.adding" @click="addServer(instance)">
-							<PlusIcon v-if="!instance.added && !instance.adding" />
-							<CheckIcon v-else-if="instance.added" />
-							{{ instance.adding ? 'Adding...' : instance.added ? 'Added' : 'Add' }}
+						<button :disabled="profile.added || profile.adding" @click="addServer(profile)">
+							<PlusIcon v-if="!profile.added && !profile.adding" />
+							<CheckIcon v-else-if="profile.added" />
+							{{ profile.adding ? 'Adding...' : profile.added ? 'Added' : 'Add' }}
 						</button>
 					</ButtonStyled>
 				</div>
@@ -0,0 +1,175 @@
+<template>
+	<ModalWrapper ref="incompatibleModal" header="Incompatibility warning" :on-hide="onInstall">
+		<div class="modal-body">
+			<p>
+				This {{ versions?.length > 0 ? 'project' : 'version' }} is not compatible with the instance
+				you're trying to install it on. Are you sure you want to continue? Dependencies will not be
+				installed.
+			</p>
+			<table>
+				<thead>
+					<tr class="header">
+						<th>{{ instance?.name }}</th>
+						<th>{{ project.title }}</th>
+					</tr>
+				</thead>
+				<tbody>
+					<tr class="content">
+						<td class="data">{{ instance?.loader }} {{ instance?.game_version }}</td>
+						<td>
+							<Combobox
+								v-if="versions?.length > 1"
+								v-model="selectedVersionId"
+								:options="versionOptions"
+								:searchable="true"
+								placeholder="Select version"
+								force-direction="up"
+								:max-height="150"
+							/>
+							<span v-else>
+								<span>{{ selectedVersionLabel }}</span>
+							</span>
+						</td>
+					</tr>
+				</tbody>
+			</table>
+			<div class="button-group">
+				<Button @click="() => incompatibleModal.hide()"><XIcon />Cancel</Button>
+				<Button color="primary" :disabled="installing" @click="install()">
+					<DownloadIcon /> {{ installing ? 'Installing' : 'Install' }}
+				</Button>
+			</div>
+		</div>
+	</ModalWrapper>
+</template>
+
+<script setup>
+import { DownloadIcon, XIcon } from '@modrinth/assets'
+import { Button, Combobox, formatLoader, injectNotificationManager, useVIntl } from '@modrinth/ui'
+import { computed, ref } from 'vue'
+
+import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
+import { trackEvent } from '@/helpers/analytics'
+import { add_project_from_version as installMod } from '@/helpers/profile'
+
+const { handleError } = injectNotificationManager()
+const { formatMessage } = useVIntl()
+
+const instance = ref(null)
+const project = ref(null)
+const versions = ref(null)
+const selectedVersion = ref(null)
+const incompatibleModal = ref(null)
+const installing = ref(false)
+
+const onInstall = ref(() => {})
+
+const selectedVersionLabel = computed(() => {
+	if (!selectedVersion.value) return ''
+	return `${selectedVersion.value.name} (${selectedVersion.value.loaders
+		.map((name) => formatLoader(formatMessage, name))
+		.join(', ')} - ${selectedVersion.value.game_versions.join(', ')})`
+})
+
+const versionOptions = computed(() =>
+	(versions.value ?? []).map((version) => ({
+		value: version.id,
+		label: `${version.name} (${version.loaders
+			.map((name) => formatLoader(formatMessage, name))
+			.join(', ')} - ${version.game_versions.join(', ')})`,
+	})),
+)
+
+const selectedVersionId = computed({
+	get: () => selectedVersion.value?.id ?? null,
+	set: (value) => {
+		if (!value) return
+		selectedVersion.value = (versions.value ?? []).find((version) => version.id === value) ?? null
+	},
+})
+
+defineExpose({
+	show: (instanceVal, projectVal, projectVersions, selected, callback) => {
+		instance.value = instanceVal
+		versions.value = projectVersions ?? []
+		selectedVersion.value = selected ?? projectVersions?.[0] ?? null
+
+		project.value = projectVal
+
+		onInstall.value = callback
+		installing.value = false
+
+		incompatibleModal.value.show()
+
+		trackEvent('ProjectInstallStart', { source: 'ProjectIncompatibilityWarningModal' })
+	},
+})
+
+const install = async () => {
+	installing.value = true
+	await installMod(instance.value.path, selectedVersion.value.id).catch(handleError)
+	installing.value = false
+	onInstall.value(selectedVersion.value.id)
+	incompatibleModal.value.hide()
+
+	trackEvent('ProjectInstall', {
+		loader: instance.value.loader,
+		game_version: instance.value.game_version,
+		id: project.value,
+		version_id: selectedVersion.value.id,
+		project_type: project.value.project_type,
+		title: project.value.title,
+		source: 'ProjectIncompatibilityWarningModal',
+	})
+}
+</script>
+
+<style lang="scss" scoped>
+.data {
+	text-transform: capitalize;
+}
+
+table {
+	width: 100%;
+	border-radius: var(--radius-lg);
+	border-collapse: collapse;
+	box-shadow: 0 0 0 1px var(--color-button-bg);
+}
+
+th {
+	text-align: left;
+	padding: 1rem;
+	background-color: var(--color-bg);
+	overflow: hidden;
+	border-bottom: 1px solid var(--color-button-bg);
+}
+
+th:first-child {
+	border-top-left-radius: var(--radius-lg);
+	border-right: 1px solid var(--color-button-bg);
+}
+
+th:last-child {
+	border-top-right-radius: var(--radius-lg);
+}
+
+td {
+	padding: 1rem;
+}
+
+td:first-child {
+	border-right: 1px solid var(--color-button-bg);
+}
+
+.button-group {
+	display: flex;
+	justify-content: flex-end;
+	gap: 1rem;
+}
+
+.modal-body {
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+}
+</style>
@@ -0,0 +1,418 @@
+<script setup>
+import {
+	CheckIcon,
+	DownloadIcon,
+	PlusIcon,
+	RightArrowIcon,
+	SearchIcon,
+	UploadIcon,
+	XIcon,
+} from '@modrinth/assets'
+import { Avatar, Button, Card, injectNotificationManager, StyledInput } from '@modrinth/ui'
+import { convertFileSrc } from '@tauri-apps/api/core'
+import { open } from '@tauri-apps/plugin-dialog'
+import { computed, ref } from 'vue'
+import { useRouter } from 'vue-router'
+
+import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
+import { trackEvent } from '@/helpers/analytics'
+import { get_project_v3_many } from '@/helpers/cache.js'
+import {
+	add_project_from_version as installMod,
+	check_installed,
+	create,
+	get,
+	list,
+} from '@/helpers/profile'
+import {
+	findPreferredVersion,
+	installVersionDependencies,
+	isVersionCompatible,
+} from '@/store/install.js'
+
+const { handleError } = injectNotificationManager()
+const router = useRouter()
+
+const versions = ref()
+const project = ref()
+
+const installModal = ref()
+const searchFilter = ref('')
+
+const showCreation = ref(false)
+const icon = ref(null)
+const name = ref(null)
+const display_icon = ref(null)
+const loader = ref(null)
+const gameVersion = ref(null)
+const creatingInstance = ref(false)
+
+const profiles = ref([])
+
+const shownProfiles = computed(() =>
+	profiles.value.filter((profile) => {
+		return profile.name.toLowerCase().includes(searchFilter.value.toLowerCase())
+	}),
+)
+
+const isProfileCompatible = (profile) =>
+	versions.value?.some((version) => isVersionCompatible(version, project.value, profile))
+
+const onInstall = ref(() => {})
+
+defineExpose({
+	show: async (projectVal, versionsVal, callback) => {
+		project.value = projectVal
+		versions.value = versionsVal
+		searchFilter.value = ''
+
+		showCreation.value = false
+		name.value = null
+		icon.value = null
+		display_icon.value = null
+		gameVersion.value = null
+		loader.value = null
+
+		onInstall.value = callback
+
+		const profilesVal = await list().catch(handleError)
+		for (const profile of profilesVal) {
+			profile.installing = false
+			profile.installedMod = await check_installed(profile.path, project.value.id).catch(
+				handleError,
+			)
+		}
+
+		const linkedProjectIds = profilesVal
+			.filter((p) => p.linked_data?.project_id)
+			.map((p) => p.linked_data.project_id)
+		if (linkedProjectIds.length > 0) {
+			const linkedProjects = await get_project_v3_many(linkedProjectIds, 'must_revalidate').catch(
+				() => [],
+			)
+			const serverProjectIds = new Set(
+				linkedProjects.filter((p) => p?.minecraft_server != null).map((p) => p.id),
+			)
+			for (const profile of profilesVal) {
+				profile.isServerInstance = serverProjectIds.has(profile.linked_data?.project_id)
+			}
+		}
+
+		profiles.value = profilesVal
+
+		installModal.value.show()
+
+		trackEvent('ProjectInstallStart', { source: 'ProjectInstallModal' })
+	},
+})
+
+async function install(instance) {
+	instance.installing = true
+	const version = findPreferredVersion(versions.value, project.value, instance)
+
+	if (!version) {
+		instance.installing = false
+		handleError('No compatible version found')
+		return
+	}
+
+	await installMod(instance.path, version.id).catch(handleError)
+	await installVersionDependencies(instance, version).catch(handleError)
+
+	instance.installedMod = true
+	instance.installing = false
+
+	trackEvent('ProjectInstall', {
+		loader: instance.loader,
+		game_version: instance.game_version,
+		id: project.value.id,
+		version_id: version.id,
+		project_type: project.value.project_type,
+		title: project.value.title,
+		source: 'ProjectInstallModal',
+	})
+
+	onInstall.value(version.id)
+}
+
+const toggleCreation = () => {
+	showCreation.value = !showCreation.value
+	name.value = null
+	icon.value = null
+	display_icon.value = null
+	gameVersion.value = null
+	loader.value = null
+
+	if (showCreation.value) {
+		trackEvent('InstanceCreateStart', { source: 'ProjectInstallModal' })
+	}
+}
+
+const upload_icon = async () => {
+	const res = await open({
+		multiple: false,
+		filters: [
+			{
+				name: 'Image',
+				extensions: ['png', 'jpeg'],
+			},
+		],
+	})
+	icon.value = res.path ?? res
+
+	if (!icon.value) return
+	display_icon.value = convertFileSrc(icon.value)
+}
+
+const reset_icon = () => {
+	icon.value = null
+	display_icon.value = null
+}
+
+const createInstance = async () => {
+	creatingInstance.value = true
+
+	const gameVersions = versions.value[0].game_versions
+	const gameVersion = gameVersions[0]
+
+	const loaders = versions.value[0].loaders
+	const loader = loaders.includes('fabric')
+		? 'fabric'
+		: loaders.includes('neoforge')
+			? 'neoforge'
+			: loaders.includes('forge')
+				? 'forge'
+				: loaders.includes('quilt')
+					? 'quilt'
+					: 'vanilla'
+
+	const id = await create(name.value, gameVersion, loader, 'latest', icon.value).catch(handleError)
+
+	await installMod(id, versions.value[0].id).catch(handleError)
+
+	await router.push(`/instance/${encodeURIComponent(id)}/`)
+
+	const instance = await get(id, true)
+	await installVersionDependencies(instance, versions.value[0]).catch(handleError)
+
+	trackEvent('InstanceCreate', {
+		profile_name: name.value,
+		game_version: versions.value[0].game_versions[0],
+		loader: loader,
+		loader_version: 'latest',
+		has_icon: !!icon.value,
+		source: 'ProjectInstallModal',
+	})
+
+	trackEvent('ProjectInstall', {
+		loader: loader,
+		game_version: versions.value[0].game_versions[0],
+		id: project.value,
+		version_id: versions.value[0].id,
+		project_type: project.value.project_type,
+		title: project.value.title,
+		source: 'ProjectInstallModal',
+	})
+
+	onInstall.value(versions.value[0].id)
+
+	if (installModal.value) installModal.value.hide()
+	creatingInstance.value = false
+}
+</script>
+
+<template>
+	<ModalWrapper ref="installModal" header="Install project to instance" :on-hide="onInstall">
+		<div class="modal-body">
+			<StyledInput
+				v-model="searchFilter"
+				:icon="SearchIcon"
+				type="search"
+				placeholder="Search for an instance"
+				autocomplete="off"
+			/>
+			<div class="profiles" :class="{ 'hide-creation': !showCreation }">
+				<div v-for="profile in shownProfiles" :key="profile.name" class="option">
+					<router-link
+						class="btn btn-transparent profile-button"
+						:to="`/instance/${encodeURIComponent(profile.path)}`"
+						@click="installModal.hide()"
+					>
+						<Avatar
+							:src="profile.icon_path ? convertFileSrc(profile.icon_path) : null"
+							class="profile-image"
+						/>
+						{{ profile.name }}
+					</router-link>
+					<div
+						v-tooltip="
+							profile.linked_data?.locked && !profile.installedMod
+								? 'Unpair or unlock an instance to add mods.'
+								: ''
+						"
+					>
+						<Button
+							:disabled="
+								!isProfileCompatible(profile) || profile.installedMod || profile.installing
+							"
+							@click="install(profile)"
+						>
+							<DownloadIcon
+								v-if="isProfileCompatible(profile) && !profile.installedMod && !profile.installing"
+							/>
+							<CheckIcon v-else-if="profile.installedMod" />
+							{{
+								profile.installing
+									? 'Installing...'
+									: profile.installedMod
+										? 'Installed'
+										: !isProfileCompatible(profile)
+											? 'Incompatible'
+											: 'Install'
+							}}
+						</Button>
+					</div>
+				</div>
+			</div>
+			<Card v-if="showCreation" class="creation-card">
+				<div class="creation-container">
+					<div class="creation-icon">
+						<Avatar size="md" class="icon" :src="display_icon" />
+						<div class="creation-icon__description">
+							<Button @click="upload_icon()">
+								<UploadIcon />
+								<span class="no-wrap"> Select icon </span>
+							</Button>
+							<Button :disabled="!display_icon" @click="reset_icon()">
+								<XIcon />
+								<span class="no-wrap"> Remove icon </span>
+							</Button>
+						</div>
+					</div>
+					<div class="creation-settings">
+						<StyledInput
+							v-model="name"
+							autocomplete="off"
+							type="text"
+							placeholder="Name"
+							class="creation-input"
+						/>
+						<Button :disabled="creatingInstance === true || !name" @click="createInstance()">
+							<RightArrowIcon />
+							{{ creatingInstance ? 'Creating...' : 'Create' }}
+						</Button>
+					</div>
+				</div>
+			</Card>
+			<div class="input-group push-right">
+				<Button :color="showCreation ? '' : 'primary'" @click="toggleCreation()">
+					<PlusIcon />
+					{{ showCreation ? 'Hide New Instance' : 'Create new instance' }}
+				</Button>
+				<Button @click="installModal.hide()">Cancel</Button>
+			</div>
+		</div>
+	</ModalWrapper>
+</template>
+
+<style scoped lang="scss">
+.creation-card {
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+	margin: 0;
+	background-color: var(--color-bg);
+}
+
+.creation-container {
+	display: flex;
+	flex-direction: row;
+	gap: 1rem;
+}
+
+.creation-icon {
+	display: flex;
+	flex-direction: row;
+	gap: 1rem;
+	align-items: center;
+	flex-grow: 1;
+
+	.creation-icon__description {
+		display: flex;
+		flex-direction: column;
+		gap: 0.5rem;
+	}
+}
+
+.creation-input {
+	width: 100%;
+}
+
+.no-wrap {
+	white-space: nowrap;
+}
+
+.creation-dropdown {
+	width: min-content !important;
+	display: flex;
+	flex-direction: column;
+	gap: 0.5rem;
+}
+
+.creation-settings {
+	width: 100%;
+	margin-left: 0.5rem;
+	display: flex;
+	flex-direction: column;
+	gap: 0.5rem;
+	justify-content: center;
+}
+
+.modal-body {
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+	min-width: 350px;
+}
+
+.profiles {
+	max-height: 12rem;
+	overflow-y: auto;
+
+	&.hide-creation {
+		max-height: 21rem;
+	}
+}
+
+.option {
+	width: calc(100%);
+	background: var(--color-raised-bg);
+	color: var(--color-base);
+	box-shadow: none;
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	align-items: center;
+	gap: 0.5rem;
+
+	img {
+		margin-right: 0.5rem;
+	}
+
+	.name {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+	}
+
+	.profile-button {
+		align-content: start;
+		padding: 0.5rem;
+		text-align: left;
+	}
+}
+
+.profile-image {
+	--size: 2rem !important;
+}
+</style>
@@ -1,65 +0,0 @@
-<template>
-	<UnknownFileWarningModal
-		ref="modal"
-		:mode="externalFilesInModpack.length > 0 ? 'modpack' : 'mod'"
-		:file-name="fileName"
-		:external-files-in-modpack="externalFilesInModpack"
-		@cancel="reset"
-		@continue="proceed"
-	/>
-</template>
-
-<script setup lang="ts">
-import { UnknownFileWarningModal } from '@modrinth/ui'
-import { ref, useTemplateRef } from 'vue'
-
-import { get as getSettings, set as setSettings } from '@/helpers/settings'
-import { useTheming } from '@/store/state'
-import type { FeatureFlag } from '@/store/theme.ts'
-
-const themeStore = useTheming()
-const skipUnknownPackWarningFeatureFlag = 'skip_unknown_pack_warning' as FeatureFlag
-
-const modal = useTemplateRef('modal')
-const onProceed = ref<() => Promise<void>>()
-const fileName = ref('')
-const externalFilesInModpack = ref<string[]>([])
-
-function show(
-	createInstance: () => Promise<void>,
-	selectedFileName = '',
-	selectedExternalFiles: string[] = [],
-) {
-	onProceed.value = createInstance
-	fileName.value = selectedFileName
-	externalFilesInModpack.value = selectedExternalFiles
-
-	if (themeStore.getFeatureFlag(skipUnknownPackWarningFeatureFlag)) {
-		void createInstance()
-		return
-	}
-
-	modal.value?.show()
-}
-
-function reset() {
-	onProceed.value = undefined
-	fileName.value = ''
-	externalFilesInModpack.value = []
-}
-
-async function proceed(dontShowAgain: boolean) {
-	if (dontShowAgain) {
-		themeStore.featureFlags[skipUnknownPackWarningFeatureFlag] = true
-		const settings = await getSettings()
-		settings.feature_flags[skipUnknownPackWarningFeatureFlag] = true
-		await setSettings(settings)
-	}
-
-	const createInstance = onProceed.value
-	reset()
-	if (createInstance) void createInstance()
-}
-
-defineExpose({ show })
-</script>
@@ -1,409 +0,0 @@
-<template>
-	<PageHeader :title="instance.name">
-		<template #leading>
-			<Avatar :src="iconSrc" :alt="instance.name" size="64px" :tint-by="instance.id" />
-		</template>
-
-		<template v-if="instance.shared_instance || instance.quarantined" #badges>
-			<PageHeaderBadgeItem
-				v-if="instance.quarantined"
-				:icon="LockIcon"
-				aria-label="Locked instance information"
-				class="!border-orange !bg-highlight-orange !text-orange"
-			>
-				Locked
-			</PageHeaderBadgeItem>
-			<PageHeaderBadgeItem
-				v-else
-				:tooltip="sharedInstanceTooltip"
-				aria-label="Shared instance information"
-				class="!border-blue !bg-highlight-blue !text-blue"
-			>
-				Shared
-				<UnknownIcon class="block size-4 shrink-0 text-current" aria-hidden="true" />
-			</PageHeaderBadgeItem>
-		</template>
-
-		<template #metadata>
-			<div v-if="isServerInstance" class="flex flex-wrap items-center gap-2">
-				<InstanceHeaderServerMetadata
-					:loading-server-ping="loadingServerPing"
-					:players-online="playersOnline"
-					:status-online="statusOnline"
-					:recent-plays="recentPlays"
-					:ping="ping"
-					:minecraft-server="minecraftServer"
-					:linked-project-v3="linkedProjectV3"
-					:instance-id="instance.id"
-				/>
-				<PageHeaderMetadataItem v-if="sharedInstanceManager" :action="sharedInstanceManagerAction">
-					{{ sharedInstanceManagerLabel }}
-					<Avatar
-						:src="sharedInstanceManager.avatarUrl"
-						:alt="sharedInstanceManager.name"
-						:tint-by="sharedInstanceManager.tintBy"
-						size="24px"
-						:circle="sharedInstanceManager.type === 'user'"
-						no-shadow
-					/>
-					<span class="min-w-0 truncate">{{ sharedInstanceManager.name }}</span>
-				</PageHeaderMetadataItem>
-			</div>
-			<PageHeaderMetadata v-else>
-				<PageHeaderMetadataItem :icon="Gamepad2Icon" tooltip="Minecraft version">
-					Minecraft {{ instance.game_version }}
-				</PageHeaderMetadataItem>
-				<PageHeaderMetadataItem
-					v-if="sharedInstanceManager?.type !== 'user'"
-					:icon="ServerLoaderIcon"
-					:icon-props="{ loader: loaderDisplayName }"
-					tooltip="Mod loader"
-				>
-					{{ loaderLabel }}
-				</PageHeaderMetadataItem>
-				<PageHeaderMetadataItem
-					v-if="showInstancePlayTime"
-					:icon="TimerIcon"
-					tooltip="Total playtime"
-				>
-					{{ playtimeLabel }}
-				</PageHeaderMetadataItem>
-				<PageHeaderMetadataItem v-if="sharedInstanceManager" :action="sharedInstanceManagerAction">
-					{{ sharedInstanceManagerLabel }}
-					<Avatar
-						:src="sharedInstanceManager.avatarUrl"
-						:alt="sharedInstanceManager.name"
-						:tint-by="sharedInstanceManager.tintBy"
-						size="24px"
-						:circle="sharedInstanceManager.type === 'user'"
-						no-shadow
-					/>
-					<span class="min-w-0 truncate">{{ sharedInstanceManager.name }}</span>
-				</PageHeaderMetadataItem>
-			</PageHeaderMetadata>
-		</template>
-
-		<template #actions>
-			<PageHeaderActions>
-				<ButtonStyled v-if="isInstalling" color="brand" size="large">
-					<button type="button" disabled>
-						{{ formatMessage(commonMessages.installingLabel) }}
-					</button>
-				</ButtonStyled>
-				<ButtonStyled v-else-if="playing" color="red" size="large">
-					<button type="button" :disabled="stopping" @click="emit('stop')">
-						<StopCircleIcon />
-						{{
-							stopping ? formatMessage(messages.stopping) : formatMessage(commonMessages.stopButton)
-						}}
-					</button>
-				</ButtonStyled>
-				<ButtonStyled v-else-if="instance.quarantined" color="brand" size="large">
-					<button v-tooltip="formatMessage(messages.lockedPlayTooltip)" type="button" disabled>
-						<PlayIcon />
-						{{ formatMessage(commonMessages.playButton) }}
-					</button>
-				</ButtonStyled>
-				<ButtonStyled v-else-if="instance.install_stage !== 'installed'" color="brand" size="large">
-					<button type="button" @click="emit('repair')">
-						<DownloadIcon />
-						{{ formatMessage(messages.repair) }}
-					</button>
-				</ButtonStyled>
-				<JoinedButtons
-					v-else-if="!loading && isServerInstance"
-					:actions="serverPlayActions"
-					color="brand"
-					size="large"
-				/>
-				<ButtonStyled v-else-if="!loading" color="brand" size="large">
-					<button type="button" @click="emit('play')">
-						<PlayIcon />
-						{{ formatMessage(commonMessages.playButton) }}
-					</button>
-				</ButtonStyled>
-				<ButtonStyled v-else color="brand" size="large">
-					<button type="button" disabled>{{ formatMessage(messages.starting) }}</button>
-				</ButtonStyled>
-
-				<ButtonStyled circular size="large">
-					<button
-						v-tooltip="formatMessage(messages.instanceSettings)"
-						type="button"
-						:aria-label="formatMessage(messages.instanceSettings)"
-						@click="emit('settings')"
-					>
-						<SettingsIcon />
-					</button>
-				</ButtonStyled>
-				<ButtonStyled circular size="large" type="transparent">
-					<TeleportOverflowMenu
-						:options="moreActions"
-						:tooltip="formatMessage(messages.moreActions)"
-						:aria-label="formatMessage(messages.moreActions)"
-					>
-						<MoreVerticalIcon />
-					</TeleportOverflowMenu>
-				</ButtonStyled>
-			</PageHeaderActions>
-		</template>
-	</PageHeader>
-</template>
-
-<script setup lang="ts">
-import type { Labrinth } from '@modrinth/api-client'
-import {
-	DownloadIcon,
-	ExternalIcon,
-	FolderOpenIcon,
-	LockIcon,
-	MoreVerticalIcon,
-	PackageIcon,
-	PlayIcon,
-	ReportIcon,
-	SettingsIcon,
-	StopCircleIcon,
-	TagCategoryGamepad2Icon as Gamepad2Icon,
-	TimerIcon,
-	UnknownIcon,
-} from '@modrinth/assets'
-import {
-	Avatar,
-	ButtonStyled,
-	commonMessages,
-	defineMessages,
-	formatLoaderLabel,
-	type JoinedButtonAction,
-	JoinedButtons,
-	LoaderIcon as ServerLoaderIcon,
-	PageHeader,
-	PageHeaderActions,
-	PageHeaderBadgeItem,
-	PageHeaderMetadata,
-	PageHeaderMetadataItem,
-	type ServerLoader,
-	TeleportOverflowMenu,
-	type TeleportOverflowMenuItem,
-	useVIntl,
-} from '@modrinth/ui'
-import { computed } from 'vue'
-import { useRouter } from 'vue-router'
-
-import type { GameInstance } from '@/helpers/types'
-
-import InstanceHeaderServerMetadata from './instance-page-header-server-metadata.vue'
-
-const messages = defineMessages({
-	createShortcut: {
-		id: 'instance.action.create-shortcut',
-		defaultMessage: 'Create shortcut',
-	},
-	exportModpack: {
-		id: 'instance.action.export-modpack',
-		defaultMessage: 'Export modpack',
-	},
-	instanceSettings: {
-		id: 'instance.action.settings',
-		defaultMessage: 'Instance settings',
-	},
-	launchInstance: {
-		id: 'instance.action.launch-instance',
-		defaultMessage: 'Launch instance',
-	},
-	moreActions: {
-		id: 'instance.action.more-actions',
-		defaultMessage: 'More actions',
-	},
-	neverPlayed: {
-		id: 'instance.playtime.never-played',
-		defaultMessage: 'Never played',
-	},
-	openFolder: {
-		id: 'instance.action.open-folder',
-		defaultMessage: 'Open folder',
-	},
-	repair: {
-		id: 'instance.action.repair',
-		defaultMessage: 'Repair',
-	},
-	lockedPlayTooltip: {
-		id: 'instance.locked.play-tooltip',
-		defaultMessage: 'This instance has been locked',
-	},
-	starting: {
-		id: 'instance.action.starting',
-		defaultMessage: 'Starting...',
-	},
-	stopping: {
-		id: 'instance.action.stopping',
-		defaultMessage: 'Stopping...',
-	},
-	sharedInstanceTooltip: {
-		id: 'instance.shared-instance.tooltip',
-		defaultMessage: "This instance's content is being managed by someone else.",
-	},
-	sharedInstanceOwnerTooltip: {
-		id: 'instance.shared-instance.owner-tooltip',
-		defaultMessage: "This instance's content is being shared to other users.",
-	},
-})
-const router = useRouter()
-
-const props = withDefaults(
-	defineProps<{
-		instance: GameInstance
-		iconSrc?: string | null
-		isServerInstance?: boolean
-		showInstancePlayTime?: boolean
-		timePlayed?: number
-		playing?: boolean
-		loading?: boolean
-		stopping?: boolean
-		loadingServerPing?: boolean
-		playersOnline?: number
-		statusOnline?: boolean
-		recentPlays?: number
-		ping?: number
-		minecraftServer?: Labrinth.Projects.v3.Project['minecraft_server']
-		linkedProjectV3?: Labrinth.Projects.v3.Project
-		sharedInstanceManager?: {
-			type: 'user' | 'server'
-			name: string
-			avatarUrl?: string
-			tintBy: string
-		} | null
-	}>(),
-	{
-		iconSrc: null,
-		isServerInstance: false,
-		showInstancePlayTime: false,
-		timePlayed: 0,
-		playing: false,
-		loading: false,
-		stopping: false,
-		loadingServerPing: false,
-		playersOnline: undefined,
-		statusOnline: false,
-		recentPlays: undefined,
-		ping: undefined,
-		minecraftServer: undefined,
-		linkedProjectV3: undefined,
-		sharedInstanceManager: null,
-	},
-)
-
-const emit = defineEmits<{
-	repair: []
-	stop: []
-	play: []
-	playServer: []
-	settings: []
-	openFolder: []
-	export: []
-	createShortcut: []
-	report: [event?: MouseEvent]
-}>()
-
-const installingStages = [
-	'installing',
-	'pack_installing',
-	'pack_installed',
-	'not_installed',
-	'minecraft_installing',
-]
-
-const { formatMessage } = useVIntl()
-
-const isInstalling = computed(() => installingStages.includes(props.instance.install_stage))
-const loaderDisplayName = computed(() => formatLoaderLabel(props.instance.loader) as ServerLoader)
-const loaderLabel = computed(() =>
-	[loaderDisplayName.value, props.instance.loader_version].filter(Boolean).join(' '),
-)
-const sharedInstanceTooltip = computed(() =>
-	formatMessage(
-		props.instance.shared_instance?.role === 'owner'
-			? messages.sharedInstanceOwnerTooltip
-			: messages.sharedInstanceTooltip,
-	),
-)
-const sharedInstanceManagerLabel = computed(() =>
-	props.sharedInstanceManager?.type === 'server' ? 'Linked to' : 'Managed by',
-)
-const sharedInstanceManagerAction = computed(() => {
-	const manager = props.sharedInstanceManager
-	if (manager?.type !== 'user') return undefined
-	return () => router.push(`/user/${encodeURIComponent(manager.name)}`)
-})
-const playtimeLabel = computed(() => {
-	if (props.timePlayed <= 0) return formatMessage(messages.neverPlayed)
-
-	const hours = Math.floor(props.timePlayed / 3600)
-	if (hours >= 1) {
-		return `${hours} hour${hours > 1 ? 's' : ''}`
-	}
-
-	const minutes = Math.floor(props.timePlayed / 60)
-	if (minutes >= 1) {
-		return `${minutes} minute${minutes > 1 ? 's' : ''}`
-	}
-
-	const seconds = Math.floor(props.timePlayed)
-	return `${seconds} second${seconds > 1 ? 's' : ''}`
-})
-const serverPlayActions = computed<JoinedButtonAction[]>(() => [
-	{
-		id: 'join_server',
-		label: formatMessage(commonMessages.playButton),
-		icon: PlayIcon,
-		action: () => emit('playServer'),
-	},
-	{
-		id: 'launch_instance',
-		label: formatMessage(messages.launchInstance),
-		icon: PlayIcon,
-		action: () => emit('play'),
-	},
-])
-const moreActions = computed<TeleportOverflowMenuItem[]>(() => {
-	const actions: TeleportOverflowMenuItem[] = [
-		{
-			id: 'open-folder',
-			label: formatMessage(messages.openFolder),
-			icon: FolderOpenIcon,
-			action: () => emit('openFolder'),
-		},
-	]
-
-	if (!props.instance.quarantined) {
-		actions.push(
-			{
-				id: 'export-mrpack',
-				label: formatMessage(messages.exportModpack),
-				icon: PackageIcon,
-				action: () => emit('export'),
-			},
-			{
-				id: 'create-shortcut',
-				label: formatMessage(messages.createShortcut),
-				icon: ExternalIcon,
-				action: () => emit('createShortcut'),
-			},
-		)
-	}
-
-	if (props.instance.shared_instance?.role === 'member') {
-		actions.push(
-			{ divider: true },
-			{
-				id: 'report-shared-instance',
-				label: formatMessage(commonMessages.reportButton),
-				icon: ReportIcon,
-				color: 'red',
-				action: (event) => emit('report', event),
-			},
-		)
-	}
-
-	return actions
-})
-</script>
@@ -1,63 +0,0 @@
-<template>
-	<div class="flex items-center flex-wrap gap-2">
-		<template v-if="loadingServerPing">
-			<ServerOnlinePlayers
-				v-if="playersOnline !== undefined"
-				:online="playersOnline"
-				:status-online="statusOnline"
-				hide-label
-			/>
-			<ServerRecentPlays :recent-plays="recentPlays ?? 0" hide-label />
-			<div
-				v-if="
-					(playersOnline !== undefined || recentPlays !== undefined) &&
-					(minecraftServer?.region || ping)
-				"
-				class="w-1.5 h-1.5 rounded-full bg-surface-5"
-			></div>
-			<ServerPing v-if="ping" :ping="ping" />
-		</template>
-
-		<ServerRegion v-if="minecraftServer?.region" :region="minecraftServer?.region" />
-
-		<div v-if="minecraftServer?.region || ping" class="w-1.5 h-1.5 rounded-full bg-surface-5"></div>
-
-		<div v-if="linkedProjectV3" class="flex gap-1.5 items-center font-medium text-primary">
-			Linked to
-			<Avatar
-				:src="linkedProjectV3.icon_url"
-				:alt="linkedProjectV3.name"
-				:tint-by="instanceId"
-				size="24px"
-			/>
-			<router-link
-				:to="`/project/${linkedProjectV3.slug ?? linkedProjectV3.id}`"
-				class="hover:underline text-primary truncate"
-			>
-				{{ linkedProjectV3.name }}
-			</router-link>
-		</div>
-	</div>
-</template>
-
-<script setup lang="ts">
-import type { Labrinth } from '@modrinth/api-client'
-import {
-	Avatar,
-	ServerOnlinePlayers,
-	ServerPing,
-	ServerRecentPlays,
-	ServerRegion,
-} from '@modrinth/ui'
-
-defineProps<{
-	loadingServerPing?: boolean
-	playersOnline?: number
-	statusOnline?: boolean
-	recentPlays?: number
-	ping?: number
-	minecraftServer?: Labrinth.Projects.v3.Project['minecraft_server']
-	linkedProjectV3?: Labrinth.Projects.v3.Project
-	instanceId?: string
-}>()
-</script>
@@ -1,141 +0,0 @@
-<template>
-	<StackedAdmonitions v-bind="$attrs" :items="stackItems" class="w-full">
-		<template #item="{ item, dismissible }">
-			<InstanceAdmonitionsSharedInstanceStale
-				v-if="item.kind === 'shared-instance-stale'"
-				:instance="instance"
-				@published="emit('published')"
-			/>
-			<InstanceAdmonitionsSharedInstanceUpdateAvailable
-				v-else-if="item.kind === 'shared-instance-update-available'"
-				:instance-name="instance.name"
-				@review="emit('review-update', $event)"
-			/>
-			<InstanceAdmonitionsSharedInstanceWrongAccount
-				v-else-if="item.kind === 'shared-instance-wrong-account'"
-				:expected-user-id="sharedInstanceExpectedUserId"
-				:role="sharedInstanceRole"
-				:signed-out="sharedInstanceSignedOut"
-			/>
-			<InstanceAdmonitionsSharedInstanceUnavailable
-				v-else-if="item.kind === 'shared-instance-unavailable'"
-				:reason="displayedSharedInstanceUnavailableReason"
-				:manager="sharedInstanceUnavailableManager"
-				:dismissible="dismissible"
-				@dismiss="sharedInstanceUnavailableDismissed = true"
-				@delete="emit('delete')"
-			/>
-		</template>
-	</StackedAdmonitions>
-</template>
-
-<script setup lang="ts">
-import { StackedAdmonitions } from '@modrinth/ui'
-import { computed, ref, watch } from 'vue'
-
-import type { SharedInstanceUnavailableReason } from '@/helpers/install'
-import type { GameInstance } from '@/helpers/types'
-
-import InstanceAdmonitionsSharedInstanceStale from './instance-admonitions-shared-instance-stale.vue'
-import InstanceAdmonitionsSharedInstanceUnavailable from './instance-admonitions-shared-instance-unavailable.vue'
-import InstanceAdmonitionsSharedInstanceUpdateAvailable from './instance-admonitions-shared-instance-update-available.vue'
-import InstanceAdmonitionsSharedInstanceWrongAccount from './instance-admonitions-shared-instance-wrong-account.vue'
-import type { InstanceAdmonitionItem, SharedInstanceRole } from './types'
-
-defineOptions({
-	inheritAttrs: false,
-})
-
-const props = defineProps<{
-	instance: GameInstance
-	sharedInstanceUnavailableReason?: SharedInstanceUnavailableReason | null
-	sharedInstanceUnavailableManager?: string | null
-	sharedInstanceWrongAccount?: boolean
-	sharedInstanceExpectedUserId?: string | null
-	sharedInstanceRole?: SharedInstanceRole | null
-	sharedInstanceSignedOut?: boolean
-	sharedInstanceUpdateAvailable?: boolean
-}>()
-
-const emit = defineEmits<{
-	published: []
-	delete: []
-	'review-update': [event: MouseEvent]
-}>()
-
-const sharedInstanceWrongAccount = computed(() => props.sharedInstanceWrongAccount ?? false)
-const displayedSharedInstanceUnavailableReason = computed<SharedInstanceUnavailableReason | null>(
-	() =>
-		props.instance.quarantined ? 'quarantined' : (props.sharedInstanceUnavailableReason ?? null),
-)
-const sharedInstanceUnavailableDismissed = ref(false)
-const showSharedInstancePublishAdmonition = computed(
-	() =>
-		!sharedInstanceWrongAccount.value &&
-		props.instance.install_stage === 'installed' &&
-		props.instance.shared_instance?.role === 'owner' &&
-		props.instance.shared_instance.status === 'stale',
-)
-const showSharedInstanceUpdateAdmonition = computed(
-	() =>
-		!sharedInstanceWrongAccount.value &&
-		!displayedSharedInstanceUnavailableReason.value &&
-		props.instance.install_stage === 'installed' &&
-		props.sharedInstanceRole === 'member' &&
-		props.sharedInstanceUpdateAvailable === true,
-)
-
-const stackItems = computed<InstanceAdmonitionItem[]>(() => {
-	const items: InstanceAdmonitionItem[] = []
-
-	if (sharedInstanceWrongAccount.value) {
-		items.push({
-			id: 'shared-instance-wrong-account',
-			type: 'warning',
-			dismissible: false,
-			kind: 'shared-instance-wrong-account',
-		})
-	}
-
-	const unavailableReason = displayedSharedInstanceUnavailableReason.value
-	const sharedInstanceQuarantined = unavailableReason === 'quarantined'
-	if (
-		unavailableReason &&
-		(sharedInstanceQuarantined || !sharedInstanceUnavailableDismissed.value)
-	) {
-		items.push({
-			id: 'shared-instance-unavailable',
-			type: 'warning',
-			dismissible: !sharedInstanceQuarantined,
-			kind: 'shared-instance-unavailable',
-		})
-	}
-
-	if (showSharedInstancePublishAdmonition.value) {
-		items.push({
-			id: 'shared-instance-stale',
-			type: 'warning',
-			dismissible: false,
-			kind: 'shared-instance-stale',
-		})
-	}
-
-	if (showSharedInstanceUpdateAdmonition.value) {
-		items.push({
-			id: 'shared-instance-update-available',
-			type: 'info',
-			dismissible: false,
-			kind: 'shared-instance-update-available',
-		})
-	}
-
-	return items
-})
-
-watch(
-	() => [props.instance.id, displayedSharedInstanceUnavailableReason.value],
-	() => {
-		sharedInstanceUnavailableDismissed.value = false
-	},
-)
-</script>
@@ -1,82 +0,0 @@
-import { defineMessages } from '@modrinth/ui'
-
-export const instanceAdmonitionsMessages = defineMessages({
-	sharedInstanceChangesHeader: {
-		id: 'app.instance.admonitions.shared-instance.changes-header',
-		defaultMessage: "Your changes haven't been shared yet",
-	},
-	sharedInstanceChangesBody: {
-		id: 'app.instance.admonitions.shared-instance.changes-body',
-		defaultMessage: "Your local instance is ahead of the users you've shared it with.",
-	},
-	sharedInstancePublishButton: {
-		id: 'app.instance.admonitions.shared-instance.publish-button',
-		defaultMessage: 'Push update',
-	},
-	sharedInstancePublishingButton: {
-		id: 'app.instance.admonitions.shared-instance.publishing-button',
-		defaultMessage: 'Pushing...',
-	},
-	sharedInstanceReviewingButton: {
-		id: 'app.instance.admonitions.shared-instance.reviewing-button',
-		defaultMessage: 'Reviewing...',
-	},
-	sharedInstanceUpdateAvailableHeader: {
-		id: 'app.instance.admonitions.shared-instance.update-available-header',
-		defaultMessage: 'An update is available',
-	},
-	sharedInstanceUpdateAvailableBody: {
-		id: 'app.instance.admonitions.shared-instance.update-available-body',
-		defaultMessage:
-			'An update is required to play {name}. Please update to latest version to launch the game.',
-	},
-	sharedInstanceReviewUpdateButton: {
-		id: 'app.instance.admonitions.shared-instance.review-update-button',
-		defaultMessage: 'Review update',
-	},
-	sharedInstanceReviewHeader: {
-		id: 'app.instance.admonitions.shared-instance.review-header',
-		defaultMessage: 'Review changes',
-	},
-	sharedInstanceReviewAdmonitionHeader: {
-		id: 'app.instance.admonitions.shared-instance.review-admonition-header',
-		defaultMessage: 'Push update',
-	},
-	sharedInstanceReviewDescription: {
-		id: 'app.instance.admonitions.shared-instance.review-description',
-		defaultMessage:
-			'Review the content changes that will be shared with everyone using this instance.',
-	},
-	sharedInstanceAddedLabel: {
-		id: 'app.instance.admonitions.shared-instance.added-label',
-		defaultMessage: 'Added',
-	},
-	sharedInstanceRemovedLabel: {
-		id: 'app.instance.admonitions.shared-instance.removed-label',
-		defaultMessage: 'Removed',
-	},
-	sharedInstanceWrongAccountHeader: {
-		id: 'app.instance.shared-instance-wrong-account.warning-header',
-		defaultMessage: 'You are using the wrong Modrinth account',
-	},
-	sharedInstanceSignedOutHeader: {
-		id: 'app.instance.shared-instance-wrong-account.signed-out-header',
-		defaultMessage: 'You need to sign in to Modrinth',
-	},
-	sharedInstanceWrongAccountSignInAs: {
-		id: 'app.instance.shared-instance-wrong-account.sign-in-as-label',
-		defaultMessage: 'Sign in as',
-	},
-	sharedInstanceWrongAccountUserBody: {
-		id: 'app.instance.shared-instance-wrong-account.user-admonition-body-v2',
-		defaultMessage: 'to receive updates for this shared instance.',
-	},
-	sharedInstanceWrongAccountOwnerBody: {
-		id: 'app.instance.shared-instance-wrong-account.owner-admonition-body-v2',
-		defaultMessage: "to manage this shared instance. You won't be able to push updates to users.",
-	},
-	sharedInstanceWrongAccountFallbackUsername: {
-		id: 'app.instance.shared-instance-wrong-account.fallback-username',
-		defaultMessage: 'the linked account',
-	},
-})
@@ -1,66 +0,0 @@
-<template>
-	<Admonition
-		type="info"
-		inline-actions
-		:header="formatMessage(messages.sharedInstanceChangesHeader)"
-	>
-		{{ formatMessage(messages.sharedInstanceChangesBody) }}
-		<template #actions>
-			<ButtonStyled color="blue">
-				<button class="!h-10" :disabled="isPublishButtonDisabled" @click="reviewChanges">
-					<SpinnerIcon
-						v-if="isReviewingPublish || isPublishing"
-						class="animate-spin"
-						aria-hidden="true"
-					/>
-					<UploadIcon v-else aria-hidden="true" />
-					{{
-						isPublishing
-							? formatMessage(messages.sharedInstancePublishingButton)
-							: isReviewingPublish
-								? formatMessage(messages.sharedInstanceReviewingButton)
-								: formatMessage(messages.sharedInstancePublishButton)
-					}}
-				</button>
-			</ButtonStyled>
-		</template>
-	</Admonition>
-
-	<SharedInstancePublishModal
-		ref="publishModal"
-		:instance="instance"
-		@published="emit('published')"
-		@state-change="publishState = $event"
-	/>
-</template>
-
-<script setup lang="ts">
-import { SpinnerIcon, UploadIcon } from '@modrinth/assets'
-import { Admonition, ButtonStyled, useVIntl } from '@modrinth/ui'
-import { computed, ref } from 'vue'
-
-import SharedInstancePublishModal from '@/components/ui/shared-instances/SharedInstancePublishModal.vue'
-import type { GameInstance } from '@/helpers/types'
-
-import { instanceAdmonitionsMessages as messages } from './instance-admonitions-messages'
-
-defineProps<{
-	instance: GameInstance
-}>()
-
-const emit = defineEmits<{
-	published: []
-}>()
-
-const { formatMessage } = useVIntl()
-const publishModal = ref<InstanceType<typeof SharedInstancePublishModal>>()
-const publishState = ref<'idle' | 'reviewing' | 'publishing'>('idle')
-const isPublishing = computed(() => publishState.value === 'publishing')
-const isReviewingPublish = computed(() => publishState.value === 'reviewing')
-
-const isPublishButtonDisabled = computed(() => isPublishing.value || isReviewingPublish.value)
-
-function reviewChanges(e?: MouseEvent) {
-	publishModal.value?.show(e)
-}
-</script>
@@ -1,51 +0,0 @@
-<template>
-	<Admonition
-		type="warning"
-		:inline-actions="reason === 'quarantined'"
-		:header="formatMessage(sharedInstanceUnavailableTitleMessage(reason ?? null))"
-		:dismissible="dismissible"
-		@dismiss="emit('dismiss')"
-	>
-		{{ formatSharedInstanceUnavailable(reason ?? null, manager) }}
-		<template v-if="reason === 'quarantined'" #actions>
-			<ButtonStyled color="orange">
-				<button class="!h-10" @click="emit('delete')">
-					<TrashIcon aria-hidden="true" />
-					{{ formatMessage(messages.deleteInstance) }}
-				</button>
-			</ButtonStyled>
-		</template>
-	</Admonition>
-</template>
-
-<script setup lang="ts">
-import { TrashIcon } from '@modrinth/assets'
-import { Admonition, ButtonStyled, defineMessages, useVIntl } from '@modrinth/ui'
-
-import type { SharedInstanceUnavailableReason } from '@/helpers/install'
-import {
-	sharedInstanceUnavailableTitleMessage,
-	useSharedInstanceErrors,
-} from '@/helpers/shared-instance-errors'
-
-defineProps<{
-	reason?: SharedInstanceUnavailableReason | null
-	manager?: string | null
-	dismissible?: boolean
-}>()
-
-const emit = defineEmits<{
-	dismiss: []
-	delete: []
-}>()
-
-const { formatMessage } = useVIntl()
-const { formatSharedInstanceUnavailable } = useSharedInstanceErrors()
-
-const messages = defineMessages({
-	deleteInstance: {
-		id: 'instance.locked.delete-button',
-		defaultMessage: 'Delete instance',
-	},
-})
-</script>
@@ -1,34 +0,0 @@
-<template>
-	<Admonition
-		type="info"
-		inline-actions
-		:header="formatMessage(messages.sharedInstanceUpdateAvailableHeader)"
-	>
-		{{ formatMessage(messages.sharedInstanceUpdateAvailableBody, { name: instanceName }) }}
-		<template #actions>
-			<ButtonStyled color="blue">
-				<button class="!h-10" @click="emit('review', $event)">
-					<DownloadIcon aria-hidden="true" />
-					{{ formatMessage(messages.sharedInstanceReviewUpdateButton) }}
-				</button>
-			</ButtonStyled>
-		</template>
-	</Admonition>
-</template>
-
-<script setup lang="ts">
-import { DownloadIcon } from '@modrinth/assets'
-import { Admonition, ButtonStyled, useVIntl } from '@modrinth/ui'
-
-import { instanceAdmonitionsMessages as messages } from './instance-admonitions-messages'
-
-defineProps<{
-	instanceName: string
-}>()
-
-const emit = defineEmits<{
-	review: [event: MouseEvent]
-}>()
-
-const { formatMessage } = useVIntl()
-</script>
@@ -1,78 +0,0 @@
-<template>
-	<Admonition type="warning" :header="formatMessage(headerMessage)">
-		<span class="flex flex-wrap items-center gap-x-1.5 gap-y-1">
-			<span>{{ formatMessage(messages.sharedInstanceWrongAccountSignInAs) }}</span>
-			<span
-				v-if="sharedInstanceExpectedUser"
-				class="inline-flex max-w-full min-w-0 items-center gap-1.5 align-middle font-semibold text-contrast"
-			>
-				<Avatar
-					:src="sharedInstanceExpectedUser.avatarUrl"
-					:alt="sharedInstanceExpectedUsername"
-					:tint-by="sharedInstanceExpectedUser.tintBy"
-					size="20px"
-					circle
-					no-shadow
-				/>
-				<span class="min-w-0 truncate">{{ sharedInstanceExpectedUsername }}</span>
-			</span>
-			<span v-else class="font-semibold">{{ sharedInstanceExpectedUsername }}</span>
-			<span>{{ formatMessage(bodyMessage) }}</span>
-		</span>
-	</Admonition>
-</template>
-
-<script setup lang="ts">
-import { Admonition, Avatar, useVIntl } from '@modrinth/ui'
-import { useQuery } from '@tanstack/vue-query'
-import { computed } from 'vue'
-
-import { get_user } from '@/helpers/cache'
-
-import { instanceAdmonitionsMessages as messages } from './instance-admonitions-messages'
-import type { SharedInstanceRole } from './types'
-
-const props = defineProps<{
-	expectedUserId?: string | null
-	role?: SharedInstanceRole | null
-	signedOut?: boolean
-}>()
-
-const { formatMessage } = useVIntl()
-const expectedUserId = computed(() => props.expectedUserId ?? null)
-const expectedUserQuery = useQuery({
-	queryKey: computed(() => ['user', expectedUserId.value]),
-	queryFn: async () => {
-		if (!expectedUserId.value) return null
-
-		return await get_user(expectedUserId.value, 'bypass').catch(() => null)
-	},
-	enabled: () => !!expectedUserId.value,
-	staleTime: 30_000,
-})
-const sharedInstanceExpectedUser = computed(() => {
-	const user = expectedUserQuery.data.value
-	if (!user) return null
-
-	return {
-		username: user.username,
-		avatarUrl: user.avatar_url ?? undefined,
-		tintBy: user.id,
-	}
-})
-const sharedInstanceExpectedUsername = computed(
-	() =>
-		sharedInstanceExpectedUser.value?.username ||
-		formatMessage(messages.sharedInstanceWrongAccountFallbackUsername),
-)
-const headerMessage = computed(() =>
-	props.signedOut
-		? messages.sharedInstanceSignedOutHeader
-		: messages.sharedInstanceWrongAccountHeader,
-)
-const bodyMessage = computed(() =>
-	props.role === 'owner'
-		? messages.sharedInstanceWrongAccountOwnerBody
-		: messages.sharedInstanceWrongAccountUserBody,
-)
-</script>
@@ -1,13 +0,0 @@
-import type { StackedAdmonitionItem } from '@modrinth/ui'
-
-export type InstanceAdmonitionKind =
-	| 'shared-instance-stale'
-	| 'shared-instance-update-available'
-	| 'shared-instance-unavailable'
-	| 'shared-instance-wrong-account'
-
-export type InstanceAdmonitionItem = StackedAdmonitionItem & {
-	kind: InstanceAdmonitionKind
-}
-
-export type SharedInstanceRole = 'owner' | 'member'
@@ -4,14 +4,12 @@ import {
 	Avatar,
 	ButtonStyled,
 	Checkbox,
-	Chips,
 	defineMessages,
 	injectNotificationManager,
 	OverflowMenu,
 	StyledInput,
 	useVIntl,
 } from '@modrinth/ui'
-import { useQueryClient } from '@tanstack/vue-query'
 import { convertFileSrc } from '@tauri-apps/api/core'
 import { open } from '@tauri-apps/plugin-dialog'
 import { computed, type Ref, ref, watch } from 'vue'
@@ -19,8 +17,7 @@ import { useRouter } from 'vue-router'

 import ConfirmDeleteInstanceModal from '@/components/ui/modal/ConfirmDeleteInstanceModal.vue'
 import { trackEvent } from '@/helpers/analytics'
-import { install_duplicate_instance } from '@/helpers/install'
-import { edit, edit_icon, list, remove } from '@/helpers/instance'
+import { duplicate, edit, edit_icon, list, remove } from '@/helpers/profile'
 import { injectInstanceSettings } from '@/providers/instance-settings'

 import type { GameInstance } from '../../../helpers/types'
@@ -28,32 +25,24 @@ import type { GameInstance } from '../../../helpers/types'
 const { handleError } = injectNotificationManager()
 const { formatMessage } = useVIntl()
 const router = useRouter()
-const queryClient = useQueryClient()

 const deleteConfirmModal = ref()

 const { instance } = injectInstanceSettings()
-type ReleaseChannel = GameInstance['update_channel']
-const releaseChannelOptions: ReleaseChannel[] = ['release', 'beta', 'alpha']

-const title = ref(instance.value.name)
-const icon: Ref<string | undefined> = ref(instance.value.icon_path)
-const groups = ref([...instance.value.groups])
-const savingReleaseChannel = ref(false)
-const selectedReleaseChannel = ref<ReleaseChannel>(instance.value.update_channel)
-const releaseChannelDisabledItems = computed<ReleaseChannel[]>(() =>
-	savingReleaseChannel.value ? [...releaseChannelOptions] : [],
-)
+const title = ref(instance.name)
+const icon: Ref<string | undefined> = ref(instance.icon_path)
+const groups = ref(instance.groups)

 const newCategoryInput = ref('')

-const installing = computed(() => instance.value.install_stage !== 'installed')
+const installing = computed(() => instance.install_stage !== 'installed')

-async function duplicateInstance() {
-	await install_duplicate_instance(instance.value.id).catch(handleError)
+async function duplicateProfile() {
+	await duplicate(instance.path).catch(handleError)
 	trackEvent('InstanceDuplicate', {
-		loader: instance.value.loader,
-		game_version: instance.value.game_version,
+		loader: instance.loader,
+		game_version: instance.game_version,
 	})
 }

@@ -62,60 +51,10 @@ const availableGroups = computed(() => [
 	...new Set([...allInstances.value.flatMap((instance) => instance.groups), ...groups.value]),
 ])

-function formatReleaseChannelLabel(channel: ReleaseChannel) {
-	switch (channel) {
-		case 'release':
-			return formatMessage(messages.updateChannelRelease)
-		case 'beta':
-			return formatMessage(messages.updateChannelBeta)
-		case 'alpha':
-			return formatMessage(messages.updateChannelAlpha)
-	}
-}
-
-function formatReleaseChannelDescription(channel: ReleaseChannel) {
-	switch (channel) {
-		case 'release':
-			return formatMessage(messages.updateChannelReleaseDescription)
-		case 'beta':
-			return formatMessage(messages.updateChannelBetaDescription)
-		case 'alpha':
-			return formatMessage(messages.updateChannelAlphaDescription)
-	}
-}
-
-watch(
-	() => [instance.value.id, instance.value.update_channel] as const,
-	() => {
-		if (!savingReleaseChannel.value) {
-			selectedReleaseChannel.value = instance.value.update_channel
-		}
-	},
-)
-
-watch(selectedReleaseChannel, async (channel, previousChannel) => {
-	const previousReleaseChannel = previousChannel ?? instance.value.update_channel
-	if (channel === instance.value.update_channel) return
-
-	savingReleaseChannel.value = true
-	const instanceId = instance.value.id
-	await edit(instanceId, { update_channel: channel })
-		.then(() => queryClient.invalidateQueries({ queryKey: ['linkedModpackInfo', instanceId] }))
-		.catch((error) => {
-			selectedReleaseChannel.value = previousReleaseChannel
-			handleError(error)
-		})
-	savingReleaseChannel.value = false
-})
-
 async function resetIcon() {
-	try {
-		await edit_icon(instance.value.id, null)
-		icon.value = undefined
-		trackEvent('InstanceRemoveIcon')
-	} catch (error) {
-		handleError(error)
-	}
+	icon.value = undefined
+	await edit_icon(instance.path, null).catch(handleError)
+	trackEvent('InstanceRemoveIcon')
 }

 async function setIcon() {
@@ -131,16 +70,13 @@ async function setIcon() {

 	if (!value) return

-	try {
-		await edit_icon(instance.value.id, value)
-		icon.value = value
-		trackEvent('InstanceSetIcon')
-	} catch (error) {
-		handleError(error)
-	}
+	icon.value = value
+	await edit_icon(instance.path, icon.value).catch(handleError)
+
+	trackEvent('InstanceSetIcon')
 }

-const editInstanceObject = computed(() => ({
+const editProfileObject = computed(() => ({
 	name: title.value.trim().substring(0, 32) ?? 'Instance',
 	groups: groups.value.map((x) => x.trim().substring(0, 32)).filter((x) => x.length > 0),
 }))
@@ -166,19 +102,19 @@ watch(
 	[title, groups, groups],
 	async () => {
 		if (removing.value) return
-		await edit(instance.value.id, editInstanceObject.value).catch(handleError)
+		await edit(instance.path, editProfileObject.value).catch(handleError)
 	},
 	{ deep: true },
 )

 const removing = ref(false)
-async function removeInstance() {
+async function removeProfile() {
 	removing.value = true
-	const path = instance.value.id
+	const path = instance.path

 	trackEvent('InstanceRemove', {
-		loader: instance.value.loader,
-		game_version: instance.value.game_version,
+		loader: instance.loader,
+		game_version: instance.game_version,
 	})

 	await router.push({ path: '/' })
@@ -239,38 +175,6 @@ const messages = defineMessages({
 		id: 'instance.settings.tabs.general.duplicate-button',
 		defaultMessage: 'Duplicate',
 	},
-	updateChannel: {
-		id: 'instance.settings.tabs.general.update-channel',
-		defaultMessage: 'Update channel',
-	},
-	updateChannelReleaseDescription: {
-		id: 'instance.settings.tabs.general.update-channel.release.description',
-		defaultMessage: 'Only release versions will be shown as available updates.',
-	},
-	updateChannelBetaDescription: {
-		id: 'instance.settings.tabs.general.update-channel.beta.description',
-		defaultMessage: 'Release and beta versions will be shown as available updates.',
-	},
-	updateChannelAlphaDescription: {
-		id: 'instance.settings.tabs.general.update-channel.alpha.description',
-		defaultMessage: 'Release, beta, and alpha versions will be shown as available updates.',
-	},
-	updateChannelRelease: {
-		id: 'instance.settings.tabs.general.update-channel.release',
-		defaultMessage: 'Release',
-	},
-	updateChannelBeta: {
-		id: 'instance.settings.tabs.general.update-channel.beta',
-		defaultMessage: 'Beta',
-	},
-	updateChannelAlpha: {
-		id: 'instance.settings.tabs.general.update-channel.alpha',
-		defaultMessage: 'Alpha',
-	},
-	selectUpdateChannelAriaLabel: {
-		id: 'instance.settings.tabs.general.update-channel.select',
-		defaultMessage: 'Select update channel',
-	},
 	deleteInstance: {
 		id: 'instance.settings.tabs.general.delete',
 		defaultMessage: 'Delete instance',
@@ -292,50 +196,47 @@ const messages = defineMessages({
 </script>

 <template>
-	<ConfirmDeleteInstanceModal ref="deleteConfirmModal" @delete="removeInstance" />
+	<ConfirmDeleteInstanceModal ref="deleteConfirmModal" @delete="removeProfile" />
 	<div class="block">
-		<div class="float-end ml-10 relative group w-fit">
-			<div class="flex flex-col gap-1">
-				<span class="text-lg font-semibold text-contrast">Icon</span>
-				<div class="group relative w-fit">
-					<OverflowMenu
-						v-tooltip="formatMessage(messages.editIcon)"
-						class="bg-transparent border-none appearance-none p-0 m-0 cursor-pointer group-active:scale-95 transition-transform"
-						:options="[
-							{
-								id: 'select',
-								action: () => setIcon(),
-							},
-							{
-								id: 'remove',
-								color: 'danger',
-								action: () => resetIcon(),
-								shown: !!icon,
-							},
-						]"
+		<div class="float-end ml-4 relative group">
+			<OverflowMenu
+				v-tooltip="formatMessage(messages.editIcon)"
+				class="bg-transparent border-none appearance-none p-0 m-0 cursor-pointer group-active:scale-95 transition-transform"
+				:options="[
+					{
+						id: 'select',
+						action: () => setIcon(),
+					},
+					{
+						id: 'remove',
+						color: 'danger',
+						action: () => resetIcon(),
+						shown: !!icon,
+					},
+				]"
+			>
+				<Avatar
+					:src="icon ? convertFileSrc(icon) : icon"
+					size="108px"
+					class="!border-4 group-hover:brightness-75"
+					:tint-by="instance.path"
+					no-shadow
+				/>
+				<div class="absolute top-0 right-0 m-2">
+					<div
+						class="p-2 m-0 text-primary flex items-center justify-center aspect-square bg-button-bg rounded-full border-button-border border-solid border-[1px] hovering-icon-shadow"
 					>
-						<Avatar
-							:src="icon ? convertFileSrc(icon) : icon"
-							size="108px"
-							class="transition-[filter] group-hover:brightness-75"
-							:tint-by="instance.id"
-							no-shadow
-						/>
-						<div
-							class="absolute top-0 h-full w-full flex items-center justify-center opacity-0 transition-all group-hover:opacity-100"
-						>
-							<EditIcon aria-hidden="true" class="h-10 w-10 text-primary" />
-						</div>
-						<template #select>
-							<UploadIcon />
-							{{ icon ? formatMessage(messages.replaceIcon) : formatMessage(messages.selectIcon) }}
-						</template>
-						<template #remove> <TrashIcon /> {{ formatMessage(messages.removeIcon) }} </template>
-					</OverflowMenu>
+						<EditIcon aria-hidden="true" class="h-4 w-4 text-primary" />
+					</div>
 				</div>
-			</div>
+				<template #select>
+					<UploadIcon />
+					{{ icon ? formatMessage(messages.replaceIcon) : formatMessage(messages.selectIcon) }}
+				</template>
+				<template #remove> <TrashIcon /> {{ formatMessage(messages.removeIcon) }} </template>
+			</OverflowMenu>
 		</div>
-		<label for="instance-name" class="m-0 text-lg font-semibold text-contrast block">
+		<label for="instance-name" class="m-0 mb-1 text-lg font-extrabold text-contrast block">
 			{{ formatMessage(messages.name) }}
 		</label>
 		<div class="flex">
@@ -348,99 +249,76 @@ const messages = defineMessages({
 			/>
 		</div>
 		<template v-if="instance.install_stage == 'installed'">
-			<div class="flex flex-col gap-2.5 mt-6">
-				<h2 id="duplicate-instance-label" class="m-0 text-lg font-semibold text-contrast block">
+			<div>
+				<h2
+					id="duplicate-instance-label"
+					class="m-0 mt-4 mb-1 text-lg font-extrabold text-contrast block"
+				>
 					{{ formatMessage(messages.duplicateInstance) }}
 				</h2>
-				<ButtonStyled>
-					<button
-						v-tooltip="installing ? formatMessage(messages.duplicateButtonTooltipInstalling) : null"
-						aria-labelledby="duplicate-instance-label"
-						:disabled="installing"
-						class="w-max !shadow-none"
-						@click="duplicateInstance"
-					>
-						<CopyIcon /> {{ formatMessage(messages.duplicateButton) }}
-					</button>
-				</ButtonStyled>
-				<p class="m-0">
+				<p class="m-0 mb-2">
 					{{ formatMessage(messages.duplicateInstanceDescription) }}
 				</p>
 			</div>
-		</template>
-		<div class="flex flex-col gap-2.5 mt-6">
-			<h2 class="m-0 text-lg font-semibold text-contrast block">
-				{{ formatMessage(messages.libraryGroups) }}
-			</h2>
-
-			<div class="flex flex-col gap-1">
-				<Checkbox
-					v-for="group in availableGroups"
-					:key="group"
-					:model-value="groups.includes(group)"
-					:label="group"
-					@click="toggleGroup(group)"
-				/>
-				<div class="flex gap-2 items-center">
-					<StyledInput
-						v-model="newCategoryInput"
-						:placeholder="formatMessage(messages.libraryGroupsEnterName)"
-						class="w-full max-w-[300px]"
-						@submit="() => addCategory"
-					/>
-					<ButtonStyled>
-						<button class="w-fit !shadow-none" @click="() => addCategory()">
-							<PlusIcon /> {{ formatMessage(messages.libraryGroupsCreate) }}
-						</button>
-					</ButtonStyled>
-				</div>
-			</div>
-			<p class="m-0">
-				{{ formatMessage(messages.libraryGroupsDescription) }}
-			</p>
-		</div>
-
-		<div class="flex flex-col gap-2.5 mt-6">
-			<h2 class="m-0 text-lg font-semibold text-contrast block">
-				{{ formatMessage(messages.updateChannel) }}
-			</h2>
-			<Chips
-				v-model="selectedReleaseChannel"
-				:items="releaseChannelOptions"
-				:format-label="formatReleaseChannelLabel"
-				:capitalize="false"
-				:disabled-items="releaseChannelDisabledItems"
-				:aria-label="formatMessage(messages.selectUpdateChannelAriaLabel)"
-			/>
-			<p class="m-0">
-				{{ formatReleaseChannelDescription(selectedReleaseChannel) }}
-			</p>
-		</div>
-
-		<div class="flex flex-col gap-2.5 mt-6">
-			<h2 id="delete-instance-label" class="m-0 text-lg font-semibold text-contrast block">
-				{{ formatMessage(messages.deleteInstance) }}
-			</h2>
-			<ButtonStyled color="red">
+			<ButtonStyled>
 				<button
-					aria-labelledby="delete-instance-label"
-					:disabled="removing"
-					class="w-fit !shadow-none"
-					@click="deleteConfirmModal.show()"
+					v-tooltip="installing ? formatMessage(messages.duplicateButtonTooltipInstalling) : null"
+					aria-labelledby="duplicate-instance-label"
+					:disabled="installing"
+					@click="duplicateProfile"
 				>
-					<SpinnerIcon v-if="removing" class="animate-spin" />
-					<TrashIcon v-else />
-					{{
-						removing
-							? formatMessage(messages.deletingInstanceButton)
-							: formatMessage(messages.deleteInstanceButton)
-					}}
+					<CopyIcon /> {{ formatMessage(messages.duplicateButton) }}
 				</button>
 			</ButtonStyled>
-			<p class="m-0">
-				{{ formatMessage(messages.deleteInstanceDescription) }}
-			</p>
+		</template>
+		<h2 class="m-0 mt-4 mb-1 text-lg font-extrabold text-contrast block">
+			{{ formatMessage(messages.libraryGroups) }}
+		</h2>
+		<p class="m-0 mb-2">
+			{{ formatMessage(messages.libraryGroupsDescription) }}
+		</p>
+		<div class="flex flex-col gap-1">
+			<Checkbox
+				v-for="group in availableGroups"
+				:key="group"
+				:model-value="groups.includes(group)"
+				:label="group"
+				@click="toggleGroup(group)"
+			/>
+			<div class="flex gap-2 items-center">
+				<StyledInput
+					v-model="newCategoryInput"
+					:placeholder="formatMessage(messages.libraryGroupsEnterName)"
+					@submit="() => addCategory"
+				/>
+				<ButtonStyled>
+					<button class="w-fit" @click="() => addCategory()">
+						<PlusIcon /> {{ formatMessage(messages.libraryGroupsCreate) }}
+					</button>
+				</ButtonStyled>
+			</div>
 		</div>
+		<h2 id="delete-instance-label" class="m-0 mt-4 mb-1 text-lg font-extrabold text-contrast block">
+			{{ formatMessage(messages.deleteInstance) }}
+		</h2>
+		<p class="m-0 mb-2">
+			{{ formatMessage(messages.deleteInstanceDescription) }}
+		</p>
+		<ButtonStyled color="red">
+			<button
+				aria-labelledby="delete-instance-label"
+				:disabled="removing"
+				@click="deleteConfirmModal.show()"
+			>
+				<SpinnerIcon v-if="removing" class="animate-spin" />
+				<TrashIcon v-else />
+				{{
+					removing
+						? formatMessage(messages.deletingInstanceButton)
+						: formatMessage(messages.deleteInstanceButton)
+				}}
+			</button>
+		</ButtonStyled>
 	</div>
 </template>
 <style scoped lang="scss">
@@ -8,7 +8,7 @@ import {
 } from '@modrinth/ui'
 import { computed, ref, watch } from 'vue'

-import { edit } from '@/helpers/instance'
+import { edit } from '@/helpers/profile'
 import { get } from '@/helpers/settings.ts'
 import { injectInstanceSettings } from '@/providers/instance-settings'

@@ -22,27 +22,25 @@ const { instance } = injectInstanceSettings()
 const globalSettings = (await get().catch(handleError)) as AppSettings

 const overrideHooks = ref(
-	!!instance.value.hooks.pre_launch ||
-		!!instance.value.hooks.wrapper ||
-		!!instance.value.hooks.post_exit,
+	!!instance.hooks.pre_launch || !!instance.hooks.wrapper || !!instance.hooks.post_exit,
 )
-const hooks = ref(instance.value.hooks ?? globalSettings.hooks)
+const hooks = ref(instance.hooks ?? globalSettings.hooks)

-const editInstanceObject = computed(() => {
-	const editInstancePatch: {
+const editProfileObject = computed(() => {
+	const editProfile: {
 		hooks?: Hooks
 	} = {}

 	// When hooks are not overridden per-instance, we want to clear them
-	editInstancePatch.hooks = overrideHooks.value ? hooks.value : {}
+	editProfile.hooks = overrideHooks.value ? hooks.value : {}

-	return editInstancePatch
+	return editProfile
 })

 watch(
 	[overrideHooks, hooks],
 	async () => {
-		await edit(instance.value.id, editInstanceObject.value)
+		await edit(instance.path, editProfileObject.value)
 	},
 	{ deep: true },
 )
@@ -101,57 +99,57 @@ const messages = defineMessages({

 <template>
 	<div>
-		<h2 class="m-0 m-0 text-lg font-semibold text-contrast">
+		<h2 class="m-0 mb-1 text-lg font-extrabold text-contrast">
 			{{ formatMessage(messages.hooks) }}
 		</h2>
-		<Checkbox v-model="overrideHooks" :label="formatMessage(messages.customHooks)" class="my-2.5" />
 		<p class="m-0">
 			{{ formatMessage(messages.hooksDescription) }}
 		</p>
+		<Checkbox v-model="overrideHooks" :label="formatMessage(messages.customHooks)" class="mt-2" />

-		<h2 class="mt-6 m-0 text-lg font-semibold text-contrast">
+		<h2 class="mt-2 mb-1 text-lg font-extrabold text-contrast">
 			{{ formatMessage(messages.preLaunch) }}
 		</h2>
+		<p class="m-0">
+			{{ formatMessage(messages.preLaunchDescription) }}
+		</p>
 		<StyledInput
 			id="pre-launch"
 			v-model="hooks.pre_launch"
 			autocomplete="off"
 			:disabled="!overrideHooks"
 			:placeholder="formatMessage(messages.preLaunchEnter)"
-			wrapper-class="w-full my-2.5"
+			wrapper-class="w-full mt-2"
 		/>
-		<p class="m-0">
-			{{ formatMessage(messages.preLaunchDescription) }}
-		</p>

-		<h2 class="mt-6 m-0 text-lg font-semibold text-contrast">
+		<h2 class="mt-4 mb-1 text-lg font-extrabold text-contrast">
 			{{ formatMessage(messages.wrapper) }}
 		</h2>
+		<p class="m-0">
+			{{ formatMessage(messages.wrapperDescription) }}
+		</p>
 		<StyledInput
 			id="wrapper"
 			v-model="hooks.wrapper"
 			autocomplete="off"
 			:disabled="!overrideHooks"
 			:placeholder="formatMessage(messages.wrapperEnter)"
-			wrapper-class="w-full my-2.5"
+			wrapper-class="w-full mt-2"
 		/>
-		<p class="m-0">
-			{{ formatMessage(messages.wrapperDescription) }}
-		</p>

-		<h2 class="mt-6 m-0 text-lg font-semibold text-contrast">
+		<h2 class="mt-4 mb-1 text-lg font-extrabold text-contrast">
 			{{ formatMessage(messages.postExit) }}
 		</h2>
+		<p class="m-0">
+			{{ formatMessage(messages.postExitDescription) }}
+		</p>
 		<StyledInput
 			id="post-exit"
 			v-model="hooks.post_exit"
 			autocomplete="off"
 			:disabled="!overrideHooks"
 			:placeholder="formatMessage(messages.postExitEnter)"
-			wrapper-class="w-full my-2.5"
+			wrapper-class="w-full mt-2"
 		/>
-		<p class="m-0">
-			{{ formatMessage(messages.postExitDescription) }}
-		</p>
 	</div>
 </template>
@@ -4,245 +4,143 @@ import {
 	commonMessages,
 	defineMessages,
 	formatLoaderLabel,
-	injectFilePicker,
 	injectNotificationManager,
 	InstallationSettingsLayout,
+	provideAppBackup,
 	provideInstallationSettings,
-	useDebugLogger,
 	useVIntl,
 } from '@modrinth/ui'
 import type { GameVersionTag, PlatformTag } from '@modrinth/utils'
 import { useQuery, useQueryClient } from '@tanstack/vue-query'
-import { computed, ref } from 'vue'
+import { computed, ref, shallowRef } from 'vue'

-import SharedInstanceInstallationSettingsControls from '@/components/ui/shared-instances/SharedInstanceInstallationSettingsControls.vue'
-import { useManagedContentPolicy } from '@/composables/instances/use-managed-content-policy'
 import { trackEvent } from '@/helpers/analytics'
 import { get_project_versions, get_version } from '@/helpers/cache'
+import { get_loader_versions } from '@/helpers/metadata'
 import {
-	install_existing_instance,
-	install_pack_to_existing_instance,
-	wait_for_install_job,
-} from '@/helpers/install'
-import {
+	duplicate,
 	edit,
 	get_linked_modpack_info,
-	unlink_shared_instance,
+	install,
+	list,
 	update_managed_modrinth_version,
 	update_repair_modrinth,
-} from '@/helpers/instance'
-import { get_loader_versions } from '@/helpers/metadata'
+} from '@/helpers/profile'
 import { get_game_versions, get_loaders } from '@/helpers/tags'
-import { provideInstanceBackup } from '@/providers/instance-backup'
 import { injectInstanceSettings } from '@/providers/instance-settings'
-import { useTheming } from '@/store/state'

 import type { Manifest } from '../../../helpers/types'

 const { handleError } = injectNotificationManager()
-const filePicker = injectFilePicker()
 const { formatMessage } = useVIntl()
 const queryClient = useQueryClient()
-const debug = useDebugLogger('AppInstallationSettings')
-const themeStore = useTheming()

-const { instance, offline, isMinecraftServer, onUnlinked, closeModal } = injectInstanceSettings()
-const managedContentPolicy = useManagedContentPolicy(instance)
-const skipNonEssentialWarnings = computed(() =>
-	themeStore.getFeatureFlag('skip_non_essential_warnings'),
-)
+const { instance, offline, isMinecraftServer, onUnlinked } = injectInstanceSettings()

-debug('metadata load: start', {
-	instanceId: instance.value.id,
-	loader: instance.value.loader,
-	gameVersion: instance.value.game_version,
-	installStage: instance.value.install_stage,
-})
+const [
+	fabric_versions,
+	forge_versions,
+	quilt_versions,
+	neoforge_versions,
+	all_game_versions,
+	loaders,
+] = await Promise.all([
+	get_loader_versions('fabric')
+		.then((manifest: Manifest) => shallowRef(manifest))
+		.catch(handleError),
+	get_loader_versions('forge')
+		.then((manifest: Manifest) => shallowRef(manifest))
+		.catch(handleError),
+	get_loader_versions('quilt')
+		.then((manifest: Manifest) => shallowRef(manifest))
+		.catch(handleError),
+	get_loader_versions('neo')
+		.then((manifest: Manifest) => shallowRef(manifest))
+		.catch(handleError),
+	get_game_versions()
+		.then((gameVersions: GameVersionTag[]) => shallowRef(gameVersions))
+		.catch(handleError),
+	get_loaders()
+		.then((value: PlatformTag[]) =>
+			value
+				.filter(
+					(item) => item.supported_project_types.includes('modpack') || item.name === 'vanilla',
+				)
+				.sort((a, b) => (a.name === 'vanilla' ? -1 : b.name === 'vanilla' ? 1 : 0)),
+		)
+		.then((loader: PlatformTag[]) => ref(loader))
+		.catch(handleError),
+])

-function getSupportedModpackLoaders() {
-	return get_loaders().then((value: PlatformTag[]) =>
-		value
-			.filter((item) => item.supported_project_types.includes('modpack') || item.name === 'vanilla')
-			.sort((a, b) => (a.name === 'vanilla' ? -1 : b.name === 'vanilla' ? 1 : 0)),
-	)
-}
-
-const fabricVersionsQuery = useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'fabric'],
-	queryFn: () => get_loader_versions('fabric') as Promise<Manifest>,
+const { data: modpackInfo } = useQuery({
+	queryKey: computed(() => ['linkedModpackInfo', instance.path]),
+	queryFn: () => get_linked_modpack_info(instance.path, 'must_revalidate'),
+	enabled: computed(() => !!instance.linked_data?.project_id && !offline),
 })
-const forgeVersionsQuery = useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'forge'],
-	queryFn: () => get_loader_versions('forge') as Promise<Manifest>,
-})
-const quiltVersionsQuery = useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'quilt'],
-	queryFn: () => get_loader_versions('quilt') as Promise<Manifest>,
-})
-const neoforgeVersionsQuery = useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'neo'],
-	queryFn: () => get_loader_versions('neo') as Promise<Manifest>,
-})
-const gameVersionsQuery = useQuery({
-	queryKey: ['instance-settings', 'game-versions'],
-	queryFn: () => get_game_versions() as Promise<GameVersionTag[]>,
-})
-const loadersQuery = useQuery({
-	queryKey: ['instance-settings', 'loaders', 'modpack'],
-	queryFn: getSupportedModpackLoaders,
-})
-
-const metadataLoading = computed(() =>
-	[
-		fabricVersionsQuery,
-		forgeVersionsQuery,
-		quiltVersionsQuery,
-		neoforgeVersionsQuery,
-		gameVersionsQuery,
-		loadersQuery,
-	].some((query) => query.isLoading.value),
-)
-
-debug('metadata queries configured', {
-	instanceId: instance.value.id,
-	loader: instance.value.loader,
-	gameVersion: instance.value.game_version,
-})
-
-const isModrinthLinkedModpack = computed(
-	() =>
-		instance.value.link?.type === 'modrinth_modpack' ||
-		instance.value.link?.type === 'server_project_modpack' ||
-		(instance.value.link?.type === 'shared_instance' &&
-			!!instance.value.link.modpack_project_id &&
-			!!instance.value.link.modpack_version_id),
-)
-const isImportedModpack = computed(() => instance.value.link?.type === 'imported_modpack')
-const isSharedInstanceManagedModpack = managedContentPolicy.isManagedModpack
-const canUnlinkSharedInstance = managedContentPolicy.canUnlink
-
-const modpackInfoQuery = useQuery({
-	queryKey: computed(() => ['linkedModpackInfo', instance.value.id]),
-	queryFn: () => get_linked_modpack_info(instance.value.id, 'must_revalidate'),
-	enabled: computed(() => isModrinthLinkedModpack.value && !offline),
-})
-const modpackInfo = modpackInfoQuery.data

 const repairing = ref(false)
 const reinstalling = ref(false)
-const unlinkingSharedInstance = ref(false)
-const installationSettingsBusy = computed(
-	() =>
-		instance.value.quarantined ||
-		instance.value.install_stage !== 'installed' ||
-		repairing.value ||
-		reinstalling.value ||
-		unlinkingSharedInstance.value ||
-		!!offline,
-)
-const installationSettingsBusyMessage = computed(() =>
-	instance.value.quarantined ? formatMessage(messages.locked) : null,
-)
-
-async function unlinkSharedInstance() {
-	unlinkingSharedInstance.value = true
-	try {
-		await unlink_shared_instance(instance.value.id)
-		await queryClient.invalidateQueries({ queryKey: ['sharedInstanceUsers', instance.value.id] })
-		await queryClient.invalidateQueries({ queryKey: ['linkedModpackInfo', instance.value.id] })
-		onUnlinked()
-	} catch (error) {
-		handleError(error)
-	} finally {
-		unlinkingSharedInstance.value = false
-	}
-}

 const messages = defineMessages({
 	loaderVersion: {
 		id: 'instance.settings.tabs.installation.loader-version',
 		defaultMessage: '{loader} version',
 	},
-	locked: {
-		id: 'instance.settings.tabs.installation.locked',
-		defaultMessage: 'Installation settings are unavailable while this instance is locked.',
-	},
 })

 function getManifest(loader: string) {
-	const map: Record<string, Manifest | undefined> = {
-		fabric: fabricVersionsQuery.data.value,
-		forge: forgeVersionsQuery.data.value,
-		quilt: quiltVersionsQuery.data.value,
-		neoforge: neoforgeVersionsQuery.data.value,
+	const map: Record<string, typeof fabric_versions> = {
+		fabric: fabric_versions,
+		forge: forge_versions,
+		quilt: quilt_versions,
+		neoforge: neoforge_versions,
 	}
-	const manifest = map[loader]
-	debug('getManifest:', {
-		loader,
-		hasManifest: !!manifest,
-		gameVersions: manifest?.gameVersions?.length ?? 0,
-	})
-	return manifest
+	return map[loader]
 }

-async function installLocalModpackFromPicker() {
-	const picked = await filePicker.pickModpackFile({ readFile: false })
-	if (!picked?.path) return false
-
-	const job = await install_pack_to_existing_instance(instance.value.id, {
-		type: 'fromFile',
-		path: picked.path,
-	}).catch(handleError)
-	if (!job) return false
-
-	const completed = await wait_for_install_job(job.job_id).catch(handleError)
-	return !!completed
-}
-
-provideInstanceBackup(instance)
+provideAppBackup({
+	async createBackup() {
+		const allProfiles = await list()
+		const prefix = `${instance.name} - Backup #`
+		const existingNums = allProfiles
+			.filter((p) => p.name.startsWith(prefix))
+			.map((p) => parseInt(p.name.slice(prefix.length), 10))
+			.filter((n) => !isNaN(n))
+		const nextNum = existingNums.length > 0 ? Math.max(...existingNums) + 1 : 1
+		const newPath = await duplicate(instance.path)
+		await edit(newPath, { name: `${prefix}${nextNum}` })
+	},
+})

 provideInstallationSettings({
-	closeSettings: closeModal,
-	loading: computed(() => metadataLoading.value || modpackInfoQuery.isLoading.value),
+	loading: ref(false),
 	installationInfo: computed(() => {
 		const rows = [
 			{
 				label: formatMessage(commonMessages.platformLabel),
-				value: formatLoaderLabel(instance.value.loader),
+				value: formatLoaderLabel(instance.loader),
 			},
 			{
 				label: formatMessage(commonMessages.gameVersionLabel),
-				value: instance.value.game_version,
+				value: instance.game_version,
 			},
 		]
-		if (instance.value.loader !== 'vanilla' && instance.value.loader_version) {
+		if (instance.loader !== 'vanilla' && instance.loader_version) {
 			rows.push({
 				label: formatMessage(messages.loaderVersion, {
-					loader: formatLoaderLabel(instance.value.loader),
+					loader: formatLoaderLabel(instance.loader),
 				}),
-				value: instance.value.loader_version,
+				value: instance.loader_version,
 			})
 		}
 		return rows
 	}),
-	isLinked: computed(
+	isLinked: computed(() => !!instance.linked_data?.locked),
+	isBusy: computed(
 		() =>
-			isModrinthLinkedModpack.value ||
-			isImportedModpack.value ||
-			isSharedInstanceManagedModpack.value,
+			instance.install_stage !== 'installed' || repairing.value || reinstalling.value || !!offline,
 	),
-	isBusy: installationSettingsBusy,
-	busyMessage: installationSettingsBusyMessage,
-	skipNonEssentialWarnings,
 	modpack: computed(() => {
-		if (isImportedModpack.value && instance.value.link?.type === 'imported_modpack') {
-			return {
-				iconUrl: instance.value.icon_path,
-				title: instance.value.link.name ?? instance.value.name,
-				versionNumber: instance.value.link.version_number ?? undefined,
-				filename: instance.value.link.filename ?? undefined,
-			}
-		}
 		if (!modpackInfo.value) return null
 		return {
 			iconUrl: modpackInfo.value.project.icon_url,
@@ -251,246 +149,131 @@ provideInstallationSettings({
 			versionNumber: modpackInfo.value.version?.version_number,
 		}
 	}),
-	currentPlatform: computed(() => instance.value.loader),
-	currentGameVersion: computed(() => instance.value.game_version),
-	currentLoaderVersion: computed(() => instance.value.loader_version ?? ''),
-	availablePlatforms: computed(() => loadersQuery.data.value?.map((x) => x.name) ?? []),
+	currentPlatform: computed(() => instance.loader),
+	currentGameVersion: computed(() => instance.game_version),
+	currentLoaderVersion: computed(() => instance.loader_version ?? ''),
+	availablePlatforms: loaders?.value?.map((x) => x.name) ?? [],

 	resolveGameVersions(loader, showSnapshots) {
-		const versions = gameVersionsQuery.data.value ?? []
+		const versions = all_game_versions?.value ?? []
 		const filtered = versions.filter((item) => {
 			if (loader === 'vanilla') return true
 			const manifest = getManifest(loader)
-			return !!manifest?.gameVersions?.some((x) => item.version === x.id)
+			return !!manifest?.value?.gameVersions?.some((x) => item.version === x.id)
 		})
-		const result = (
-			showSnapshots ? filtered : filtered.filter((x) => x.version_type === 'release')
-		).map((x) => ({ value: x.version, label: x.version }))
-		debug('resolveGameVersions:', {
-			loader,
-			showSnapshots,
-			totalVersions: versions.length,
-			filteredVersions: filtered.length,
-			resultVersions: result.length,
-		})
-		return result
+		return (showSnapshots ? filtered : filtered.filter((x) => x.version_type === 'release')).map(
+			(x) => ({ value: x.version, label: x.version }),
+		)
 	},

 	resolveLoaderVersions(loader, gameVersion) {
-		if (loader === 'vanilla' || !gameVersion) {
-			debug('resolveLoaderVersions: skipped', { loader, gameVersion })
-			return []
-		}
+		if (loader === 'vanilla' || !gameVersion) return []
 		const manifest = getManifest(loader)
-		if (!manifest) {
-			debug('resolveLoaderVersions: no manifest', { loader, gameVersion })
-			return []
+		if (!manifest?.value) return []
+		if (loader === 'fabric' || loader === 'quilt') {
+			return manifest.value.gameVersions[0]?.loaders ?? []
 		}
-		const entry = manifest.gameVersions?.find((item) => item.id === gameVersion)
-		if (entry?.versionGroup) {
-			const result =
-				manifest.versionGroups?.find((group) => group.id === entry.versionGroup)?.loaders ?? []
-			debug('resolveLoaderVersions: version group result', {
-				loader,
-				gameVersion,
-				versionGroup: entry.versionGroup,
-				count: result.length,
-			})
-			return result
-		}
-		const placeholder = manifest.gameVersions?.find((item) => item.id === '${modrinth.gameVersion}')
-		if (placeholder) {
-			const result = manifest.gameVersions?.some((item) => item.id === gameVersion)
-				? placeholder.loaders
-				: []
-			debug('resolveLoaderVersions: placeholder result', {
-				loader,
-				gameVersion,
-				count: result.length,
-			})
-			return result
-		}
-		const result = entry?.loaders ?? []
-		debug('resolveLoaderVersions: result', { loader, gameVersion, count: result.length })
-		return result
+		return manifest.value.gameVersions?.find((item) => item.id === gameVersion)?.loaders ?? []
 	},

 	resolveHasSnapshots(loader) {
-		const versions = gameVersionsQuery.data.value ?? []
-		if (loader === 'vanilla') {
-			const result = versions.some((x) => x.version_type !== 'release')
-			debug('resolveHasSnapshots: vanilla', { loader, result })
-			return result
-		}
+		const versions = all_game_versions?.value ?? []
+		if (loader === 'vanilla') return versions.some((x) => x.version_type !== 'release')
 		const manifest = getManifest(loader)
 		const supported = versions.filter(
-			(item) => !!manifest?.gameVersions?.some((x) => item.version === x.id),
+			(item) => !!manifest?.value?.gameVersions?.some((x) => item.version === x.id),
 		)
-		const result = supported.some((x) => x.version_type !== 'release')
-		debug('resolveHasSnapshots:', {
-			loader,
-			totalVersions: versions.length,
-			supportedVersions: supported.length,
-			result,
-		})
-		return result
+		return supported.some((x) => x.version_type !== 'release')
 	},

 	async save(platform, gameVersion, loaderVersionId) {
-		debug('save: called', {
-			instanceId: instance.value.id,
-			platform,
-			gameVersion,
-			loaderVersionId,
-		})
-		const editInstancePatch: Record<string, string | undefined> = {
+		const editProfile: Record<string, string | undefined> = {
 			loader: platform,
 			game_version: gameVersion,
 		}
 		if (platform !== 'vanilla' && loaderVersionId) {
-			editInstancePatch.loader_version = loaderVersionId
+			editProfile.loader_version = loaderVersionId
 		}
-		await edit(instance.value.id, editInstancePatch).catch(handleError)
-		debug('save: edit complete', { editInstancePatch })
+		await edit(instance.path, editProfile).catch(handleError)
 	},

 	afterSave: async () => {
-		debug('afterSave: installing', { instanceId: instance.value.id })
-		await install_existing_instance(instance.value.id, false).catch(handleError)
+		await install(instance.path, false).catch(handleError)
 		trackEvent('InstanceRepair', {
-			loader: instance.value.loader,
-			game_version: instance.value.game_version,
+			loader: instance.loader,
+			game_version: instance.game_version,
 		})
-		debug('afterSave: done')
 	},

 	async repair() {
-		debug('repair: called', { instanceId: instance.value.id })
 		repairing.value = true
-		await install_existing_instance(instance.value.id, true).catch(handleError)
+		await install(instance.path, true).catch(handleError)
 		repairing.value = false
 		trackEvent('InstanceRepair', {
-			loader: instance.value.loader,
-			game_version: instance.value.game_version,
+			loader: instance.loader,
+			game_version: instance.game_version,
 		})
-		debug('repair: done')
 	},

 	async reinstallModpack() {
-		debug('reinstallModpack: called', { instanceId: instance.value.id })
 		reinstalling.value = true
-		let shouldTrack = false
-		try {
-			if (isImportedModpack.value) {
-				shouldTrack = await installLocalModpackFromPicker()
-			} else {
-				await update_repair_modrinth(instance.value.id).catch(handleError)
-				shouldTrack = true
-			}
-		} finally {
-			reinstalling.value = false
-		}
-		if (shouldTrack) {
-			trackEvent('InstanceRepair', {
-				loader: instance.value.loader,
-				game_version: instance.value.game_version,
-			})
-		}
-		debug('reinstallModpack: done')
-	},
-
-	async swapModpack() {
-		debug('swapModpack: called', { instanceId: instance.value.id })
-		reinstalling.value = true
-		try {
-			const installed = await installLocalModpackFromPicker()
-			if (installed) {
-				trackEvent('InstanceRepair', {
-					loader: instance.value.loader,
-					game_version: instance.value.game_version,
-				})
-			}
-		} finally {
-			reinstalling.value = false
-		}
-		debug('swapModpack: done')
+		await update_repair_modrinth(instance.path).catch(handleError)
+		reinstalling.value = false
+		trackEvent('InstanceRepair', {
+			loader: instance.loader,
+			game_version: instance.game_version,
+		})
 	},

 	async unlinkModpack() {
-		debug('unlinkModpack: called', { instanceId: instance.value.id })
-		await edit(instance.value.id, {
-			link: null as unknown as undefined,
+		await edit(instance.path, {
+			linked_data: null as unknown as undefined,
 		})
 		await queryClient.invalidateQueries({
-			queryKey: ['linkedModpackInfo', instance.value.id],
+			queryKey: ['linkedModpackInfo', instance.path],
 		})
 		onUnlinked()
-		debug('unlinkModpack: done')
 	},

 	getCachedModpackVersions: () => null,
 	async fetchModpackVersions() {
-		debug('fetchModpackVersions: called', {
-			projectId: instance.value.link?.project_id,
-		})
-		const versions = await get_project_versions(instance.value.link!.project_id!).catch(handleError)
-		debug('fetchModpackVersions: done', { count: versions?.length ?? 0 })
+		const versions = await get_project_versions(instance.linked_data!.project_id!).catch(
+			handleError,
+		)
 		return (versions ?? []) as Labrinth.Versions.v2.Version[]
 	},

 	async getVersionChangelog(versionId: string) {
-		debug('getVersionChangelog: called', { versionId })
 		return (await get_version(versionId, 'must_revalidate').catch(
 			() => null,
 		)) as Labrinth.Versions.v2.Version | null
 	},

 	async onModpackVersionConfirm(version) {
-		debug('onModpackVersionConfirm: called', {
-			versionId: version.id,
-			instanceId: instance.value.id,
-		})
-		await update_managed_modrinth_version(instance.value.id, version.id)
+		await update_managed_modrinth_version(instance.path, version.id)
 		await queryClient.invalidateQueries({
-			queryKey: ['linkedModpackInfo', instance.value.id],
+			queryKey: ['linkedModpackInfo', instance.path],
 		})
-		debug('onModpackVersionConfirm: done')
 	},

 	updaterModalProps: computed(() => ({
 		isApp: true,
-		currentVersionId: modpackInfo.value?.update_version_id ?? instance.value.link?.version_id ?? '',
+		currentVersionId:
+			modpackInfo.value?.update_version_id ?? instance.linked_data?.version_id ?? '',
 		projectIconUrl: modpackInfo.value?.project?.icon_url,
 		projectName: modpackInfo.value?.project?.title ?? 'Modpack',
-		currentGameVersion: instance.value.game_version,
-		currentLoader: instance.value.loader,
+		currentGameVersion: instance.game_version,
+		currentLoader: instance.loader,
 	})),

 	isServer: false,
 	isApp: true,
-	showModpackVersionActions: computed(
-		() =>
-			isModrinthLinkedModpack.value &&
-			!isMinecraftServer.value &&
-			!isSharedInstanceManagedModpack.value,
-	),
-	isLocalFile: isImportedModpack,
-	isManagedModpack: isSharedInstanceManagedModpack,
-	managedModpackWarning: managedContentPolicy.managedModpackWarning,
+	showModpackVersionActions: !isMinecraftServer.value,
 	repairing,
 	reinstalling,
 })
 </script>

 <template>
-	<InstallationSettingsLayout>
-		<template #extra>
-			<SharedInstanceInstallationSettingsControls
-				:can-unlink="canUnlinkSharedInstance"
-				:busy="installationSettingsBusy"
-				:unlinking="unlinkingSharedInstance"
-				:unlink="unlinkSharedInstance"
-			/>
-		</template>
-	</InstallationSettingsLayout>
+	<InstallationSettingsLayout />
 </template>
@@ -1,15 +1,6 @@
 <script setup lang="ts">
+import { CheckCircleIcon, XCircleIcon } from '@modrinth/assets'
 import {
-	CheckCircleIcon,
-	CoffeeIcon,
-	FolderSearchIcon,
-	RefreshCwIcon,
-	SearchIcon,
-	SpinnerIcon,
-	XCircleIcon,
-} from '@modrinth/assets'
-import {
-	ButtonStyled,
 	Checkbox,
 	defineMessages,
 	injectNotificationManager,
@@ -17,13 +8,11 @@ import {
 	StyledInput,
 	useVIntl,
 } from '@modrinth/ui'
-import { open } from '@tauri-apps/plugin-dialog'
 import { computed, readonly, ref, watch } from 'vue'

-import JavaDetectionModal from '@/components/ui/JavaDetectionModal.vue'
-import useJavaTest from '@/composables/useJavaTest'
+import JavaSelector from '@/components/ui/JavaSelector.vue'
 import useMemorySlider from '@/composables/useMemorySlider'
-import { edit, get_optimal_jre_key } from '@/helpers/instance'
+import { edit, get_optimal_jre_key } from '@/helpers/profile'
 import { get } from '@/helpers/settings.ts'
 import { injectInstanceSettings } from '@/providers/instance-settings'

@@ -36,79 +25,30 @@ const { instance } = injectInstanceSettings()

 const globalSettings = (await get().catch(handleError)) as unknown as AppSettings

-const optimalJava = readonly(await get_optimal_jre_key(instance.value.id).catch(handleError))
+const overrideJavaInstall = ref(!!instance.java_path)
+const optimalJava = readonly(await get_optimal_jre_key(instance.path).catch(handleError))
+const javaInstall = ref({ path: optimalJava.path ?? instance.java_path })

-const overrideJavaInstall = ref(!!instance.value.java_path)
-const javaPath = ref(instance.value.java_path ?? optimalJava?.path ?? '')
+const overrideJavaArgs = ref((instance.extra_launch_args?.length ?? 0) > 0)
+const javaArgs = ref((instance.extra_launch_args ?? globalSettings.extra_launch_args).join(' '))

-const activePath = computed(() =>
-	overrideJavaInstall.value ? javaPath.value : (optimalJava?.path ?? ''),
-)
-
-watch(overrideJavaInstall, (enabled) => {
-	if (enabled && !javaPath.value) {
-		javaPath.value = optimalJava?.path ?? ''
-	}
-})
-
-const { testingJava, javaTestResult, testJavaInstallationDebounced, testJavaInstallation } =
-	useJavaTest()
-
-const hoveringTest = ref(false)
-let hasInitialized = false
-
-watch(
-	activePath,
-	(newPath) => {
-		if (newPath && optimalJava?.parsed_version) {
-			if (!hasInitialized) {
-				testJavaInstallation(newPath, optimalJava?.parsed_version, false)
-				hasInitialized = true
-			} else {
-				testJavaInstallationDebounced(newPath, optimalJava?.parsed_version)
-			}
-		}
-	},
-	{ immediate: true },
-)
-
-const javaDetectionModal = ref<{ show: (version: number, current: object) => void } | null>(null)
-
-async function handleBrowseJava() {
-	const result = await open({ multiple: false })
-	if (result) {
-		javaPath.value = result
-	}
-}
-
-function handleDetectJava() {
-	javaDetectionModal.value?.show(optimalJava?.parsed_version, { path: javaPath.value })
-}
-
-const overrideJavaArgs = ref((instance.value.extra_launch_args?.length ?? 0) > 0)
-const javaArgs = ref(
-	(instance.value.extra_launch_args ?? globalSettings.extra_launch_args).join(' '),
-)
-
-const overrideEnvVars = ref((instance.value.custom_env_vars?.length ?? 0) > 0)
+const overrideEnvVars = ref((instance.custom_env_vars?.length ?? 0) > 0)
 const envVars = ref(
-	(instance.value.custom_env_vars ?? globalSettings.custom_env_vars)
-		.map((x) => x.join('='))
-		.join(' '),
+	(instance.custom_env_vars ?? globalSettings.custom_env_vars).map((x) => x.join('=')).join(' '),
 )

-const overrideMemorySettings = ref(!!instance.value.memory)
-const memory = ref(instance.value.memory ?? globalSettings.memory)
+const overrideMemorySettings = ref(!!instance.memory)
+const memory = ref(instance.memory ?? globalSettings.memory)
 const { maxMemory, snapPoints } = (await useMemorySlider().catch(handleError)) as unknown as {
 	maxMemory: number
 	snapPoints: number[]
 }

-const editInstanceObject = computed(() => {
+const editProfileObject = computed(() => {
 	return {
 		java_path:
-			overrideJavaInstall.value && javaPath.value
-				? javaPath.value.replace('java.exe', 'javaw.exe')
+			overrideJavaInstall.value && javaInstall.value.path !== ''
+				? javaInstall.value.path.replace('java.exe', 'javaw.exe')
 				: null,
 		extra_launch_args: overrideJavaArgs.value
 			? javaArgs.value.trim().split(/\s+/).filter(Boolean)
@@ -127,7 +67,7 @@ const editInstanceObject = computed(() => {
 watch(
 	[
 		overrideJavaInstall,
-		javaPath,
+		javaInstall,
 		overrideJavaArgs,
 		javaArgs,
 		overrideEnvVars,
@@ -136,7 +76,7 @@ watch(
 		memory,
 	],
 	async () => {
-		await edit(instance.value.id, editInstanceObject.value)
+		await edit(instance.path, editProfileObject.value)
 	},
 	{ deep: true },
 )
@@ -146,45 +86,17 @@ const messages = defineMessages({
 		id: 'instance.settings.tabs.java.java-installation',
 		defaultMessage: 'Java installation',
 	},
-	customJavaInstallation: {
-		id: 'instance.settings.tabs.java.custom-java-installation',
-		defaultMessage: 'Custom Java installation',
-	},
-	javaPathPlaceholder: {
-		id: 'instance.settings.tabs.java.java-path-placeholder',
-		defaultMessage: '/path/to/java',
-	},
-	javaMemory: {
-		id: 'instance.settings.tabs.java.java-memory',
-		defaultMessage: 'Memory allocated',
-	},
-	customMemoryAllocation: {
-		id: 'instance.settings.tabs.java.custom-memory-allocation',
-		defaultMessage: 'Custom memory allocation',
-	},
 	javaArguments: {
 		id: 'instance.settings.tabs.java.java-arguments',
 		defaultMessage: 'Java arguments',
 	},
-	customJavaArguments: {
-		id: 'instance.settings.tabs.java.custom-java-arguments',
-		defaultMessage: 'Custom Java arguments',
-	},
-	enterJavaArguments: {
-		id: 'instance.settings.tabs.java.enter-java-arguments',
-		defaultMessage: 'Enter Java arguments...',
-	},
 	javaEnvironmentVariables: {
 		id: 'instance.settings.tabs.java.environment-variables',
 		defaultMessage: 'Environment variables',
 	},
-	customEnvironmentVariables: {
-		id: 'instance.settings.tabs.java.custom-environment-variables',
-		defaultMessage: 'Custom environment variables',
-	},
-	enterEnvironmentVariables: {
-		id: 'instance.settings.tabs.java.enter-environment-variables',
-		defaultMessage: 'Enter environmental variables...',
+	javaMemory: {
+		id: 'instance.settings.tabs.java.java-memory',
+		defaultMessage: 'Memory allocated',
 	},
 	hooks: {
 		id: 'instance.settings.tabs.java.hooks',
@@ -195,86 +107,43 @@ const messages = defineMessages({

 <template>
 	<div>
-		<JavaDetectionModal ref="javaDetectionModal" @submit="(val) => (javaPath = val.path)" />
-		<h2 class="m-0 mb-2 text-lg font-extrabold text-contrast block">
+		<h2 id="project-name" class="m-0 mb-1 text-lg font-extrabold text-contrast block">
 			{{ formatMessage(messages.javaInstallation) }}
 		</h2>
-		<Checkbox
-			v-model="overrideJavaInstall"
-			:label="formatMessage(messages.customJavaInstallation)"
-			class="mb-2"
-		/>
-		<div class="flex gap-4 p-4 bg-bg rounded-2xl">
-			<div class="flex gap-3 items-start flex-1 min-w-0">
-				<div
-					class="w-10 h-10 flex items-center justify-center rounded-full bg-button-bg border-solid border-[1px] border-button-border p-2 mt-1 shrink-0 [&_svg]:h-full [&_svg]:w-full"
-				>
-					<CoffeeIcon />
-				</div>
-				<div class="flex flex-col gap-2 flex-1 min-w-0">
-					<span class="font-semibold leading-none mt-2"
-						>Java {{ optimalJava?.parsed_version }}</span
+		<Checkbox v-model="overrideJavaInstall" label="Custom Java installation" class="mb-2" />
+		<template v-if="!overrideJavaInstall">
+			<div class="flex my-2 items-center gap-2 font-semibold">
+				<template v-if="javaInstall">
+					<CheckCircleIcon class="text-brand-green h-4 w-4" />
+					<span>Using default Java {{ optimalJava.major_version }} installation:</span>
+				</template>
+				<template v-else-if="optimalJava">
+					<XCircleIcon class="text-brand-red h-5 w-5" />
+					<span
+						>Could not find a default Java {{ optimalJava.major_version }} installation. Please set
+						one below:</span
 					>
-					<div class="flex gap-2 items-center">
-						<StyledInput
-							:model-value="activePath"
-							:disabled="!overrideJavaInstall"
-							autocomplete="off"
-							:placeholder="formatMessage(messages.javaPathPlaceholder)"
-							wrapper-class="flex-1 min-w-0"
-							@update:model-value="(val) => (javaPath = String(val))"
-						/>
-						<ButtonStyled
-							:color="
-								!hoveringTest && !testingJava
-									? javaTestResult === true
-										? 'green'
-										: 'red'
-									: 'standard'
-							"
-							color-fill="text"
-						>
-							<button
-								:disabled="!overrideJavaInstall || testingJava"
-								@click="testJavaInstallation(activePath, optimalJava?.parsed_version, true)"
-								@mouseenter="overrideJavaInstall && (hoveringTest = true)"
-								@mouseleave="hoveringTest = false"
-							>
-								<SpinnerIcon v-if="testingJava" class="animate-spin h-4 w-4" />
-								<CheckCircleIcon
-									v-else-if="javaTestResult === true && !hoveringTest"
-									class="h-4 w-4"
-								/>
-								<XCircleIcon v-else-if="javaTestResult !== true && !hoveringTest" class="h-4 w-4" />
-								<RefreshCwIcon v-else-if="overrideJavaInstall" class="h-4 w-4" />
-							</button>
-						</ButtonStyled>
-					</div>
-					<div v-if="overrideJavaInstall" class="flex gap-2">
-						<ButtonStyled>
-							<button @click="handleDetectJava">
-								<SearchIcon />
-								Detect
-							</button>
-						</ButtonStyled>
-						<ButtonStyled>
-							<button @click="handleBrowseJava">
-								<FolderSearchIcon />
-								Browse
-							</button>
-						</ButtonStyled>
-					</div>
-				</div>
+				</template>
+				<template v-else>
+					<XCircleIcon class="text-brand-red h-5 w-5" />
+					<span
+						>Could not automatically determine a Java installation to use. Please set one
+						below:</span
+					>
+				</template>
 			</div>
-		</div>
-		<h2 class="mt-4 mb-1 text-lg font-extrabold text-contrast block">
+			<div
+				v-if="javaInstall && !overrideJavaInstall"
+				class="p-4 bg-bg rounded-xl text-xs text-secondary leading-none font-mono"
+			>
+				{{ javaInstall.path }}
+			</div>
+		</template>
+		<JavaSelector v-if="overrideJavaInstall || !javaInstall" v-model="javaInstall" />
+		<h2 id="project-name" class="mt-4 mb-1 text-lg font-extrabold text-contrast block">
 			{{ formatMessage(messages.javaMemory) }}
 		</h2>
-		<Checkbox
-			v-model="overrideMemorySettings"
-			:label="formatMessage(messages.customMemoryAllocation)"
-			class="mb-2"
-		/>
+		<Checkbox v-model="overrideMemorySettings" label="Custom memory allocation" class="mb-2" />
 		<Slider
 			id="max-memory"
 			v-model="memory.maximum"
@@ -286,36 +155,28 @@ const messages = defineMessages({
 			:snap-range="512"
 			unit="MB"
 		/>
-		<h2 class="mt-4 mb-1 text-lg font-extrabold text-contrast block">
+		<h2 id="project-name" class="mt-4 mb-1 text-lg font-extrabold text-contrast block">
 			{{ formatMessage(messages.javaArguments) }}
 		</h2>
-		<Checkbox
-			v-model="overrideJavaArgs"
-			:label="formatMessage(messages.customJavaArguments)"
-			class="my-2"
-		/>
+		<Checkbox v-model="overrideJavaArgs" label="Custom java arguments" class="my-2" />
 		<StyledInput
 			id="java-args"
 			v-model="javaArgs"
 			autocomplete="off"
 			:disabled="!overrideJavaArgs"
-			:placeholder="formatMessage(messages.enterJavaArguments)"
+			placeholder="Enter java arguments..."
 			wrapper-class="w-full"
 		/>
-		<h2 class="mt-4 mb-1 text-lg font-extrabold text-contrast block">
+		<h2 id="project-name" class="mt-4 mb-1 text-lg font-extrabold text-contrast block">
 			{{ formatMessage(messages.javaEnvironmentVariables) }}
 		</h2>
-		<Checkbox
-			v-model="overrideEnvVars"
-			:label="formatMessage(messages.customEnvironmentVariables)"
-			class="mb-2"
-		/>
+		<Checkbox v-model="overrideEnvVars" label="Custom environment variables" class="mb-2" />
 		<StyledInput
 			id="env-vars"
 			v-model="envVars"
 			autocomplete="off"
 			:disabled="!overrideEnvVars"
-			:placeholder="formatMessage(messages.enterEnvironmentVariables)"
+			placeholder="Enter environmental variables..."
 			wrapper-class="w-full"
 		/>
 	</div>
@@ -1,206 +0,0 @@
-<template>
-	<div class="flex flex-col gap-8">
-		<section class="flex flex-col gap-4">
-			<div class="flex flex-col gap-1">
-				<h3 class="m-0 text-lg font-semibold text-contrast">
-					{{ formatMessage(messages.activeInvitesTitle) }}
-				</h3>
-				<p class="m-0 text-secondary">
-					{{ formatMessage(messages.activeInvitesDescription) }}
-				</p>
-			</div>
-
-			<Table :columns="inviteColumns" :data="activeInvites" row-key="id" table-min-width="36rem">
-				<template #empty-state>
-					<div class="flex h-40 items-center justify-center text-secondary">
-						{{ formatMessage(messages.noActiveInvites) }}
-					</div>
-				</template>
-				<template #cell-id="{ row }">
-					<CopyCode
-						:text="`${config.siteUrl}/share/${encodeURIComponent(row.id)}`"
-						:display-text="`/${row.id}`"
-					/>
-				</template>
-				<template #cell-uses="{ row }">
-					<span class="font-medium text-primary">{{ row.uses }}</span>
-					<span> / {{ row.maxUses }}</span>
-				</template>
-				<template #cell-expiration="{ row }">
-					<span v-tooltip="formatDateTime(row.expiration)" class="whitespace-nowrap">
-						{{ formatRelativeTime(row.expiration) }}
-					</span>
-				</template>
-				<template #cell-actions="{ row }">
-					<div class="flex justify-end">
-						<ButtonStyled circular type="transparent">
-							<button
-								v-tooltip="formatMessage(messages.revokeInvite)"
-								:aria-label="
-									formatMessage(messages.revokeInviteWithCode, {
-										code: row.id,
-									})
-								"
-								class="text-secondary hover:!filter-none hover:text-red focus-visible:!filter-none"
-								@click="revokeInviteModal?.show(row.id)"
-							>
-								<XIcon aria-hidden="true" />
-							</button>
-						</ButtonStyled>
-					</div>
-				</template>
-			</Table>
-		</section>
-
-		<SharedInstanceInstallationSettingsControls
-			can-unpublish
-			:busy="isBusy"
-			:unpublishing="unpublishing"
-			:unpublish="unpublishSharedInstance"
-		/>
-
-		<ConfirmRevokeSharedInstanceInviteModal ref="revokeInviteModal" @revoke="revokeInvite" />
-	</div>
-</template>
-
-<script setup lang="ts">
-import { XIcon } from '@modrinth/assets'
-import {
-	ButtonStyled,
-	CopyCode,
-	defineMessages,
-	Table,
-	type TableColumn,
-	useFormatDateTime,
-	useRelativeTime,
-	useVIntl,
-} from '@modrinth/ui'
-import { useQueryClient } from '@tanstack/vue-query'
-import { computed, ref } from 'vue'
-
-import ConfirmRevokeSharedInstanceInviteModal from '@/components/ui/shared-instances/ConfirmRevokeSharedInstanceInviteModal.vue'
-import SharedInstanceInstallationSettingsControls from '@/components/ui/shared-instances/SharedInstanceInstallationSettingsControls.vue'
-import { config } from '@/config'
-import { type SharedInstanceInvite, unpublish_shared_instance } from '@/helpers/instance'
-import { useSharedInstanceErrors } from '@/helpers/shared-instance-errors'
-import { injectInstanceSettings } from '@/providers/instance-settings'
-
-const { instance, offline, onUnlinked } = injectInstanceSettings()
-const { notifySharedInstanceError } = useSharedInstanceErrors()
-const { formatMessage } = useVIntl()
-const queryClient = useQueryClient()
-const unpublishing = ref(false)
-const revokeInviteModal = ref<InstanceType<typeof ConfirmRevokeSharedInstanceInviteModal>>()
-const formatRelativeTime = useRelativeTime()
-const formatDateTime = useFormatDateTime({ dateStyle: 'medium', timeStyle: 'short' })
-const isBusy = computed(
-	() => instance.value.install_stage !== 'installed' || unpublishing.value || !!offline,
-)
-
-type InviteTableColumn = 'id' | 'uses' | 'expiration' | 'actions'
-
-const inviteColumns = computed<TableColumn<InviteTableColumn>[]>(() => [
-	{
-		key: 'id',
-		label: formatMessage(messages.inviteCodeLabel),
-		width: 'clamp(11rem, 34%, 19rem)',
-	},
-	{
-		key: 'uses',
-		label: formatMessage(messages.usesLabel),
-		width: 'clamp(7rem, 18%, 10rem)',
-	},
-	{
-		key: 'expiration',
-		label: formatMessage(messages.expiresLabel),
-		width: 'clamp(9rem, 28%, 14rem)',
-	},
-	{
-		key: 'actions',
-		label: formatMessage(messages.actionsLabel),
-		align: 'right',
-		width: '5.5rem',
-	},
-])
-
-const now = Date.now()
-
-// TODO: Use actual endpoint
-const activeInvites = ref<SharedInstanceInvite[]>([
-	{
-		id: 'wqHPxNagZr',
-		expiration: new Date(now + 6 * 24 * 60 * 60 * 1000).toISOString(),
-		maxUses: 10,
-		uses: 0,
-	},
-	{
-		id: 'GbRGfY7hbs',
-		expiration: new Date(now + 3 * 24 * 60 * 60 * 1000).toISOString(),
-		maxUses: 10,
-		uses: 2,
-	},
-	{
-		id: 'k9mvD2QxLc',
-		expiration: new Date(now + 90 * 60 * 1000).toISOString(),
-		maxUses: 5,
-		uses: 4,
-	},
-])
-
-function revokeInvite(inviteId: string) {
-	activeInvites.value = activeInvites.value.filter((invite) => invite.id !== inviteId)
-}
-
-async function unpublishSharedInstance() {
-	unpublishing.value = true
-	try {
-		await unpublish_shared_instance(instance.value.id)
-		queryClient.setQueryData(['sharedInstanceUsers', instance.value.id], [])
-		await queryClient.invalidateQueries({ queryKey: ['linkedModpackInfo', instance.value.id] })
-		onUnlinked()
-	} catch (error) {
-		notifySharedInstanceError(error)
-	} finally {
-		unpublishing.value = false
-	}
-}
-
-const messages = defineMessages({
-	activeInvitesTitle: {
-		id: 'instance.settings.sharing.active-invites.title',
-		defaultMessage: 'Active invites',
-	},
-	activeInvitesDescription: {
-		id: 'instance.settings.sharing.active-invites.description',
-		defaultMessage: 'Anyone with one of these invite links can join while it remains active.',
-	},
-	inviteCodeLabel: {
-		id: 'instance.settings.sharing.active-invites.code',
-		defaultMessage: 'Invite link',
-	},
-	usesLabel: {
-		id: 'instance.settings.sharing.active-invites.uses',
-		defaultMessage: 'Uses',
-	},
-	expiresLabel: {
-		id: 'instance.settings.sharing.active-invites.expires',
-		defaultMessage: 'Expires',
-	},
-	actionsLabel: {
-		id: 'instance.settings.sharing.active-invites.actions',
-		defaultMessage: 'Actions',
-	},
-	noActiveInvites: {
-		id: 'instance.settings.sharing.active-invites.empty',
-		defaultMessage: 'There are no active invites.',
-	},
-	revokeInvite: {
-		id: 'instance.settings.sharing.active-invites.revoke',
-		defaultMessage: 'Revoke invite',
-	},
-	revokeInviteWithCode: {
-		id: 'instance.settings.sharing.active-invites.revoke-with-code',
-		defaultMessage: 'Revoke invite {code}',
-	},
-})
-</script>
@@ -9,7 +9,7 @@ import {
 } from '@modrinth/ui'
 import { computed, type Ref, ref, watch } from 'vue'

-import { edit } from '@/helpers/instance'
+import { edit } from '@/helpers/profile'
 import { get } from '@/helpers/settings.ts'
 import { injectInstanceSettings } from '@/providers/instance-settings'

@@ -22,17 +22,15 @@ const { instance } = injectInstanceSettings()

 const globalSettings = (await get().catch(handleError)) as AppSettings

-const overrideWindowSettings = ref(
-	!!instance.value.game_resolution || !!instance.value.force_fullscreen,
-)
+const overrideWindowSettings = ref(!!instance.game_resolution || !!instance.force_fullscreen)
 const resolution: Ref<[number, number]> = ref(
-	instance.value.game_resolution ?? (globalSettings.game_resolution.slice() as [number, number]),
+	instance.game_resolution ?? (globalSettings.game_resolution.slice() as [number, number]),
 )
 const fullscreenSetting: Ref<boolean> = ref(
-	instance.value.force_fullscreen ?? globalSettings.force_fullscreen,
+	instance.force_fullscreen ?? globalSettings.force_fullscreen,
 )

-const editInstanceObject = computed(() => {
+const editProfileObject = computed(() => {
 	if (!overrideWindowSettings.value) {
 		return {
 			force_fullscreen: null,
@@ -48,7 +46,7 @@ const editInstanceObject = computed(() => {
 watch(
 	[overrideWindowSettings, resolution, fullscreenSetting],
 	async () => {
-		await edit(instance.value.id, editInstanceObject.value)
+		await edit(instance.path, editProfileObject.value)
 	},
 	{ deep: true },
 )
@@ -94,14 +92,14 @@ const messages = defineMessages({
 </script>

 <template>
-	<div class="flex flex-col gap-6">
+	<div>
 		<Checkbox
 			v-model="overrideWindowSettings"
 			:label="formatMessage(messages.customWindowSettings)"
 		/>
-		<div class="flex items-center gap-4 justify-between">
-			<div class="flex flex-col gap-1">
-				<h2 class="m-0 text-lg font-semibold text-contrast">
+		<div class="mt-2 flex items-center gap-4 justify-between">
+			<div>
+				<h2 class="m-0 mb-1 text-lg font-extrabold text-contrast">
 					{{ formatMessage(messages.fullscreen) }}
 				</h2>
 				<p class="m-0">
@@ -120,9 +118,9 @@ const messages = defineMessages({
 			/>
 		</div>

-		<div class="flex items-center gap-4 justify-between">
-			<div class="flex flex-col gap-1">
-				<h2 class="m-0 text-lg font-semibold text-contrast">
+		<div class="mt-4 flex items-center gap-4 justify-between">
+			<div>
+				<h2 class="m-0 mb-1 text-lg font-extrabold text-contrast">
 					{{ formatMessage(messages.width) }}
 				</h2>
 				<p class="m-0">
@@ -139,9 +137,9 @@ const messages = defineMessages({
 			/>
 		</div>

-		<div class="flex items-center gap-4 justify-between">
-			<div class="flex flex-col gap-1">
-				<h2 class="m-0 text-lg font-semibold text-contrast">
+		<div class="mt-4 flex items-center gap-4 justify-between">
+			<div>
+				<h2 class="m-0 mb-1 text-lg font-extrabold text-contrast">
 					{{ formatMessage(messages.height) }}
 				</h2>
 				<p class="m-0">
@@ -14,7 +14,7 @@ import { hide_ads_window, show_ads_window } from '@/helpers/ads.js'
 import { login as login_flow, set_default_user } from '@/helpers/auth.js'
 import { handleSevereError } from '@/store/error.js'

-import { findMinecraftAuthError, type MinecraftAuthError } from './minecraft-auth-errors'
+import { type MinecraftAuthError, minecraftAuthErrors } from './minecraft-auth-errors'

 const modal = ref<InstanceType<typeof NewModal>>()
 const rawError = ref<string>('')
@@ -26,7 +26,7 @@ const loadingSignIn = ref(false)
 function show(errorVal: { message?: string }) {
 	rawError.value = errorVal?.message ?? String(errorVal)

-	matchedError.value = findMinecraftAuthError(rawError.value)
+	matchedError.value = minecraftAuthErrors.find((e) => rawError.value.includes(e.errorCode)) ?? null

 	debugCollapsed.value = true
 	hide_ads_window()
@@ -1,93 +1,10 @@
 export interface MinecraftAuthError {
-	errorCode?: string
-	errorMatchers?: string[]
-	matches?: (message: string) => boolean
+	errorCode: string
 	whatHappened: string
 	stepsToFix: string[]
 }

 export const minecraftAuthErrors: MinecraftAuthError[] = [
-	{
-		errorMatchers: ['Failed to deserialize response to JSON during step RefreshOAuthToken:'],
-		whatHappened:
-			'Your saved Microsoft sign-in token has expired or was revoked, so Modrinth App cannot refresh your Minecraft session.',
-		stepsToFix: [
-			'Sign out of the affected Minecraft account in Modrinth App',
-			'Sign in to the account again',
-			'Once the new sign-in finishes, try launching Minecraft again',
-		],
-	},
-	{
-		errorMatchers: ['Failed to deserialize response to JSON during step SisuAuthenticate:'],
-		whatHappened:
-			'Xbox services rejected the first sign-in response. This is most often caused by your system clock or time zone being out of sync.',
-		stepsToFix: [
-			'Open your system date and time settings',
-			'Turn on automatic time zone and automatic time, if available',
-			'Use the sync option in your system settings to synchronize the clock',
-			'Restart Modrinth App',
-			'Try signing in again',
-		],
-	},
-	{
-		matches: (message) =>
-			message.includes('Failed to deserialize response to JSON during step MinecraftToken:') &&
-			message.includes('429 Too Many Requests'),
-		whatHappened:
-			'Microsoft or Minecraft temporarily blocked the sign-in request because there were too many recent attempts.',
-		stepsToFix: [
-			'Wait about an hour before trying again',
-			'Restart Modrinth App after waiting',
-			'Try signing in once more',
-			'If the same message appears, wait longer before retrying so the temporary limit can clear',
-		],
-	},
-	{
-		matches: (message) =>
-			message.includes('Failed to deserialize response to JSON during step MinecraftToken:') &&
-			/Status Code: 5\d\d/.test(message),
-		whatHappened:
-			"Minecraft's authentication service is returning a server error, so Modrinth App cannot finish signing you in right now.",
-		stepsToFix: [
-			'Wait a few minutes and try signing in again',
-			'Check <a href="https://support.xbox.com/xbox-live-status">Xbox Status</a> for current service issues',
-			'Try signing in with the <a href="https://www.minecraft.net/en-us/download">official Minecraft Launcher</a> to confirm whether Minecraft sign-in is also affected there',
-			'If the service is healthy and this keeps happening, contact support with the debug information below',
-		],
-	},
-	{
-		errorMatchers: ['Failed to fetch player profile'],
-		whatHappened:
-			'Minecraft services could not return a Java Edition profile for this account. This most often happens when the game was purchased recently, the Java profile has not finished being created, or the wrong Microsoft account is being used.',
-		stepsToFix: [
-			'Sign in with the <a href="https://www.minecraft.net/en-us/download">official Minecraft Launcher</a>',
-			'Launch Minecraft: Java Edition once from the official launcher',
-			'Wait up to an hour if the purchase or profile setup was recent',
-			'Make sure you are using the Microsoft account that owns Minecraft. See <a href="https://support.modrinth.com/en/articles/9409136-finding-the-right-xbox-account">Finding the right Xbox account</a> for help',
-			'Try signing in to Modrinth App again',
-		],
-	},
-	{
-		matches: (message) =>
-			message.includes('error sending request for url (') &&
-			[
-				'minecraft.net',
-				'minecraftservices.com',
-				'mojang.com',
-				'xbox.com',
-				'xboxlive.com',
-				'live.com',
-			].some((domain) => message.includes(domain)),
-		whatHappened:
-			'Modrinth App could not connect to a Microsoft, Xbox, or Minecraft service needed for sign-in. This is usually caused by a local network, DNS, proxy, firewall, hosts file, VPN, or antivirus issue.',
-		stepsToFix: [
-			'Restart Modrinth App and try signing in again',
-			'Check that your internet connection is working',
-			'Allow Modrinth App through your firewall, antivirus, proxy, VPN, and hosts file rules',
-			'Try a different network or temporarily disable VPN/proxy software if you use one',
-			'If routing or DNS is the issue, a service like Cloudflare WARP can sometimes help',
-		],
-	},
 	{
 		errorCode: '2148916222',
 		whatHappened:
@@ -170,31 +87,4 @@ export const minecraftAuthErrors: MinecraftAuthError[] = [
 			'Once finished, try signing in again',
 		],
 	},
-	{
-		errorMatchers: ['Failed to deserialize response to JSON during step XstsAuthorize:'],
-		whatHappened:
-			'Xbox services rejected the request to authorize this account for Minecraft services, but did not return a specific account restriction that Modrinth App recognizes.',
-		stepsToFix: [
-			'Sign in with the <a href="https://www.minecraft.net/en-us/download">official Minecraft Launcher</a>',
-			'Complete any prompts shown by Microsoft, Xbox, or Minecraft',
-			'Try signing in to Modrinth App again',
-			'If the official launcher also fails, follow the error shown there or contact Xbox Support',
-		],
-	},
 ]
-
-export function findMinecraftAuthError(message: string): MinecraftAuthError | null {
-	return (
-		minecraftAuthErrors.find((error) => {
-			if (error.errorCode && message.includes(error.errorCode)) {
-				return true
-			}
-
-			if (error.errorMatchers?.some((matcher) => message.includes(matcher))) {
-				return true
-			}
-
-			return error.matches?.(message) ?? false
-		}) ?? null
-	)
-}
@@ -1,144 +0,0 @@
-<template>
-	<NewModal ref="modal" :header="formatMessage(messages.header)" max-width="544px" no-padding>
-		<div class="grid grid-cols-[1fr_auto] gap-2.5 h-[154px] px-7 pt-4 pb-1 pr-9">
-			<div class="flex flex-col gap-2.5 items-start justify-center h-min mt-5">
-				<div class="font-semibold text-xl text-contrast">
-					{{ formatMessage(messages.descriptionHeader) }}
-				</div>
-				<div class="text-secondary leading-6">
-					{{ formatMessage(messages.description) }}
-				</div>
-			</div>
-			<div class="relative h-full w-[96px] overflow-hidden mx-3">
-				<div class="absolute top-0 left-0 z-0 w-full flex grow-0 flex-col items-end p-0">
-					<img :src="steveImage" alt="" class="self-stretch" />
-				</div>
-				<div
-					class="absolute left-0 bottom-0 z-10 order-1 h-6 w-[120px] shrink-0 grow-0 bg-[linear-gradient(180deg,rgba(39,41,46,0)_0%,#27292E_80%,#27292E_100%)]"
-				></div>
-			</div>
-		</div>
-
-		<div class="flex flex-col gap-6 px-6 pb-6">
-			<div class="flex justify-end gap-2">
-				<ButtonStyled>
-					<a class="w-full !shadow-none" href="https://support.modrinth.com" @click="modal?.hide()">
-						<MessagesSquareIcon />
-						{{ formatMessage(messages.getSupport) }}
-					</a>
-				</ButtonStyled>
-				<ButtonStyled color="brand">
-					<button class="w-full !shadow-none" :disabled="loadingSignIn" @click="signIn">
-						<SpinnerIcon v-if="loadingSignIn" class="animate-spin" />
-						<svg
-							v-else
-							width="20"
-							height="20"
-							viewBox="0 0 20 20"
-							fill="none"
-							xmlns="http://www.w3.org/2000/svg"
-						>
-							<rect width="9.25" height="9.25" fill="black" fill-opacity="0.9" />
-							<rect x="10.75" width="9.25" height="9.25" fill="black" fill-opacity="0.9" />
-							<rect y="10.75" width="9.25" height="9.25" fill="black" fill-opacity="0.9" />
-							<rect
-								x="10.75"
-								y="10.75"
-								width="9.25"
-								height="9.25"
-								fill="black"
-								fill-opacity="0.9"
-							/>
-						</svg>
-						{{ formatMessage(messages.signIn) }}
-					</button>
-				</ButtonStyled>
-			</div>
-			<p class="m-0 text-center text-sm text-secondary">
-				{{ formatMessage(messages.dontHaveAccount) }}
-				<a
-					class="text-blue font-medium hover:underline"
-					href="https://www.minecraft.net/en-us/store/minecraft-java-bedrock-edition-pc"
-				>
-					{{ formatMessage(messages.getMinecraft) }}
-				</a>
-			</p>
-		</div>
-	</NewModal>
-</template>
-
-<script setup lang="ts">
-import { MessagesSquareIcon, SpinnerIcon } from '@modrinth/assets'
-import { ButtonStyled, defineMessages, NewModal, useVIntl } from '@modrinth/ui'
-import { inject, type Ref, ref } from 'vue'
-
-import steveImage from '@/assets/steve-look-up-left.webp'
-import type AccountsCard from '@/components/ui/AccountsCard.vue'
-import { trackEvent } from '@/helpers/analytics'
-import { login as loginFlow, set_default_user } from '@/helpers/auth.js'
-import { handleSevereError } from '@/store/error.js'
-
-const { formatMessage } = useVIntl()
-const accountsCard = inject('accountsCard') as Ref<InstanceType<typeof AccountsCard> | null>
-
-const messages = defineMessages({
-	header: {
-		id: 'minecraft-required.header',
-		defaultMessage: 'Minecraft required',
-	},
-	descriptionHeader: {
-		id: 'minecraft-required.description-header',
-		defaultMessage: 'Sign in to a Microsoft account',
-	},
-	description: {
-		id: 'minecraft-required.description',
-		defaultMessage:
-			'You need a Microsoft account that owns Minecraft before you can launch and play.',
-	},
-	getSupport: {
-		id: 'minecraft-required.get-support',
-		defaultMessage: 'Get support',
-	},
-	signIn: {
-		id: 'minecraft-required.sign-in',
-		defaultMessage: 'Sign in to Microsoft',
-	},
-	dontHaveAccount: {
-		id: 'minecraft-required.dont-have-account',
-		defaultMessage: 'Don’t have an account?',
-	},
-	getMinecraft: {
-		id: 'minecraft-required.get-minecraft',
-		defaultMessage: 'Get Minecraft',
-	},
-})
-
-const modal = ref<InstanceType<typeof NewModal>>()
-const loadingSignIn = ref(false)
-
-function show() {
-	modal.value?.show()
-}
-
-async function signIn() {
-	loadingSignIn.value = true
-
-	try {
-		const loggedIn = await loginFlow()
-		if (!loggedIn) return
-
-		await set_default_user(loggedIn.profile.id)
-		await accountsCard.value?.refreshValues()
-		await trackEvent('AccountLogIn', { source: 'MinecraftRequiredModal' })
-		modal.value?.hide()
-	} catch (error) {
-		handleSevereError(error)
-	} finally {
-		loadingSignIn.value = false
-	}
-}
-
-defineExpose({
-	show,
-})
-</script>
@@ -3,48 +3,36 @@ import {
 	CoffeeIcon,
 	GameIcon,
 	GaugeIcon,
-	HeartHandshakeIcon,
 	LanguagesIcon,
 	ModrinthIcon,
 	PaintbrushIcon,
-	Settings2Icon,
+	ReportIcon,
+	SettingsIcon,
 	ShieldIcon,
-	ToggleRightIcon,
-	UserIcon,
 } from '@modrinth/assets'
 import {
 	commonMessages,
-	commonSettingsMessages,
 	defineMessage,
 	defineMessages,
 	ProgressBar,
 	TabbedModal,
-	UnsavedChangesPopup,
 	useVIntl,
 } from '@modrinth/ui'
 import { getVersion } from '@tauri-apps/api/app'
 import { platform as getOsPlatform, version as getOsVersion } from '@tauri-apps/plugin-os'
-import { computed, provide, ref, watch } from 'vue'
+import { ref, watch } from 'vue'

-import PrivacySettings from '@/components/ui/settings/account/PrivacySettings.vue'
-import ProfileSettings from '@/components/ui/settings/account/ProfileSettings.vue'
-import SocialSettings from '@/components/ui/settings/account/SocialSettings.vue'
-import AppearanceSettings from '@/components/ui/settings/display/AppearanceSettings.vue'
-import BehaviorSettings from '@/components/ui/settings/display/BehaviorSettings.vue'
-import FeatureFlagSettings from '@/components/ui/settings/display/FeatureFlagSettings.vue'
-import LanguageSettings from '@/components/ui/settings/display/LanguageSettings.vue'
-import DefaultInstanceSettings from '@/components/ui/settings/instances/DefaultInstanceSettings.vue'
-import JavaSettings from '@/components/ui/settings/instances/JavaSettings.vue'
-import ResourceManagementSettings from '@/components/ui/settings/instances/ResourceManagementSettings.vue'
+import AppearanceSettings from '@/components/ui/settings/AppearanceSettings.vue'
+import DefaultInstanceSettings from '@/components/ui/settings/DefaultInstanceSettings.vue'
+import FeatureFlagSettings from '@/components/ui/settings/FeatureFlagSettings.vue'
+import JavaSettings from '@/components/ui/settings/JavaSettings.vue'
+import LanguageSettings from '@/components/ui/settings/LanguageSettings.vue'
+import PrivacySettings from '@/components/ui/settings/PrivacySettings.vue'
+import ResourceManagementSettings from '@/components/ui/settings/ResourceManagementSettings.vue'
 import { get, set } from '@/helpers/settings.ts'
-import {
-	appSettingsModalContextKey,
-	type UnsavedChangesController,
-} from '@/providers/app-settings-modal'
 import { injectAppUpdateDownloadProgress } from '@/providers/download-progress.ts'
 import { useTheming } from '@/store/state'

-// TODO: Apply COMPONENT_STRUCTURE.md here and extract out common setting option components
 const themeStore = useTheming()

 const { formatMessage } = useVIntl()
@@ -56,162 +44,74 @@ const developerModeEnabled = defineMessage({
 	defaultMessage: 'Developer mode enabled.',
 })

-const tabCategories = defineMessages({
-	display: {
-		id: 'settings.sidebar.label.display',
-		defaultMessage: 'Display',
-	},
-	account: {
-		id: 'settings.sidebar.label.account',
-		defaultMessage: 'Account',
-	},
-	instances: {
-		id: 'app.settings.sidebar.label.instances',
-		defaultMessage: 'Instances',
-	},
-})
-
 const tabs = [
 	{
 		name: defineMessage({
 			id: 'app.settings.tabs.appearance',
 			defaultMessage: 'Appearance',
 		}),
-		category: tabCategories.display,
 		icon: PaintbrushIcon,
 		content: AppearanceSettings,
 	},
-	{
-		name: defineMessage({
-			id: 'app.settings.tabs.behavior',
-			defaultMessage: 'Behavior',
-		}),
-		category: tabCategories.display,
-		icon: Settings2Icon,
-		content: BehaviorSettings,
-	},
 	{
 		name: defineMessage({
 			id: 'app.settings.tabs.language',
 			defaultMessage: 'Language',
 		}),
-		category: tabCategories.display,
 		icon: LanguagesIcon,
 		content: LanguageSettings,
 		badge: commonMessages.beta,
 	},
-	{
-		name: commonSettingsMessages.featureFlags,
-		category: tabCategories.display,
-		icon: ToggleRightIcon,
-		content: FeatureFlagSettings,
-		developerOnly: true,
-	},
-	{
-		name: commonSettingsMessages.profile,
-		category: tabCategories.account,
-		icon: UserIcon,
-		content: ProfileSettings,
-	},
-	{
-		name: commonSettingsMessages.social,
-		category: tabCategories.account,
-		icon: HeartHandshakeIcon,
-		content: SocialSettings,
-	},
 	{
 		name: defineMessage({
 			id: 'app.settings.tabs.privacy',
 			defaultMessage: 'Privacy',
 		}),
-		category: tabCategories.account,
 		icon: ShieldIcon,
 		content: PrivacySettings,
 	},
-	{
-		name: defineMessage({
-			id: 'app.settings.tabs.default-instance-options',
-			defaultMessage: 'Default game options',
-		}),
-		category: tabCategories.instances,
-		icon: GameIcon,
-		content: DefaultInstanceSettings,
-	},
 	{
 		name: defineMessage({
 			id: 'app.settings.tabs.java-installations',
 			defaultMessage: 'Java installations',
 		}),
-		category: tabCategories.instances,
 		icon: CoffeeIcon,
 		content: JavaSettings,
 	},
+	{
+		name: defineMessage({
+			id: 'app.settings.tabs.default-instance-options',
+			defaultMessage: 'Default instance options',
+		}),
+		icon: GameIcon,
+		content: DefaultInstanceSettings,
+	},
 	{
 		name: defineMessage({
 			id: 'app.settings.tabs.resource-management',
 			defaultMessage: 'Resource management',
 		}),
-		category: tabCategories.instances,
 		icon: GaugeIcon,
 		content: ResourceManagementSettings,
 	},
+	{
+		name: defineMessage({
+			id: 'app.settings.tabs.feature-flags',
+			defaultMessage: 'Feature flags',
+		}),
+		icon: ReportIcon,
+		content: FeatureFlagSettings,
+		developerOnly: true,
+	},
 ]

-const availableTabs = computed(() => tabs.filter((tab) => !tab.developerOnly || themeStore.devMode))
-
 const modal = ref<InstanceType<typeof TabbedModal> | null>(null)
-const unsavedChangesPopup = ref<{ nudge: () => void } | null>(null)
-const unsavedChangesController = ref<UnsavedChangesController | null>(null)
-const emptyUnsavedChangesState: Record<string, unknown> = {}
-const originalUnsavedChangesState = computed(
-	() => unsavedChangesController.value?.getOriginal() ?? emptyUnsavedChangesState,
-)
-const modifiedUnsavedChangesState = computed(
-	() => unsavedChangesController.value?.getModified() ?? emptyUnsavedChangesState,
-)
-const savingUnsavedChanges = computed(() => unsavedChangesController.value?.isSaving() ?? false)
-const hasUnsavedChanges = computed(() => unsavedChangesController.value?.hasChanges() ?? false)
-
-function canLeaveCurrentTab(): boolean {
-	if (!unsavedChangesController.value?.hasChanges()) return true
-	unsavedChangesPopup.value?.nudge()
-	return false
-}
-
-function close(): boolean {
-	return modal.value?.hide() ?? false
-}
-
-function registerUnsavedChangesController(controller: UnsavedChangesController | null): void {
-	unsavedChangesController.value = controller
-}
-
-provide(appSettingsModalContextKey, {
-	close,
-	registerUnsavedChangesController,
-})
-
-function resetUnsavedChanges(): void {
-	unsavedChangesController.value?.reset()
-}
-
-function saveUnsavedChanges(): void {
-	void unsavedChangesController.value?.save()
-}

 function show() {
 	modal.value?.show()
 }

-function showProfile(): void {
-	const profileTabIndex = availableTabs.value.findIndex((tab) => tab.content === ProfileSettings)
-	if (profileTabIndex >= 0) {
-		modal.value?.setTab(profileTabIndex)
-	}
-	modal.value?.show()
-}
-
-defineExpose({ show, showProfile })
+defineExpose({ show })

 const { progress, version: downloadingVersion } = injectAppUpdateDownloadProgress()

@@ -231,15 +131,12 @@ watch(
 function devModeCount() {
 	devModeCounter.value++
 	if (devModeCounter.value > 5) {
-		const selectedTab = modal.value ? availableTabs.value[modal.value.selectedTab] : undefined
-
 		themeStore.devMode = !themeStore.devMode
 		settings.value.developer_mode = !!themeStore.devMode
 		devModeCounter.value = 0

-		if (modal.value) {
-			const selectedTabIndex = selectedTab ? availableTabs.value.indexOf(selectedTab) : -1
-			modal.value.setTab(selectedTabIndex >= 0 ? selectedTabIndex : 0)
+		if (!themeStore.devMode && tabs[modal.value!.selectedTab].developerOnly) {
+			modal.value!.setTab(0)
 		}
 	}
 }
@@ -249,45 +146,15 @@ const messages = defineMessages({
 		id: 'app.settings.downloading',
 		defaultMessage: 'Downloading v{version}',
 	},
-	appVersion: {
-		id: 'app.settings.app-version',
-		defaultMessage: 'Modrinth App {version}',
-	},
-	macos: {
-		id: 'app.settings.operating-system.macos',
-		defaultMessage: 'macOS',
-	},
-	developerModeButtonLabel: {
-		id: 'app.settings.developer-mode-button.label',
-		defaultMessage: 'Toggle developer mode',
-	},
 })
 </script>
 <template>
-	<TabbedModal
-		ref="modal"
-		:tabs="availableTabs"
-		:width="'min(928px, calc(95vw - 10rem))'"
-		:before-hide="canLeaveCurrentTab"
-		:before-tab-change="canLeaveCurrentTab"
-		:floating-action-bar-shown="hasUnsavedChanges"
-	>
+	<TabbedModal ref="modal" :tabs="tabs.filter((t) => !t.developerOnly || themeStore.devMode)">
 		<template #title>
-			<span class="text-2xl font-semibold text-contrast">
-				{{ formatMessage(commonMessages.settingsLabel) }}
+			<span class="flex items-center gap-2 text-lg font-extrabold text-contrast">
+				<SettingsIcon /> Settings
 			</span>
 		</template>
-		<template #floating-action-bar>
-			<UnsavedChangesPopup
-				ref="unsavedChangesPopup"
-				:original="originalUnsavedChangesState"
-				:modified="modifiedUnsavedChangesState"
-				:saving="savingUnsavedChanges"
-				inline
-				@reset="resetUnsavedChanges"
-				@save="saveUnsavedChanges"
-			/>
-		</template>
 		<template #footer>
 			<div class="mt-auto text-secondary text-sm">
 				<div class="mb-3">
@@ -303,7 +170,6 @@ const messages = defineMessages({
 				</p>
 				<div class="flex items-center gap-3">
 					<button
-						:aria-label="formatMessage(messages.developerModeButtonLabel)"
 						class="p-0 m-0 bg-transparent border-none cursor-pointer button-animation"
 						:class="{
 							'text-brand': themeStore.devMode,
@@ -311,14 +177,12 @@ const messages = defineMessages({
 						}"
 						@click="devModeCount"
 					>
-						<ModrinthIcon aria-hidden="true" class="w-6 h-6" />
+						<ModrinthIcon class="w-6 h-6" />
 					</button>
-					<div class="max-w-[200px]">
+					<div>
+						<p class="m-0">Modrinth App {{ version }}</p>
 						<p class="m-0">
-							{{ formatMessage(messages.appVersion, { version }) }}
-						</p>
-						<p class="m-0">
-							<span v-if="osPlatform === 'macos'">{{ formatMessage(messages.macos) }}</span>
+							<span v-if="osPlatform === 'macos'">macOS</span>
 							<span v-else class="capitalize">{{ osPlatform }}</span>
 							{{ osVersion }}
 						</p>
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { LogInIcon, SpinnerIcon } from '@modrinth/assets'
+import { ref } from 'vue'
+
+import ModalWrapper from '@/components/ui/modal/ModalWrapper.vue'
+
+defineProps({
+	onFlowCancel: {
+		type: Function,
+		default() {
+			return async () => {}
+		},
+	},
+})
+
+const modal = ref()
+
+function show() {
+	modal.value.show()
+}
+
+function hide() {
+	modal.value.hide()
+}
+
+defineExpose({ show, hide })
+</script>
+<template>
+	<ModalWrapper ref="modal" @hide="onFlowCancel">
+		<template #title>
+			<span class="items-center gap-2 text-lg font-extrabold text-contrast">
+				<LogInIcon /> Sign in
+			</span>
+		</template>
+
+		<div class="flex justify-center gap-2">
+			<SpinnerIcon class="w-12 h-12 animate-spin" />
+		</div>
+		<p class="text-sm text-secondary">
+			Please sign in at the browser window that just opened to continue.
+		</p>
+	</ModalWrapper>
+</template>
@@ -7,7 +7,7 @@
 		<template #actions>
 			<div class="flex gap-2 justify-end">
 				<ButtonStyled type="outlined">
-					<button @click="modal?.hide()">
+					<button class="!border !border-surface-4" @click="modal?.hide()">
 						<XIcon />
 						{{ formatMessage(commonMessages.cancelButton) }}
 					</button>
@@ -1,22 +1,15 @@
 <template>
-	<NewModal
-		ref="modal"
-		:header="formatMessage(messages.installToPlay)"
-		:closable="true"
-		:on-hide="show_ads_window"
-		max-width="544px"
-		width="544px"
-	>
-		<div v-if="requiredContentProject" class="flex w-full flex-col gap-6">
-			<p class="m-0 text-primary">
-				{{ formatMessage(messages.inviteWarning) }}
-			</p>
+	<NewModal ref="modal" :header="formatMessage(messages.installToPlay)" :closable="true">
+		<div v-if="requiredContentProject" class="flex flex-col gap-6 max-w-[500px]">
+			<Admonition type="info" :header="formatMessage(messages.contentRequired)">
+				{{ formatMessage(messages.serverRequiresMods) }}
+			</Admonition>

-			<div class="flex flex-col gap-2.5">
-				<div class="flex items-center justify-between">
-					<span class="font-semibold text-contrast">
-						{{ formatMessage(messages.sharedInstance) }}
-					</span>
+			<div class="flex flex-col gap-1">
+				<div class="flex justify-between items-center">
+					<span class="font-semibold text-contrast">{{
+						formatMessage(messages.requiredModpack)
+					}}</span>

 					<ButtonStyled type="transparent">
 						<button @click="openViewContents">
@@ -26,16 +19,14 @@
 					</ButtonStyled>
 				</div>

-				<div class="flex items-center gap-3 rounded-2xl bg-surface-2 p-3">
+				<div class="flex items-center gap-3 rounded-xl bg-surface-2 p-3">
 					<Avatar
 						:src="requiredContentProject.icon_url"
 						:alt="requiredContentProject.title"
-						size="56px"
-						no-shadow
-						class="!rounded-2xl"
+						size="48px"
 					/>
-					<div class="flex min-w-0 flex-col gap-0.5">
-						<span class="truncate font-semibold text-contrast">
+					<div class="flex flex-col gap-0.5">
+						<span class="font-semibold text-contrast">
 							<template v-if="usingCustomModpack && modpackVersion">
 								{{ modpackVersion.name }}
 							</template>
@@ -43,7 +34,7 @@
 								{{ requiredContentProject.title }}
 							</template>
 						</span>
-						<span class="truncate text-sm font-medium text-secondary">
+						<span class="text-sm text-secondary">
 							{{ loaderDisplay }} {{ requiredContentProject.game_versions?.[0] }}
 							<template v-if="modCount">
 								· {{ formatMessage(messages.modCount, { count: modCount }) }}
@@ -52,105 +43,24 @@
 					</div>
 				</div>
 			</div>
+		</div>

-			<Admonition
-				v-if="hasExternalFiles"
-				type="warning"
-				:header="formatMessage(messages.unknownFilesWarning)"
-			>
-				{{ formatMessage(messages.unknownFilesDescription) }}
-			</Admonition>
-
-			<div v-if="hasExternalFiles" class="relative w-full">
-				<div
-					ref="externalFileTable"
-					class="max-h-[242px] overflow-y-auto rounded-2xl"
-					@scroll="checkTableScrollState"
-				>
-					<Table
-						:columns="externalFileColumns"
-						:data="externalFileRows"
-						row-key="id"
-						virtualized
-						:virtual-row-height="48"
-						class="shadow-sm"
-					>
-						<template #cell-name="{ value }">
-							<span class="block truncate" :title="String(value)">{{ value }}</span>
-						</template>
-					</Table>
-				</div>
-				<Transition
-					enter-active-class="transition-all duration-200 ease-out"
-					enter-from-class="opacity-0 max-h-0"
-					enter-to-class="opacity-100 max-h-2"
-					leave-active-class="transition-all duration-200 ease-in"
-					leave-from-class="opacity-100 max-h-2"
-					leave-to-class="opacity-0 max-h-0"
-				>
-					<div
-						v-if="showTableTopFade"
-						class="pointer-events-none absolute left-0 right-0 top-0 z-10 h-2 bg-gradient-to-b from-bg-raised to-transparent"
-					/>
-				</Transition>
-				<Transition
-					enter-active-class="transition-all duration-200 ease-out"
-					enter-from-class="opacity-0 max-h-0"
-					enter-to-class="opacity-100 max-h-2"
-					leave-active-class="transition-all duration-200 ease-in"
-					leave-from-class="opacity-100 max-h-2"
-					leave-to-class="opacity-0 max-h-0"
-				>
-					<div
-						v-if="showTableBottomFade"
-						class="pointer-events-none absolute bottom-0 left-0 right-0 z-10 h-2 bg-gradient-to-t from-bg-raised to-transparent"
-					/>
-				</Transition>
-			</div>
-
-			<p v-if="hasExternalFiles" class="m-0 text-primary">
-				{{ formatMessage(messages.reviewedFiles) }}
-			</p>
-
-			<div class="flex w-full items-center justify-between gap-2">
-				<ButtonStyled type="transparent" color="red">
-					<button @click="handleReport">
-						<ReportIcon />
-						{{ formatMessage(commonMessages.reportButton) }}
+		<template #actions>
+			<div class="flex justify-end gap-2">
+				<ButtonStyled>
+					<button @click="handleDecline">
+						<XIcon />
+						{{ formatMessage(commonMessages.cancelButton) }}
+					</button>
+				</ButtonStyled>
+				<ButtonStyled color="brand">
+					<button @click="handleAccept">
+						<DownloadIcon />
+						{{ formatMessage(messages.installButton) }}
 					</button>
 				</ButtonStyled>
-
-				<div class="flex items-center gap-2">
-					<template v-if="hasExternalFiles">
-						<ButtonStyled type="transparent" color="orange">
-							<button @click="handleAccept">
-								{{ formatMessage(messages.installAnyway) }}
-							</button>
-						</ButtonStyled>
-						<ButtonStyled color="brand">
-							<button @click="handleDecline">
-								<BanIcon />
-								{{ formatMessage(messages.dontInstall) }}
-							</button>
-						</ButtonStyled>
-					</template>
-					<template v-else>
-						<ButtonStyled>
-							<button @click="handleDecline">
-								<XIcon />
-								{{ formatMessage(commonMessages.cancelButton) }}
-							</button>
-						</ButtonStyled>
-						<ButtonStyled color="brand">
-							<button @click="handleAccept">
-								<DownloadIcon />
-								{{ formatMessage(messages.installButton) }}
-							</button>
-						</ButtonStyled>
-					</template>
-				</div>
 			</div>
-		</div>
+		</template>
 	</NewModal>

 	<ModpackContentModal
@@ -162,56 +72,33 @@

 <script setup lang="ts">
 import type { Labrinth } from '@modrinth/api-client'
-import { BanIcon, DownloadIcon, EyeIcon, ReportIcon, XIcon } from '@modrinth/assets'
+import { DownloadIcon, EyeIcon, XIcon } from '@modrinth/assets'
+import type { ContentItem } from '@modrinth/ui'
 import {
 	Admonition,
 	Avatar,
 	ButtonStyled,
 	commonMessages,
-	type ContentItem,
 	defineMessages,
 	formatLoader,
 	ModpackContentModal,
 	NewModal,
-	Table,
-	type TableColumn,
-	useScrollIndicator,
 	useVIntl,
 } from '@modrinth/ui'
-import { openUrl } from '@tauri-apps/plugin-opener'
-import { computed, nextTick, ref } from 'vue'
+import { computed, ref } from 'vue'

 import { hide_ads_window, show_ads_window } from '@/helpers/ads'
 import { get_project, get_project_many, get_version, get_version_many } from '@/helpers/cache.js'
 import { injectServerInstall } from '@/providers/server-install'

-type ExternalFileColumn = 'name'
-type ExternalFileRow = {
-	id: string
-	name: string
-}
-
 const modal = ref<InstanceType<typeof NewModal>>()
 const modpackVersionId = ref<string | null>(null)
 const modpackVersion = ref<Labrinth.Versions.v2.Version | null>(null)
 const project = ref<Labrinth.Projects.v3.Project | null>(null)
 const requiredContentProject = ref<Labrinth.Projects.v2.Project | null>(null)
-const externalFiles = ref<string[]>([])
-const externalFileTable = ref<HTMLElement | null>(null)
 const onInstallComplete = ref<() => void>(() => {})
 const { formatMessage } = useVIntl()
-
-const props = defineProps<{
-	showExternalWarnings?: boolean
-}>()
-
 const { installServerProject, startInstallingServer, stopInstallingServer } = injectServerInstall()
-const {
-	showTopFade: showTableTopFade,
-	showBottomFade: showTableBottomFade,
-	checkScrollState: checkTableScrollState,
-	forceCheck: forceCheckTableScroll,
-} = useScrollIndicator(externalFileTable)

 const usingCustomModpack = computed(() => {
 	return requiredContentProject.value?.id === project.value?.id
@@ -224,36 +111,13 @@ const loaderDisplay = computed(() => {
 })

 const modCount = computed(() => modpackVersion.value?.dependencies?.length)
-const hasExternalFiles = computed(
-	() => Boolean(props.showExternalWarnings) && externalFiles.value.length > 0,
-)
-const externalFileRows = computed<ExternalFileRow[]>(() =>
-	externalFiles.value.map((name, index) => ({
-		id: `${index}-${name}`,
-		name,
-	})),
-)

 async function fetchData(versionId: string) {
 	// cache is making version null for some reason so bypassing for now
-	const version = await get_version(versionId, 'bypass')
-	modpackVersion.value = version
+	modpackVersion.value = await get_version(versionId, 'bypass')

-	if (version?.project_id) {
-		requiredContentProject.value = await get_project(version.project_id, 'bypass')
-		externalFiles.value = [
-			...new Set(
-				(version.dependencies ?? [])
-					.filter(
-						(dependency) =>
-							dependency.dependency_type === 'embedded' &&
-							!dependency.project_id &&
-							!dependency.version_id &&
-							dependency.file_name,
-					)
-					.flatMap((dependency) => (dependency.file_name ? [dependency.file_name] : [])),
-			),
-		].sort((left, right) => left.localeCompare(right))
+	if (modpackVersion.value?.project_id) {
+		requiredContentProject.value = await get_project(modpackVersion.value.project_id, 'bypass')
 	}
 }

@@ -275,12 +139,6 @@ function handleDecline() {
 	hide()
 }

-function handleReport() {
-	if (project.value?.id) {
-		openUrl(`https://modrinth.com/report?item=project&itemID=${project.value.id}`)
-	}
-}
-
 const modpackContentModal = ref<InstanceType<typeof ModpackContentModal>>()

 async function openViewContents() {
@@ -359,19 +217,17 @@ async function show(
 	modpackVersionId.value = modpackVersionIdVal
 	modpackVersion.value = null
 	requiredContentProject.value = null
-	externalFiles.value = []
 	onInstallComplete.value = callback

 	if (modpackVersionIdVal) await fetchData(modpackVersionIdVal)

 	hide_ads_window()
 	modal.value?.show(e)
-	await nextTick()
-	forceCheckTableScroll()
 }

 function hide() {
 	modal.value?.hide()
+	show_ads_window()
 }

 const messages = defineMessages({
@@ -379,10 +235,22 @@ const messages = defineMessages({
 		id: 'app.modal.install-to-play.header',
 		defaultMessage: 'Install to play',
 	},
-	inviteWarning: {
-		id: 'app.modal.install-to-play.invite-warning',
+	sharedServerInstance: {
+		id: 'app.modal.install-to-play.shared-server-instance',
+		defaultMessage: 'Shared server instance',
+	},
+	contentRequired: {
+		id: 'app.modal.install-to-play.content-required',
+		defaultMessage: 'Content required',
+	},
+	serverRequiresMods: {
+		id: 'app.modal.install-to-play.server-requires-mods',
 		defaultMessage:
-			'This invite was created by another Modrinth user, not Modrinth. Only accept invites from people you trust.',
+			'This server requires mods to play. Click Install to set up the required files from Modrinth, then launch directly into the server.',
+	},
+	requiredModpack: {
+		id: 'app.modal.install-to-play.required-modpack',
+		defaultMessage: 'Required modpack',
 	},
 	sharedInstance: {
 		id: 'app.modal.install-to-play.shared-instance',
@@ -400,41 +268,7 @@ const messages = defineMessages({
 		id: 'app.modal.install-to-play.view-contents',
 		defaultMessage: 'View contents',
 	},
-	unknownFilesWarning: {
-		id: 'app.modal.install-to-play.unknown-files-warning',
-		defaultMessage: 'Unknown files warning',
-	},
-	unknownFilesDescription: {
-		id: 'app.modal.install-to-play.unknown-files-description',
-		defaultMessage:
-			'This server modpack contains files that aren’t published on Modrinth. We strongly recommend only installing files from sources you trust.',
-	},
-	unrecognizedFiles: {
-		id: 'app.modal.install-to-play.unrecognized-files',
-		defaultMessage: 'Unrecognized files',
-	},
-	reviewedFiles: {
-		id: 'app.modal.install-to-play.reviewed-files',
-		defaultMessage:
-			'A file is only reviewed if it’s published to Modrinth, regardless of its file format (including .mrpack).',
-	},
-	installAnyway: {
-		id: 'app.modal.install-to-play.install-anyway',
-		defaultMessage: 'Install anyway',
-	},
-	dontInstall: {
-		id: 'app.modal.install-to-play.external-files-dont-install',
-		defaultMessage: "Don't install",
-	},
 })

-const externalFileColumns = computed<TableColumn<ExternalFileColumn>[]>(() => [
-	{
-		key: 'name',
-		label: formatMessage(messages.unrecognizedFiles),
-		cellClass: '!h-12',
-	},
-])
-
 defineExpose({ show, hide })
 </script>
@@ -14,7 +14,7 @@ defineProps<{
 		<Avatar
 			:src="instance.icon_path ? convertFileSrc(instance.icon_path) : undefined"
 			size="24px"
-			:tint-by="instance.id"
+			:tint-by="instance.path"
 		/>
 		{{ instance.name }} <ChevronRightIcon />
 	</span>
@@ -6,7 +6,6 @@ import {
 	CoffeeIcon,
 	InfoIcon,
 	MonitorIcon,
-	UsersIcon,
 	WrenchIcon,
 } from '@modrinth/assets'
 import {
@@ -17,8 +16,7 @@ import {
 	type TabbedModalTab,
 	useVIntl,
 } from '@modrinth/ui'
-import type { PlatformTag } from '@modrinth/utils'
-import { useQuery, useQueryClient } from '@tanstack/vue-query'
+import { useQueryClient } from '@tanstack/vue-query'
 import { convertFileSrc } from '@tauri-apps/api/core'
 import { computed, nextTick, ref, watch } from 'vue'

@@ -26,18 +24,14 @@ import GeneralSettings from '@/components/ui/instance_settings/GeneralSettings.v
 import HooksSettings from '@/components/ui/instance_settings/HooksSettings.vue'
 import InstallationSettings from '@/components/ui/instance_settings/InstallationSettings.vue'
 import JavaSettings from '@/components/ui/instance_settings/JavaSettings.vue'
-import SharingSettings from '@/components/ui/instance_settings/SharingSettings.vue'
 import WindowSettings from '@/components/ui/instance_settings/WindowSettings.vue'
 import { get_project_v3 } from '@/helpers/cache'
-import { get_linked_modpack_info } from '@/helpers/instance'
-import { get_loader_versions } from '@/helpers/metadata'
-import { get_game_versions, get_loaders } from '@/helpers/tags'
+import { get_linked_modpack_info } from '@/helpers/profile'
 import { provideInstanceSettings } from '@/providers/instance-settings'

 import type { GameInstance } from '../../../helpers/types'

 const { formatMessage } = useVIntl()
-const queryClient = useQueryClient()

 const props = defineProps<{
 	instance: GameInstance
@@ -50,27 +44,19 @@ const emit = defineEmits<{
 const isMinecraftServer = ref(false)
 const handleUnlinked = () => emit('unlinked')

-const instanceRef = computed(() => props.instance)
-const tabbedModal = ref<InstanceType<typeof TabbedModal> | null>(null)
-
-function hide() {
-	tabbedModal.value?.hide()
-}
-
 provideInstanceSettings({
-	instance: instanceRef,
+	instance: props.instance,
 	offline: props.offline,
 	isMinecraftServer,
 	onUnlinked: handleUnlinked,
-	closeModal: hide,
 })

 watch(
 	() => props.instance,
 	(instance) => {
 		isMinecraftServer.value = false
-		if (instance.link?.project_id) {
-			get_project_v3(instance.link.project_id, 'must_revalidate')
+		if (instance.linked_data?.project_id) {
+			get_project_v3(instance.linked_data.project_id, 'must_revalidate')
 				.then((project: Labrinth.Projects.v3.Project | undefined) => {
 					if (project?.minecraft_server != null) {
 						isMinecraftServer.value = true
@@ -99,15 +85,6 @@ const tabs = computed<TabbedModalTab[]>(() => [
 		icon: WrenchIcon,
 		content: InstallationSettings,
 	},
-	{
-		name: defineMessage({
-			id: 'instance.settings.tabs.sharing',
-			defaultMessage: 'Sharing',
-		}),
-		icon: UsersIcon,
-		content: SharingSettings,
-		shown: props.instance.shared_instance?.role === 'owner' && !props.instance.quarantined,
-	},
 	{
 		name: defineMessage({
 			id: 'instance.settings.tabs.window',
@@ -134,50 +111,14 @@ const tabs = computed<TabbedModalTab[]>(() => [
 	},
 ])

-function getSupportedModpackLoaders() {
-	return get_loaders().then((value: PlatformTag[]) =>
-		value
-			.filter((item) => item.supported_project_types.includes('modpack') || item.name === 'vanilla')
-			.sort((a, b) => (a.name === 'vanilla' ? -1 : b.name === 'vanilla' ? 1 : 0)),
-	)
-}
-
-// Preload
-useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'fabric'],
-	queryFn: () => get_loader_versions('fabric'),
-})
-useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'forge'],
-	queryFn: () => get_loader_versions('forge'),
-})
-useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'quilt'],
-	queryFn: () => get_loader_versions('quilt'),
-})
-useQuery({
-	queryKey: ['instance-settings', 'loader-versions', 'neo'],
-	queryFn: () => get_loader_versions('neo'),
-})
-useQuery({
-	queryKey: ['instance-settings', 'game-versions'],
-	queryFn: get_game_versions,
-})
-useQuery({
-	queryKey: ['instance-settings', 'loaders', 'modpack'],
-	queryFn: getSupportedModpackLoaders,
-})
-useQuery({
-	queryKey: computed(() => ['linkedModpackInfo', props.instance.id]),
-	queryFn: () => get_linked_modpack_info(props.instance.id, 'stale_while_revalidate'),
-	enabled: computed(() => !!props.instance.link?.project_id && !props.offline),
-})
+const queryClient = useQueryClient()
+const tabbedModal = ref<InstanceType<typeof TabbedModal> | null>(null)

 function show(tabIndex?: number) {
-	if (props.instance.link?.project_id) {
+	if (props.instance.linked_data?.project_id) {
 		queryClient.prefetchQuery({
-			queryKey: ['linkedModpackInfo', props.instance.id],
-			queryFn: () => get_linked_modpack_info(props.instance.id, 'stale_while_revalidate'),
+			queryKey: ['linkedModpackInfo', props.instance.path],
+			queryFn: () => get_linked_modpack_info(props.instance.path, 'stale_while_revalidate'),
 		})
 	}
 	tabbedModal.value?.show()
@@ -186,7 +127,7 @@ function show(tabIndex?: number) {
 	}
 }

-defineExpose({ show, hide })
+defineExpose({ show })
 </script>
 <template>
 	<TabbedModal
@@ -200,7 +141,7 @@ defineExpose({ show, hide })
 				<Avatar
 					:src="instance.icon_path ? convertFileSrc(instance.icon_path) : undefined"
 					size="24px"
-					:tint-by="props.instance.id"
+					:tint-by="props.instance.path"
 				/>
 				{{ instance.name }} <ChevronRightIcon />
 				<span class="font-extrabold text-contrast">{{
@@ -31,7 +31,7 @@ const props = defineProps({
 const modal = useTemplateRef('modal')

 defineExpose({
-	show: (e?: MouseEvent) => {
+	show: (e: MouseEvent) => {
 		modal.value?.show(e)
 	},
 	hide: () => {
@@ -1,31 +1,21 @@
 <template>
 	<NewModal ref="modal" :header="formatMessage(messages.header)" fade="warning" max-width="500px">
-		<p class="m-0 text-secondary">
-			<IntlFormatted :message-id="messages.body" :values="{ instanceName }">
-				<template #bold="{ children }">
-					<span class="font-medium text-contrast"><component :is="() => children" /></span>
-				</template>
-			</IntlFormatted>
-		</p>
+		<Admonition type="warning" :header="formatMessage(messages.admonitionHeader)">
+			{{ formatMessage(messages.admonitionBody, { instanceName }) }}
+		</Admonition>

 		<template #actions>
 			<div class="flex gap-2 justify-end">
 				<ButtonStyled type="outlined">
-					<button @click="handleCancel">
-						<XIcon />
-						{{ formatMessage(commonMessages.cancelButton) }}
-					</button>
-				</ButtonStyled>
-				<ButtonStyled>
-					<button @click="handleGoToInstance">
-						{{ formatMessage(messages.instance) }}
-						<RightArrowIcon />
+					<button class="!border !border-surface-4" @click="handleGoToInstance">
+						<ExternalIcon />
+						{{ formatMessage(messages.goToInstance) }}
 					</button>
 				</ButtonStyled>
 				<ButtonStyled color="orange">
 					<button @click="handleCreateAnyway">
 						<PlusIcon />
-						{{ formatMessage(messages.create) }}
+						{{ formatMessage(messages.createAnyway) }}
 					</button>
 				</ButtonStyled>
 			</div>
@@ -34,15 +24,8 @@
 </template>

 <script setup lang="ts">
-import { PlusIcon, RightArrowIcon, XIcon } from '@modrinth/assets'
-import {
-	ButtonStyled,
-	commonMessages,
-	defineMessages,
-	IntlFormatted,
-	NewModal,
-	useVIntl,
-} from '@modrinth/ui'
+import { ExternalIcon, PlusIcon } from '@modrinth/assets'
+import { Admonition, ButtonStyled, defineMessages, NewModal, useVIntl } from '@modrinth/ui'
 import { ref } from 'vue'

 const { formatMessage } = useVIntl()
@@ -52,43 +35,42 @@ const messages = defineMessages({
 		id: 'app.instance.modpack-already-installed.header',
 		defaultMessage: 'Modpack already installed',
 	},
-	body: {
-		id: 'app.instance.modpack-already-installed.body',
-		defaultMessage:
-			'This modpack is already installed in the <bold>{instanceName}</bold> instance. Are you sure you want to duplicate it?',
+	admonitionHeader: {
+		id: 'app.instance.modpack-already-installed.admonition-header',
+		defaultMessage: 'Duplicate modpack',
 	},
-	instance: {
-		id: 'app.instance.modpack-already-installed.instance',
-		defaultMessage: 'Instance',
+	admonitionBody: {
+		id: 'app.instance.modpack-already-installed.admonition-body',
+		defaultMessage: 'This modpack is already installed in the "{instanceName}" instance.',
 	},
-	create: {
-		id: 'app.instance.modpack-already-installed.create',
-		defaultMessage: 'Create',
+	goToInstance: {
+		id: 'app.instance.modpack-already-installed.go-to-instance',
+		defaultMessage: 'Go to instance',
+	},
+	createAnyway: {
+		id: 'app.instance.modpack-already-installed.create-anyway',
+		defaultMessage: 'Create anyway',
 	},
 })

 const emit = defineEmits<{
-	(e: 'go-to-instance', instanceId: string): void
+	(e: 'go-to-instance', instancePath: string): void
 	(e: 'create-anyway'): void
 }>()

 const modal = ref<InstanceType<typeof NewModal>>()
 const instanceName = ref('')
-const instanceId = ref('')
+const instancePath = ref('')

-function show(name: string, id: string) {
+function show(name: string, path: string) {
 	instanceName.value = name
-	instanceId.value = id
+	instancePath.value = path
 	modal.value?.show()
 }

-function handleCancel() {
-	modal.value?.hide()
-}
-
 function handleGoToInstance() {
 	modal.value?.hide()
-	emit('go-to-instance', instanceId.value)
+	emit('go-to-instance', instancePath.value)
 }

 function handleCreateAnyway() {
@@ -1,265 +0,0 @@
-<template>
-	<NewModal
-		ref="modal"
-		:header="formatMessage(authenticating ? messages.signingInHeader : messages.header)"
-		:on-hide="handleHide"
-		no-padding
-		max-width="548px"
-		width="100%"
-	>
-		<div v-if="authenticating === null" class="flex w-full flex-col gap-6 p-6">
-			<div class="flex flex-col gap-2 px-3">
-				<h2 class="m-0 text-xl font-semibold leading-7 text-contrast">
-					{{ formatMessage(messages.signInHeading) }}
-				</h2>
-				<p class="m-0 text-base leading-6 text-primary">
-					{{ formatMessage(messages.description) }}
-				</p>
-			</div>
-
-			<div class="flex flex-col gap-6">
-				<div class="grid grid-cols-1 gap-2 sm:grid-cols-2">
-					<ButtonStyled>
-						<button class="w-full !shadow-none" type="button" @click="authenticate('sign-up')">
-							<UserPlusIcon aria-hidden="true" />
-							{{ formatMessage(messages.createAccountButton) }}
-						</button>
-					</ButtonStyled>
-					<ButtonStyled color="brand">
-						<button class="w-full" type="button" @click="authenticate('sign-in')">
-							<LogInIcon aria-hidden="true" />
-							{{ formatMessage(messages.signInButton) }}
-						</button>
-					</ButtonStyled>
-				</div>
-
-				<p class="m-0 text-center text-base font-medium leading-6 text-primary">
-					<IntlFormatted :message-id="messages.supportPrompt">
-						<template #support="{ children }">
-							<button
-								type="button"
-								class="inline cursor-pointer border-0 bg-transparent p-0 text-base font-medium leading-6 text-blue hover:underline"
-								@click="openSupport"
-							>
-								<component :is="() => children" />
-							</button>
-						</template>
-					</IntlFormatted>
-				</p>
-			</div>
-		</div>
-
-		<div v-else class="flex w-full flex-col gap-6 p-6">
-			<div class="flex flex-col gap-2.5 px-3">
-				<div class="flex flex-col gap-2">
-					<h2 class="m-0 text-xl font-semibold leading-7 text-contrast">
-						{{ formatMessage(messages.continueInBrowserHeading) }}
-					</h2>
-					<p class="m-0 text-base leading-6 text-primary">
-						{{ formatMessage(messages.browserDescription) }}
-					</p>
-				</div>
-				<div class="flex items-center gap-1.5 text-primary">
-					<SpinnerIcon aria-hidden="true" class="h-5 w-5 shrink-0 animate-spin" />
-					<span class="text-base leading-6">
-						{{ formatMessage(messages.waitingForBrowser) }}
-					</span>
-				</div>
-			</div>
-
-			<div class="flex flex-col gap-6">
-				<div class="grid grid-cols-1 gap-2 sm:grid-cols-2">
-					<ButtonStyled type="outlined">
-						<button class="w-full" type="button" @click="modal?.hide()">
-							<XIcon aria-hidden="true" />
-							{{ formatMessage(messages.cancelButton) }}
-						</button>
-					</ButtonStyled>
-					<ButtonStyled>
-						<button
-							class="w-full !shadow-none"
-							type="button"
-							:disabled="reopeningBrowser"
-							@click="reopenBrowser"
-						>
-							<RefreshCwIcon aria-hidden="true" />
-							{{ formatMessage(messages.openBrowserAgainButton) }}
-						</button>
-					</ButtonStyled>
-				</div>
-
-				<p class="m-0 text-center text-base font-medium leading-6 text-primary">
-					<IntlFormatted :message-id="messages.supportPrompt">
-						<template #support="{ children }">
-							<button
-								type="button"
-								class="inline cursor-pointer border-0 bg-transparent p-0 text-base font-medium leading-6 text-blue hover:underline"
-								@click="openSupport"
-							>
-								<component :is="() => children" />
-							</button>
-						</template>
-					</IntlFormatted>
-				</p>
-			</div>
-		</div>
-	</NewModal>
-</template>
-
-<script setup lang="ts">
-import { LogInIcon, RefreshCwIcon, SpinnerIcon, UserPlusIcon, XIcon } from '@modrinth/assets'
-import { ButtonStyled, defineMessages, IntlFormatted, NewModal, useVIntl } from '@modrinth/ui'
-import { openUrl } from '@tauri-apps/plugin-opener'
-import { ref } from 'vue'
-
-import { cancelLogin, type ModrinthAuthFlow } from '@/helpers/mr_auth'
-
-const props = defineProps<{
-	requestAuth: (flow: ModrinthAuthFlow) => Promise<boolean>
-}>()
-
-const { formatMessage } = useVIntl()
-const modal = ref<InstanceType<typeof NewModal>>()
-const authenticating = ref<ModrinthAuthFlow | null>(null)
-const reopeningBrowser = ref(false)
-let resolveShow: ((signedIn: boolean) => void) | undefined
-let authenticationId = 0
-let activeAuthentication: Promise<void> | undefined
-
-function show(event?: MouseEvent) {
-	resetAuthentication(true)
-	resolveShow?.(false)
-	const modalInstance = modal.value
-	if (!modalInstance) return Promise.resolve(false)
-
-	return new Promise<boolean>((resolve) => {
-		resolveShow = resolve
-		modalInstance.show(event)
-	})
-}
-
-function showSigningIn(flow: ModrinthAuthFlow = 'sign-in', event?: MouseEvent) {
-	const result = show(event)
-	authenticate(flow)
-	return result
-}
-
-function finish(signedIn: boolean) {
-	resolveShow?.(signedIn)
-	resolveShow = undefined
-}
-
-function authenticate(flow: ModrinthAuthFlow) {
-	const id = ++authenticationId
-	authenticating.value = flow
-
-	const authentication = (async () => {
-		try {
-			if ((await props.requestAuth(flow)) && authenticationId === id) {
-				authenticating.value = null
-				activeAuthentication = undefined
-				finish(true)
-				modal.value?.hide()
-			}
-		} finally {
-			if (authenticationId === id) {
-				authenticating.value = null
-				activeAuthentication = undefined
-			}
-		}
-	})()
-
-	activeAuthentication = authentication
-}
-
-async function reopenBrowser() {
-	const flow = authenticating.value
-	if (!flow || reopeningBrowser.value) return
-
-	reopeningBrowser.value = true
-	const previousAuthentication = activeAuthentication
-	++authenticationId
-
-	try {
-		await cancelLogin()
-		await previousAuthentication?.catch(() => undefined)
-		if (authenticating.value === flow) authenticate(flow)
-	} finally {
-		reopeningBrowser.value = false
-	}
-}
-
-function resetAuthentication(cancelActive: boolean) {
-	const wasAuthenticating = authenticating.value !== null
-	++authenticationId
-	activeAuthentication = undefined
-	authenticating.value = null
-	reopeningBrowser.value = false
-
-	if (cancelActive && wasAuthenticating) void cancelLogin()
-}
-
-function handleHide() {
-	resetAuthentication(true)
-	finish(false)
-}
-
-function openSupport() {
-	openUrl('https://support.modrinth.com')
-}
-
-const messages = defineMessages({
-	header: {
-		id: 'modal.modrinth-account-required.header',
-		defaultMessage: 'Account required',
-	},
-	signingInHeader: {
-		id: 'modal.modrinth-account-required.signing-in-header',
-		defaultMessage: 'Signing in',
-	},
-	signInHeading: {
-		id: 'modal.modrinth-account-required.sign-in-heading',
-		defaultMessage: 'Sign in to a Modrinth account',
-	},
-	description: {
-		id: 'modal.modrinth-account-required.description',
-		defaultMessage:
-			"You'll need to sign into your Modrinth account before you can use this feature.",
-	},
-	createAccountButton: {
-		id: 'modal.modrinth-account-required.create-account-button',
-		defaultMessage: 'Create an account',
-	},
-	signInButton: {
-		id: 'modal.modrinth-account-required.sign-in-button',
-		defaultMessage: 'Sign in to Modrinth',
-	},
-	continueInBrowserHeading: {
-		id: 'modal.modrinth-account-required.continue-in-browser-heading',
-		defaultMessage: 'Continue in your browser',
-	},
-	browserDescription: {
-		id: 'modal.modrinth-account-required.browser-description',
-		defaultMessage:
-			'A new tab opened to sign in. Complete the sign in there, then return to the app.',
-	},
-	waitingForBrowser: {
-		id: 'modal.modrinth-account-required.waiting-for-browser',
-		defaultMessage: 'Waiting for browser confirmation...',
-	},
-	cancelButton: {
-		id: 'modal.modrinth-account-required.cancel-button',
-		defaultMessage: 'Cancel',
-	},
-	openBrowserAgainButton: {
-		id: 'modal.modrinth-account-required.open-browser-again-button',
-		defaultMessage: 'Open browser again',
-	},
-	supportPrompt: {
-		id: 'modal.modrinth-account-required.support-prompt',
-		defaultMessage: 'Having trouble signing in? <support>Get support</support>',
-	},
-})
-
-defineExpose({ show, showSigningIn })
-</script>
@@ -2,18 +2,17 @@
 	<ContentDiffModal
 		ref="diffModal"
 		:header="formatMessage(messages.updateToPlay)"
+		:admonition-header="formatMessage(messages.updateRequired)"
 		:description="
 			instance ? formatMessage(messages.updateRequiredDescription, { name: instance.name }) : ''
 		"
 		:diffs="normalizedDiffs"
-		:version-date="versionDate"
-		:show-external-warnings="showExternalWarnings"
-		:external-warning-description="formatMessage(messages.externalWarningDescription)"
 		:confirm-label="formatMessage(commonMessages.updateButton)"
 		:confirm-icon="DownloadIcon"
-		:removed-label="formatMessage(messages.removed)"
+		:show-report-button="true"
 		@confirm="handleUpdate"
 		@cancel="handleDecline"
+		@report="handleReport"
 	/>
 </template>

@@ -27,12 +26,12 @@ import {
 	defineMessages,
 	useVIntl,
 } from '@modrinth/ui'
+import { openUrl } from '@tauri-apps/plugin-opener'
 import dayjs from 'dayjs'
-import { computed, ref } from 'vue'
+import { computed, ref, watch } from 'vue'

 import { get_project_many, get_version, get_version_many } from '@/helpers/cache.js'
-import { wait_for_install_job } from '@/helpers/install'
-import { update_managed_modrinth_version } from '@/helpers/instance'
+import { update_managed_modrinth_version } from '@/helpers/profile'
 import type { GameInstance } from '@/helpers/types'
 import { injectServerInstall } from '@/providers/server-install'

@@ -77,15 +76,6 @@ const { formatMessage } = useVIntl()
 const { startInstallingServer, stopInstallingServer } = injectServerInstall()
 type UpdateCompleteCallback = () => void | Promise<void>

-const { showExternalWarnings } = defineProps<{
-	showExternalWarnings?: boolean
-}>()
-
-const emit = defineEmits<{
-	cancel: []
-	complete: []
-}>()
-
 const diffModal = ref<InstanceType<typeof ContentDiffModal>>()
 const instance = ref<GameInstance | null>(null)
 const onUpdateComplete = ref<UpdateCompleteCallback>(() => {})
@@ -93,21 +83,14 @@ const diffs = ref<DependencyDiff[]>([])
 const modpackVersionId = ref<string | null>(null)
 const modpackVersion = ref<Version | null>(null)

-const normalizedDiffs = computed<ContentDiffItem[]>(() => {
-	return diffs.value.map((diff) => ({
+const normalizedDiffs = computed<ContentDiffItem[]>(() =>
+	diffs.value.map((diff) => ({
 		type: diff.type,
-		external: Boolean(diff.fileName && !diff.project),
 		projectName: diff.project?.title,
 		fileName: diff.fileName,
 		currentVersionName: diff.currentVersion?.version_number,
 		newVersionName: diff.newVersion?.version_number,
-	}))
-})
-
-const versionDate = computed(() =>
-	modpackVersion.value?.date_published
-		? dayjs(modpackVersion.value.date_published).format('MMMM D, YYYY')
-		: undefined,
+	})),
 )

 async function computeDependencyDiffs(
@@ -206,10 +189,6 @@ async function computeDependencyDiffs(
 			}
 		})
 		.sort((a, b) => {
-			const aExternal = Boolean(a.fileName && !a.project)
-			const bExternal = Boolean(b.fileName && !b.project)
-			if (aExternal !== bExternal) return aExternal ? -1 : 1
-
 			const typeOrder = { added: 0, updated: 1, removed: 2 }
 			const typeCompare = typeOrder[a.type] - typeOrder[b.type]
 			if (typeCompare !== 0) return typeCompare
@@ -223,15 +202,15 @@ async function computeDependencyDiffs(
 }

 async function checkUpdateAvailable(inst: GameInstance): Promise<DependencyDiff[] | null> {
-	if (!inst.link) return null
-	if (!modpackVersionId.value || !inst.link.version_id) return null
+	if (!inst.linked_data) return null
+	if (!modpackVersionId.value || !inst.linked_data.version_id) return null

 	try {
-		// For server projects, link.project_id is the server project but
-		// link.version_id references a content modpack version from a different project.
-		// Detect this by comparing the version's project_id with link.project_id.
+		// For server projects, linked_data.project_id is the server project but
+		// linked_data.version_id references a content modpack version from a different project.
+		// Detect this by comparing the version's project_id with linked_data.project_id.
 		modpackVersion.value = await get_version(modpackVersionId.value, 'bypass')
-		const instanceModpackVersion = await get_version(inst.link.version_id, 'bypass')
+		const instanceModpackVersion = await get_version(inst.linked_data.version_id, 'bypass')

 		// Compute dependency diffs between current and latest version
 		if (instanceModpackVersion && modpackVersion.value) {
@@ -247,25 +226,42 @@ async function checkUpdateAvailable(inst: GameInstance): Promise<DependencyDiff[
 	return null
 }

+watch(
+	() => instance.value,
+	async (newInstance) => {
+		if (!newInstance) return
+		const result = await checkUpdateAvailable(newInstance)
+		diffs.value = result || []
+	},
+	{ immediate: true, deep: true },
+)
+
 async function handleUpdate() {
-	const serverProjectId = instance.value?.link?.project_id
+	hide()
+	const serverProjectId = instance.value?.linked_data?.project_id
 	if (serverProjectId) startInstallingServer(serverProjectId)
 	try {
 		if (modpackVersionId.value && instance.value) {
-			const job = await update_managed_modrinth_version(instance.value.id, modpackVersionId.value)
-			await wait_for_install_job(job.job_id)
+			await update_managed_modrinth_version(instance.value.path, modpackVersionId.value)
 			await onUpdateComplete.value()
 		}
 	} catch (error) {
 		console.error('Error updating instance:', error)
 	} finally {
 		if (serverProjectId) stopInstallingServer(serverProjectId)
-		emit('complete')
+	}
+}
+
+function handleReport() {
+	if (instance.value?.linked_data?.project_id) {
+		openUrl(
+			`https://modrinth.com/report?item=project&itemID=${instance.value.linked_data.project_id}`,
+		)
 	}
 }

 function handleDecline() {
-	emit('cancel')
+	hide()
 }

 function show(
@@ -276,15 +272,8 @@ function show(
 ) {
 	instance.value = instanceVal
 	modpackVersionId.value = modpackVersionIdVal
-	modpackVersion.value = null
-	diffs.value = []
 	onUpdateComplete.value = callback
 	diffModal.value?.show(e)
-	void checkUpdateAvailable(instanceVal).then((result) => {
-		if (instance.value?.id === instanceVal.id && modpackVersionId.value === modpackVersionIdVal) {
-			diffs.value = result || []
-		}
-	})
 }

 function hide() {
@@ -296,25 +285,23 @@ const messages = defineMessages({
 		id: 'app.modal.update-to-play.header',
 		defaultMessage: 'Update to play',
 	},
+	updateRequired: {
+		id: 'app.modal.update-to-play.update-required',
+		defaultMessage: 'Update required',
+	},
 	updateRequiredDescription: {
 		id: 'app.modal.update-to-play.update-required-description',
 		defaultMessage:
-			'An update is required to play {name}. Please update to latest version to launch the game.',
-	},
-	removed: {
-		id: 'app.modal.update-to-play.removed',
-		defaultMessage: 'Removed',
-	},
-	externalWarningDescription: {
-		id: 'app.modal.update-to-play.server-modpack-unknown-files-description',
-		defaultMessage:
-			'This server modpack update contains files that aren’t published on Modrinth. We strongly recommend only installing files from sources you trust.',
+			'An update is required to play {name}. Please update to the latest version to launch the game.',
 	},
 })

 const hasUpdate = computed(() => {
-	if (!instance.value?.link) return false
-	return modpackVersionId.value != null && modpackVersionId.value !== instance.value.link.version_id
+	if (!instance.value?.linked_data) return false
+	return (
+		modpackVersionId.value != null &&
+		modpackVersionId.value !== instance.value.linked_data.version_id
+	)
 })

 defineExpose({ show, hide, hasUpdate })
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
François-X. T.	72e528b33f	Revert "Changelog" This reverts commit `0c1c7e2fe8`.	2026-03-24 16:36:42 -04:00
François-X. T.	0c1c7e2fe8	Changelog	2026-03-24 16:33:09 -04:00
François-X. T.	cf16939519	Add Java 25, handle new version format	2026-03-24 16:28:37 -04:00
@@ -1 +1 @@
 .15.0
 .19.2
				`@@ -0,0 +1 @@`
				`See [CLAUDE.md](./CLAUDE.md) for all project instructions and guidelines.`