[AlexAndBear]

Description

Redesigns the app store (list and details view) and modernizes its code.

List view

• Tag filter below the search: "All" plus all tags with app counts, sorted by count, overflow in an "Additional tags" drop. The tag is matched exactly and kept in its own q_tag query param, separate from the search, so the counts always match the shown apps
• Grid / list view switch next to the search (persisted)
• Subtitle and heading styled like the account pages, results heading shows the active tag (or "All") with the result count
• Tiles: "Official" badge for apps flagged with official in the app json, authors and a download icon button at the bottom
• Empty states with the extensions illustration from the admin settings

Details view

• Wider two column layout: header with download button and requirements, gallery with thumbnails and description on the left, information and versions on the right
• Versions as a compact list (first three, toggle for all)
• Back link keeps the filters of the list

Code

• Split into smaller components (e.g. AppTagFilter, AppViewModeSwitch, AppDetailsHeader, AppDetailsGallery, AppDetailsInfo), composables (useAppFilter, useAppViewMode) and helpers
• Regular defineStore setup for the apps store, named functions, no copy-pasted URL validation and route objects
• "App not found" instead of a crash for unknown app IDs

Screenshots

	Before	After
List
List (list mode)	–
Details

Related Issue

• Fixes <issue_link>

How Has This Been Tested?

• test environment: local dev server (pnpm vite) against the docker compose backend, Chrome, widths 375–1600px
• test case 1: tag filter, search, tag and search combined, view switch and result count in the list view
• test case 2: details view: gallery thumbnails (mouse and keyboard), version toggle, downloads, tag click, back link with filters, unknown app ID
• test case 3: unit tests for the new components, composables, helpers and the details view
• pnpm check:types, pnpm lint, pnpm format:check

Types of changes

• Bugfix
• Enhancement (a change that doesn't break existing code or deployments)
• Breaking change (a modification that affects current functionality)
• Technical debt (addressing code that needs refactoring or improvements)
• Tests (adding or improving tests)
• Documentation (updates or additions to documentation)
• Maintenance (like dependency updates or tooling adjustments)

[AlexAndBear]

Adjust no content message after #3556 got merged

[JammingBen]

I noticed 2 issues when filtering via a tag:

1. The number behind a tag is not accurate. It e.g. says "Viewer (5)" but then shows 6 apps. So there is some inconsistency in the matching.
2. Filtering via a tag still shows the "All Apps" heading.

[AlexAndBear]

I noticed 2 issues when filtering via a tag:

1. The number behind a tag is not accurate. It e.g. says "Viewer (5)" but then shows 6 apps. So there is some inconsistency in the matching.
2. Filtering via a tag still shows the "All Apps" heading.

Yes, this is because clicking the tags did result in filling the search field and vice versa, I don't think we need this behaviour anymore, since we do now have the tag bar