Merge branch 'mealie-next' into test-v-show-for-login-inputs

.devcontainer/Dockerfile

@@ -1,35 +1,43 @@
+# See here for image contents: https://github.com/microsoft/vscode-dev-containers/tree/v0.224.2/containers/python-3/.devcontainer/base.Dockerfile
+
 # [Choice] Python version (use -bullseye variants on local arm64/Apple Silicon): 3, 3.10, 3.9, 3.8, 3.7, 3.6, 3-bullseye, 3.10-bullseye, 3.9-bullseye, 3.8-bullseye, 3.7-bullseye, 3.6-bullseye, 3-buster, 3.10-buster, 3.9-buster, 3.8-buster, 3.7-buster, 3.6-buster
 ARG VARIANT="3.12-bullseye"
 FROM mcr.microsoft.com/devcontainers/python:${VARIANT}
 
-# Remove outdated yarn GPG key, if it exists
-RUN rm -f /etc/apt/sources.list.d/yarn.list /usr/share/keyrings/yarn-archive-keyring.gpg || true
-
 # [Choice] Node.js version: none, lts/*, 16, 14, 12, 10
 ARG NODE_VERSION="none"
 RUN if [ "${NODE_VERSION}" != "none" ]; then su vscode -c "umask 0002 && . /usr/local/share/nvm/nvm.sh && nvm install ${NODE_VERSION} 2>&1"; fi
 
+# install poetry - respects $POETRY_VERSION & $POETRY_HOME
+
 RUN echo "export PROMPT_COMMAND='history -a'" >> /home/vscode/.bashrc \
     && echo "export HISTFILE=~/commandhistory/.bash_history" >> /home/vscode/.bashrc \
     && chown vscode:vscode -R /home/vscode/
 
 RUN npm install -g @go-task/cli
-RUN npm install -g json-schema-to-typescript
 
-# Install additional OS packages
+ENV PYTHONUNBUFFERED=1 \
+    PYTHONDONTWRITEBYTECODE=1 \
+    PIP_NO_CACHE_DIR=off \
+    PIP_DISABLE_PIP_VERSION_CHECK=on \
+    PIP_DEFAULT_TIMEOUT=100 \
+    POETRY_HOME="/opt/poetry" \
+    POETRY_VIRTUALENVS_IN_PROJECT=true
+
+# prepend poetry and venv to path
+ENV PATH="$POETRY_HOME/bin:$PATH"
+
+RUN curl -sSL https://install.python-poetry.org | python3 -
+# RUN poetry config virtualenvs.create false
+
 RUN apt-get update \
     && apt-get install --no-install-recommends -y \
     curl \
     build-essential \
-    ffmpeg \
     libpq-dev \
     libwebp-dev \
     libsasl2-dev libldap2-dev libssl-dev \
     gnupg gnupg2 gnupg1
 
-# Install uv
-RUN pip install uv
-ENV UV_LINK_MODE=copy
-
-# Create directory for Docker Secrets
+# create directory used for Docker Secrets
 RUN mkdir -p /run/secrets

.devcontainer/devcontainer.json

@@ -11,7 +11,7 @@
       // Use -bullseye variants on local on arm64/Apple Silicon.
       "VARIANT": "3.12-bullseye",
       // Options
-      "NODE_VERSION": "22"
+      "NODE_VERSION": "20"
     }
   },
   "mounts": [
@@ -23,6 +23,7 @@
       "settings": {
         "python.defaultInterpreterPath": "/usr/local/bin/python",
         "python.formatting.autopep8Path": "/usr/local/py-utils/bin/autopep8",
+        "python.formatting.blackPath": "/usr/local/py-utils/bin/black",
         "python.formatting.yapfPath": "/usr/local/py-utils/bin/yapf",
         "mypy.runUsingActiveInterpreter": true
       },
@@ -30,10 +31,10 @@
         "charliermarsh.ruff",
         "dbaeumer.vscode-eslint",
         "matangover.mypy",
+        "ms-python.black-formatter",
         "ms-python.pylint",
         "ms-python.python",
         "ms-python.vscode-pylance",
-        "streetsidesoftware.code-spell-checker-cspell-bundled-dictionaries",
         "Vue.volar"
       ]
     }
@@ -41,14 +42,13 @@
   // Use 'forwardPorts' to make a list of ports inside the container available locally.
   "forwardPorts": [
     3000,
-    8000, // used by mkdocs
     9000,
     9091, // used by docker production
     24678 // used by nuxt when hot-reloading using polling
   ],
   // Use 'onCreateCommand' to run commands at the end of container creation.
   // Use 'postCreateCommand' to run commands after the container is created.
-  "onCreateCommand": "sudo chown -R vscode:vscode /workspaces/mealie/frontend/node_modules /home/vscode/commandhistory && task setup --force",
+  "onCreateCommand": "sudo chown -R vscode:vscode /workspaces/mealie/frontend/node_modules /home/vscode/commandhistory && task setup",
   // Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
   "remoteUser": "vscode",
   "features": {
@@ -56,8 +56,5 @@
       "dockerDashComposeVersion": "v2"
     }
   },
-  "appPort": [
-    "3000:3000",
-    "9000:9000"
-  ]
+  "appPort": 3000
 }

.github/copilot-instructions.md

@@ -1,240 +0,0 @@
-# Mealie Development Guide for AI Agents
-
-## Project Overview
-
-Mealie is a self-hosted recipe manager, meal planner, and shopping list application with a FastAPI backend (Python 3.12) and Nuxt 4 frontend (Vue 3 + TypeScript). It uses SQLAlchemy ORM with support for SQLite and PostgreSQL databases.
-
-**Development vs Production:**
-- **Development:** Frontend (port 3000) and backend (port 9000) run as separate processes
-- **Production:** Frontend is statically generated and served via FastAPI's SPA module (`mealie/routes/spa/`) in a single container
-
-## Architecture & Key Patterns
-
-### Backend Architecture (mealie/)
-
-**Repository-Service-Controller Pattern:**
-- **Controllers** (`mealie/routes/**/controller_*.py`): Inherit from `BaseUserController` or `BaseAdminController`, handle HTTP concerns, delegate to services
-- **Services** (`mealie/services/`): Business logic layer, inherit from `BaseService`, coordinate repos and external dependencies
-- **Repositories** (`mealie/repos/`): Data access layer using SQLAlchemy, accessed via `AllRepositories` factory
-  - Get repos via dependency injection: `repos: AllRepositories = Depends(get_repositories)`
-  - All repos scoped to group/household context automatically
-
-**Route Organization:**
-- Routes in `mealie/routes/` organized by domain (auth, recipe, groups, households, admin)
-- Use `APIRouter` with FastAPI dependency injection
-- Apply `@router.get/post/put/delete` decorators with Pydantic response models
-- Route controllers use `HttpRepo` mixin for common CRUD operations (see `mealie/routes/_base/mixins.py`)
-
-**Schemas & Type Generation:**
-- Pydantic schemas in `mealie/schema/` with strict separation: `*In`, `*Out`, `*Create`, `*Update` suffixes
-- Auto-exported from submodules via `__init__.py` files (generated by `task dev:generate`)
-- TypeScript types auto-generated from Pydantic schemas - **never manually edit** `frontend/app/lib/api/types/`
-
-**Database & Sessions:**
-- Session management via `Depends(generate_session)` in FastAPI routes
-- Use `session_context()` context manager in services/scripts
-- SQLAlchemy models in `mealie/db/models/`, migrations in `mealie/alembic/`
-- Create migrations: `task py:migrate -- "description"`
-
-### Frontend Architecture (frontend/)
-
-**Component Organization (strict naming conventions):**
-- **Domain Components** (`components/Domain/`): Feature-specific, prefix with domain (e.g., `AdminDashboard`)
-- **Global Components** (`components/global/`): Reusable primitives, prefix with `Base` (e.g., `BaseButton`)
-- **Layout Components** (`components/Layout/`): Layout-only, prefix with `App` if props or `The` if singleton
-- **Page Components** (`components/` with page prefix): Last resort for breaking up complex pages
-
-**API Client Pattern:**
-- API clients in `frontend/app/lib/api/` extend `BaseAPI`, `BaseCRUDAPI`, or `BaseCRUDAPIReadOnly`
-- Types imported from auto-generated `frontend/app/lib/api/types/` (DO NOT EDIT MANUALLY)
-- Composables in `frontend/app/composables/` for shared state and API logic (e.g., `use-mealie-auth.ts`)
-- Use `useAuthBackend()` for authentication state, `useMealieAuth()` for user management
-
-**State Management:**
-- Nuxt 4 composables for state (no Vuex)
-- Auth state via `use-mealie-auth.ts` composable
-- Prefer composables over global state stores
-
-## Essential Commands (via Task/Taskfile.yml)
-
-**Development workflow:**
-```bash
-task setup              # Install all dependencies (Python + Node)
-task dev:services       # Start Postgres & Mailpit containers
-task py                 # Start FastAPI backend (port 9000)
-task ui                 # Start Nuxt frontend (port 3000)
-task docs               # Start MkDocs documentation server
-```
-
-**Code generation (REQUIRED after schema changes):**
-```bash
-task dev:generate       # Generate TypeScript types, schema exports, test helpers
-```
-
-**Testing & Quality:**
-```bash
-task py:test            # Run pytest (supports args: task py:test -- -k test_name)
-task py:check           # Format + lint + type-check + test (full validation)
-task py:format          # Ruff format
-task py:lint            # Ruff check
-task py:mypy            # Type checking
-task ui:test            # Vitest frontend tests
-task ui:check           # Frontend lint + test
-```
-
-**Database:**
-```bash
-task py:migrate -- "description"  # Generate Alembic migration
-task py:postgres        # Run backend with PostgreSQL config
-```
-
-**Docker:**
-```bash
-task docker:prod        # Build and run production Docker compose
-```
-
-## Critical Development Practices
-
-### Python Backend
-
-1. **Always use `uv` for Python commands** (not `python` or `pip`):
-   ```bash
-   uv run python mealie/app.py
-   uv run pytest tests/
-   ```
-
-2. **Type hints are mandatory:** Use mypy-compatible annotations, handle Optional types explicitly
-
-3. **Dependency injection pattern:**
-   ```python
-   from fastapi import Depends
-   from mealie.repos.all_repositories import get_repositories, AllRepositories
-
-   def my_route(
-       repos: AllRepositories = Depends(get_repositories),
-       user: PrivateUser = Depends(get_current_user)
-   ):
-       recipe = repos.recipes.get_one(recipe_id)
-   ```
-
-4. **Settings & Configuration:**
-   - Get settings: `settings = get_app_settings()` (cached singleton)
-   - Get directories: `dirs = get_app_dirs()`
-   - Never instantiate `AppSettings()` directly
-
-5. **Testing:**
-   - Fixtures in `tests/fixtures/`
-   - Use `api_client` fixture for integration tests
-   - Follow existing patterns in `tests/integration_tests/` and `tests/unit_tests/`
-
-### Frontend
-
-1. **Run code generation after backend schema changes:** `task dev:generate`
-
-2. **TypeScript strict mode:** All code must pass type checking
-
-3. **Component naming:** Follow strict conventions (see Architecture section above)
-
-4. **API calls pattern:**
-   ```typescript
-   const api = useUserApi();
-   const recipe = await api.recipes.getOne(recipeId);
-   ```
-
-5. **Composables for shared logic:** Prefer composables in `composables/` over inline code duplication
-
-6. **Translations:** Only modify `en-US` locale files when adding new translation strings - other locales are managed via Crowdin and **must never be modified** (PRs modifying non-English locales will be rejected)
-
-### Cross-Cutting Concerns
-
-1. **Code generation is source of truth:** After Pydantic schema changes, run `task dev:generate` to update:
-   - TypeScript types (`frontend/app/lib/api/types/`)
-   - Schema exports (`mealie/schema/*/__init__.py`)
-   - Test data paths and routes
-
-2. **Multi-tenancy:** All data scoped to **groups** and **households**:
-   - Groups contain multiple households
-   - Households contain recipes, meal plans, shopping lists
-   - Repositories automatically filter by group/household context
-
-3. **Pre-commit hooks:** Install via `task setup:py`, enforces Ruff formatting/linting
-
-4. **Testing before PRs:** Run `task py:check` and `task ui:check` before submitting PRs
-
-## Pull Request Best Practices
-
-### Before Submitting a PR
-
-1. **Draft PRs are optional:** Create a draft PR early if you want feedback while working, or open directly as ready when complete
-2. **Verify code generation:** If you modified Pydantic schemas, ensure `task dev:generate` was run
-3. **Follow Conventional Commits:** Title your PR according to the conventional commits format (see PR template)
-4. **Add release notes:** Include user-facing changes in the PR description
-
-### What to Review
-
-**Architecture & Patterns:**
-- Does the code follow the repository-service-controller pattern?
-- Are controllers delegating business logic to services?
-- Are services coordinating repositories, not accessing the database directly?
-- Is dependency injection used properly (`Depends(get_repositories)`, `Depends(get_current_user)`)?
-
-**Data Scoping:**
-- Are repositories correctly scoped to group/household context?
-- Do route handlers properly validate group/household ownership before operations?
-- Are multi-tenant boundaries enforced (users can't access other groups' data)?
-
-**Type Safety:**
-- Are type hints present on all functions and methods?
-- Are Pydantic schemas using correct suffixes (`*In`, `*Out`, `*Create`, `*Update`)?
-- For frontend, does TypeScript code pass strict type checking?
-
-**Generated Files:**
-- Verify `frontend/app/lib/api/types/` files weren't manually edited (they're auto-generated)
-- Check that `mealie/schema/*/__init__.py` exports match actual schema files (auto-generated)
-- If schemas changed, confirm generated files were updated via `task dev:generate`
-
-**Code Quality:**
-- Is the code readable and well-organized?
-- Are complex operations documented with clear comments?
-- Do component names follow the strict naming conventions (Domain/Global/Layout/Page prefixes)?
-- Are composables used for shared frontend logic instead of duplication?
-
-**Translations:**
-- Were only `en-US` locale files modified for new translation strings?
-- Verify no other locale files (managed by Crowdin) were touched
-
-**Database Changes:**
-- Are Alembic migrations included for schema changes?
-- Are migrations tested against both SQLite and PostgreSQL?
-
-### Review Etiquette
-
-- Be constructive and specific in feedback
-- Suggest code examples when proposing changes
-- Focus on architecture and logic - formatting/linting is handled by CI
-- Use "Approve" when ready to merge, "Request Changes" for blocking issues, "Comment" for non-blocking suggestions
-
-## Common Gotchas
-
-- **Don't manually edit generated files:** `frontend/app/lib/api/types/`, schema `__init__.py` files
-- **Repository context:** Repos are group/household-scoped - passing wrong IDs causes 404s
-- **Session handling:** Don't create sessions manually, use dependency injection or `session_context()`
-- **Schema changes require codegen:** After changing Pydantic models, run `task dev:generate`
-- **Translation files:** Only modify `en-US` locale files - all other locales are managed by Crowdin
-- **Dev containers:** This project uses VS Code dev containers - leverage the pre-configured environment
-- **Task commands:** Use `task` commands instead of direct tool invocation for consistency
-
-## Key Files to Reference
-
-- `Taskfile.yml` - All development commands and workflows
-- `mealie/routes/_base/base_controllers.py` - Controller base classes and patterns
-- `mealie/repos/repository_factory.py` - Repository factory and available repos
-- `frontend/app/lib/api/base/base-clients.ts` - API client base classes
-- `tests/conftest.py` - Test fixtures and setup
-- `dev/code-generation/main.py` - Code generation entry point
-
-## Additional Resources
-
-- [Documentation](https://docs.mealie.io/)
-- [Contributors Guide](https://nightly.mealie.io/contributors/developers-guide/code-contributions/)
-- [Discord](https://discord.gg/QuStdQGSGK)

.github/pull_request_template.md

@@ -8,11 +8,11 @@
   - `chore: `
   - `dev:`
 
-  If a section of the PR template does not apply to this PR, and is not marked as "required", then delete that section.
+  If a section of the PR template does not apply to this PR, then delete that section.
 
   PLEASE READ:
   -------------------------
-  Mealie uses a regular, automatic release schedule. This means that all PRs should be in a
+  Mealie is moving to a regular, automatic release schedule. This means that all PRs should be in a
   stable state, ready for release. This includes:
 
   - Ensuring new tests have been added to cover new features, or to prevent regressions.
@@ -28,6 +28,8 @@ _(REQUIRED)_
   What goal is this change working towards?
   Provide a bullet pointed summary of how each file was changed.
   Briefly explain any decisions you made with respect to the changes.
+  Include anything here that you didn't include in *Release Notes*
+  above, such as changes to CI or changes to internal methods.
 
   If there is a UI component to the change, please include before/after images.
 -->
@@ -41,8 +43,6 @@ If this PR fixes one of more issues, list them here.
 One per line, like so:
 Fixes #123
 Fixes #39
-
-Be sure to include the word "fixes" otherwise the associated issue will not be closed.
 -->
 
 ## Special notes for your reviewer:
@@ -61,12 +61,3 @@ _(fill-in or delete this section)_
 <!--
   Describe how you tested this change.
 -->
-
-## AI / LLM Assistance
-
-_(REQUIRED)_
-
-<!--
-  Describe to which degree an LLM was used in creating this pull request. Failure to accurately disclose LLM usage may result in
-  review delays or closure of your PR.
--->

.github/workflows/auto-merge-dependencies.yml

@@ -1,99 +0,0 @@
-name: Auto-merge dependency PRs
-
-on:
-  pull_request:
-    types: [opened, synchronize, labeled]
-
-permissions:
-  contents: write
-  pull-requests: write
-
-jobs:
-  auto-merge:
-    runs-on: ubuntu-latest
-    if: contains(github.event.pull_request.labels.*.name, 'dependencies')
-
-    steps:
-      - name: Validate PR author
-        env:
-          AUTHOR: ${{ github.event.pull_request.user.login }}
-        run: |
-          if [[ "$AUTHOR" != "renovate[bot]" ]]; then
-            echo "::error::PR author must be renovate[bot] for auto-merge (got: $AUTHOR)"
-            exit 1
-          fi
-          echo "Author validated: $AUTHOR"
-
-      - name: Reject major updates
-        env:
-          TITLE: ${{ github.event.pull_request.title }}
-        run: |
-          if echo "$TITLE" | grep -qiE '(major|breaking)'; then
-            echo "::error::Major/breaking updates require manual review"
-            exit 1
-          fi
-          echo "PR title does not indicate a major update"
-
-      - name: Validate file paths
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          REPO: ${{ github.repository }}
-        run: |
-          FILES=$(gh pr view "$PR_NUMBER" --repo "$REPO" --json files --jq '.files[].path')
-
-          for file in $FILES; do
-            if [[ "$file" == "pyproject.toml" ]] || \
-               [[ "$file" == "uv.lock" ]] || \
-               [[ "$file" == "frontend/package.json" ]] || \
-               [[ "$file" == "frontend/yarn.lock" ]] || \
-               [[ "$file" =~ ^docker/ ]]; then
-              continue
-            fi
-
-            echo "::error::Unexpected file path: $file"
-            echo "Only dependency and lock files are allowed for auto-merge"
-            exit 1
-          done
-
-          echo "All files are in allowed paths"
-
-      - name: Approve PR
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          REPO: ${{ github.repository }}
-        run: |
-          APPROVED=$(gh pr view "$PR_NUMBER" \
-            --repo "$REPO" \
-            --json reviews \
-            --jq '.reviews[] | select(.state == "APPROVED") | .id' \
-            | wc -l)
-
-          if [ "$APPROVED" -gt 0 ]; then
-            echo "PR already approved"
-            exit 0
-          fi
-
-          gh pr review "$PR_NUMBER" \
-            --repo "$REPO" \
-            --approve \
-            --body "Auto-approved: dependency update from Renovate with valid file paths"
-
-      - name: Generate GitHub App Token
-        id: app-token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.COMMIT_BOT_APP_ID }}
-          private-key: ${{ secrets.COMMIT_BOT_APP_PRIVATE_KEY }}
-
-      - name: Enable auto-merge
-        env:
-          GH_TOKEN: ${{ steps.app-token.outputs.token }}
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          REPO: ${{ github.repository }}
-        run: |
-          gh pr merge "$PR_NUMBER" \
-            --repo "$REPO" \
-            --auto \
-            --squash

.github/workflows/auto-merge-l10n.yml

@@ -1,115 +0,0 @@
-name: Auto-merge l10n PRs
-
-on:
-  pull_request:
-    types: [opened, synchronize, labeled]
-
-permissions:
-  contents: write
-  pull-requests: write
-
-jobs:
-  auto-merge:
-    runs-on: ubuntu-latest
-    if: contains(github.event.pull_request.labels.*.name, 'l10n')
-
-    steps:
-      - name: Validate PR author
-        env:
-          AUTHOR: ${{ github.event.pull_request.user.login }}
-        run: |
-          if [[
-            "$AUTHOR" != "hay-kot" &&
-            "$AUTHOR" != "github-actions[bot]" &&
-            "$AUTHOR" != "mealie-actions[bot]"
-          ]]; then
-            echo "::error::PR author must be hay-kot, github-actions[bot], or mealie-actions[bot] for auto-merge (got: $AUTHOR)"
-            exit 1
-          fi
-          echo "Author validated: $AUTHOR"
-
-      - name: Validate PR size
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          REPO: ${{ github.repository }}
-        run: |
-          ADDITIONS=$(gh pr view "$PR_NUMBER" --repo "$REPO" --json additions --jq '.additions')
-          DELETIONS=$(gh pr view "$PR_NUMBER" --repo "$REPO" --json deletions --jq '.deletions')
-          TOTAL=$((ADDITIONS + DELETIONS))
-
-          echo "PR changes: +$ADDITIONS -$DELETIONS (total: $TOTAL lines)"
-
-          if [ "$TOTAL" -gt 6000 ]; then
-            echo "::error::PR exceeds 6000 line change limit ($TOTAL lines)"
-            exit 1
-          fi
-
-      - name: Validate file paths
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          REPO: ${{ github.repository }}
-        run: |
-          FILES=$(gh pr view "$PR_NUMBER" --repo "$REPO" --json files --jq '.files[].path')
-
-          for file in $FILES; do
-            # Check if file matches any allowed path
-            if [[ "$file" == "frontend/app/composables/use-locales/available-locales.ts" ]] || \
-               [[ "$file" =~ ^frontend/app/lang/ ]] || \
-               [[ "$file" =~ ^mealie/lang/ ]] || \
-               [[ "$file" =~ ^mealie/repos/seed/resources/[^/]+/locales/ ]]; then
-              continue
-            fi
-
-            # File doesn't match allowed paths
-            echo "::error::Invalid file path: $file"
-            echo "Only the following paths are allowed:"
-            echo "  - frontend/app/composables/use-locales/available-locales.ts"
-            echo "  - frontend/app/lang/"
-            echo "  - mealie/lang/"
-            echo "  - mealie/repos/seed/resources/*/locales/"
-            exit 1
-          done
-
-          echo "All files are in allowed paths"
-
-      - name: Approve PR
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          REPO: ${{ github.repository }}
-        run: |
-          APPROVED=$(gh pr view "$PR_NUMBER" \
-            --repo "$REPO" \
-            --json reviews \
-            --jq '.reviews[] | select(.state == "APPROVED") | .id' \
-            | wc -l)
-
-          if [ "$APPROVED" -gt 0 ]; then
-            echo "PR already approved"
-            exit 0
-          fi
-
-          gh pr review "$PR_NUMBER" \
-            --repo "$REPO" \
-            --approve \
-            --body "Auto-approved: l10n PR from trusted author with valid file paths"
-
-      - name: Generate GitHub App Token
-        id: app-token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.COMMIT_BOT_APP_ID }}
-          private-key: ${{ secrets.COMMIT_BOT_APP_PRIVATE_KEY }}
-
-      - name: Enable auto-merge
-        env:
-          GH_TOKEN: ${{ steps.app-token.outputs.token }}
-          PR_NUMBER: ${{ github.event.pull_request.number }}
-          REPO: ${{ github.repository }}
-        run: |
-          gh pr merge "$PR_NUMBER" \
-            --repo "$REPO" \
-            --auto \
-            --squash

.github/workflows/build-package.yml

@@ -6,9 +6,6 @@ on:
       tag:
         required: true
         type: string
-      ref:
-        required: false
-        type: string
 
 jobs:
   build-frontend:
@@ -17,14 +14,12 @@ jobs:
 
     steps:
       - name: Checkout 🛎
-        uses: actions/checkout@v6
-        with:
-          ref: ${{ inputs.ref || github.sha }}
+        uses: actions/checkout@v4
 
       - name: Setup node env 🏗
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v4.0.0
         with:
-          node-version: 22
+          node-version: 20
           check-latest: true
 
       - name: Get yarn cache directory path 🛠
@@ -32,7 +27,7 @@ jobs:
         run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
 
       - name: Cache node_modules 📦
-        uses: actions/cache@v5
+        uses: actions/cache@v4
         id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
         with:
           path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
@@ -49,7 +44,7 @@ jobs:
         working-directory: "frontend"
 
       - name: Archive built frontend
-        uses: actions/upload-artifact@v6
+        uses: actions/upload-artifact@v4
         with:
           name: frontend-dist
           path: frontend/dist
@@ -68,20 +63,23 @@ jobs:
           repo-token: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Check out repository
-        uses: actions/checkout@v6
-        with:
-          ref: ${{ inputs.ref || github.sha }}
+        uses: actions/checkout@v4
 
       - name: Set up python
-        uses: actions/setup-python@v6
+        uses: actions/setup-python@v5
         with:
           python-version: "3.12"
 
-      - name: Install uv
-        run: pip install uv
+      - name: Install Poetry
+        uses: snok/install-poetry@v1
+        with:
+          virtualenvs-create: true
+          virtualenvs-in-project: true
+          plugins: |
+            poetry-plugin-export
 
       - name: Retrieve built frontend
-        uses: actions/download-artifact@v6
+        uses: actions/download-artifact@v4
         with:
           name: frontend-dist
           path: mealie/frontend
@@ -97,7 +95,7 @@ jobs:
           task py:package
 
       - name: Archive built package
-        uses: actions/upload-artifact@v6
+        uses: actions/upload-artifact@v4
         with:
           name: backend-dist
           path: dist

.github/workflows/codeql.yml

@@ -44,11 +44,11 @@ jobs:
 
     steps:
     - name: Checkout repository
-      uses: actions/checkout@v6
+      uses: actions/checkout@v4
 
     # Initializes the CodeQL tools for scanning.
     - name: Initialize CodeQL
-      uses: github/codeql-action/init@v4
+      uses: github/codeql-action/init@v3
       with:
         languages: ${{ matrix.language }}
         # If you wish to specify custom queries, you can do so here or in a config file.
@@ -62,7 +62,7 @@ jobs:
     # Autobuild attempts to build any compiled languages (C/C++, C#, Go, Java, or Swift).
     # If this step fails, then you should remove it and run the build manually (see below)
     - name: Autobuild
-      uses: github/codeql-action/autobuild@v4
+      uses: github/codeql-action/autobuild@v3
 
     # ℹ️ Command-line programs to run using the OS shell.
     # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
@@ -75,6 +75,6 @@ jobs:
     #     ./location_of_script_within_repo/buildscript.sh
 
     - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v4
+      uses: github/codeql-action/analyze@v3
       with:
         category: "/language:${{matrix.language}}"

.github/workflows/docs.yml

@@ -1,50 +0,0 @@
-name: Deploy Documentation
-
-on:
-  push:
-    branches: [mealie-next]
-    paths:
-      - 'docs/**'
-      - '.github/workflows/docs.yml'
-  workflow_dispatch:
-
-permissions:
-  contents: read
-  pages: write
-  id-token: write
-
-concurrency:
-  group: pages
-  cancel-in-progress: false
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v6
-
-      - name: Install uv
-        uses: astral-sh/setup-uv@v4
-
-      - name: Install dependencies
-        run: uv sync --only-group docs --no-install-project
-
-      - name: Build docs
-        run: uv run --no-project mkdocs build -d site
-        working-directory: docs
-
-      - name: Upload artifact
-        uses: actions/upload-pages-artifact@v3
-        with:
-          path: docs/site
-
-  deploy:
-    needs: build
-    runs-on: ubuntu-latest
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
-    steps:
-      - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@v4

.github/workflows/e2e.yml

@@ -10,21 +10,21 @@ jobs:
       run:
         working-directory: ./tests/e2e
     steps:
-    - uses: actions/checkout@v6
-    - uses: actions/setup-node@v6
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
       with:
-        node-version: 22
+        node-version: 20
         cache: 'yarn'
         cache-dependency-path: ./tests/e2e/yarn.lock
     - name: Set up Docker Buildx
-      uses: docker/setup-buildx-action@v4
+      uses: docker/setup-buildx-action@v3
     - name: Retrieve Python package
-      uses: actions/download-artifact@v6
+      uses: actions/download-artifact@v4
       with:
         name: backend-dist
         path: dist
     - name: Build Image
-      uses: docker/build-push-action@v7
+      uses: docker/build-push-action@v5
       with:
         file: ./docker/Dockerfile
         context: .

.github/workflows/locale-sync.yml

@@ -15,38 +15,34 @@ jobs:
   sync-locales:
     runs-on: ubuntu-latest
     steps:
-      - name: Generate GitHub App Token
-        id: app-token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.COMMIT_BOT_APP_ID }}
-          private-key: ${{ secrets.COMMIT_BOT_APP_PRIVATE_KEY }}
-
       - name: Checkout repository
-        uses: actions/checkout@v6
+        uses: actions/checkout@v4
         with:
-          token: ${{ steps.app-token.outputs.token }}
+          token: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Set up Python
-        uses: actions/setup-python@v6
+        uses: actions/setup-python@v5
         with:
           python-version: "3.12"
 
-      - name: Install uv
-        run: pip install uv
+      - name: Install Poetry
+        uses: snok/install-poetry@v1
+        with:
+          virtualenvs-create: true
+          virtualenvs-in-project: true
 
       - name: Load cached venv
-        id: cached-python-dependencies
-        uses: actions/cache@v5
+        id: cached-poetry-dependencies
+        uses: actions/cache@v4
         with:
           path: .venv
-          key: venv-${{ runner.os }}-${{ hashFiles('**/uv.lock') }}
+          key: venv-${{ runner.os }}-${{ hashFiles('**/poetry.lock') }}
 
       - name: Check venv cache
         id: cache-validate
-        if: steps.cached-python-dependencies.outputs.cache-hit == 'true'
+        if: steps.cached-poetry-dependencies.outputs.cache-hit == 'true'
         run: |
-          echo "import fastapi;print('venv good?')" > test.py && uv run python test.py && echo "cache-hit-success=true" >> $GITHUB_OUTPUT
+          echo "import fastapi;print('venv good?')" > test.py && poetry run python test.py && echo "cache-hit-success=true" >> $GITHUB_OUTPUT
           rm test.py
         continue-on-error: true
 
@@ -54,13 +50,13 @@ jobs:
         run: |
           sudo apt-get update
           sudo apt-get install libsasl2-dev libldap2-dev libssl-dev
-          uv sync --group dev
-        if: steps.cached-python-dependencies.outputs.cache-hit != 'true'
+          poetry install
+        if: steps.cached-poetry-dependencies.outputs.cache-hit != 'true'
 
       - name: Run locale generation
         run: |
           cd dev/code-generation
-          uv run python main.py locales
+          poetry run python main.py locales
         env:
           CROWDIN_API_KEY: ${{ secrets.CROWDIN_API_KEY }}
 
@@ -90,7 +86,7 @@ jobs:
 
           # Add and commit changes
           git add .
-          git commit -m "chore: crowdin locale sync"
+          git commit -m "chore: automatic locale sync"
 
           # Push the branch
           git push origin "$BRANCH_NAME"
@@ -100,10 +96,9 @@ jobs:
           # Create PR using GitHub CLI with explicit repository
           gh pr create \
             --repo "${{ github.repository }}" \
-            --title "chore(l10n): Crowdin locale sync" \
+            --title "chore: automatic locale sync" \
             --base "$BASE_BRANCH" \
             --head "$BRANCH_NAME" \
-            --label "l10n" \
             --body "## Summary
 
           Automatically generated locale updates from the weekly sync job.
@@ -112,7 +107,7 @@ jobs:
           - Updated frontend locale files
           - Generated from latest translation sources" \
         env:
-          GH_TOKEN: ${{ steps.app-token.outputs.token }}
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: No changes detected
         if: steps.changes.outputs.has_changes == 'false'

.github/workflows/partial-trivy-container-scanning.yml

@@ -11,7 +11,7 @@ jobs:
       fail-fast: true
     steps:
       - name: Checkout code
-        uses: actions/checkout@v6
+        uses: actions/checkout@v4
 
       - name: Build Dockerfile
         run: |
@@ -28,6 +28,6 @@ jobs:
           TRIVY_DB_REPOSITORY: ghcr.io/aquasecurity/trivy-db,public.ecr.aws/aquasecurity/trivy-db
 
       - name: Upload Trivy scan results to GitHub Security tab
-        uses: github/codeql-action/upload-sarif@v4
+        uses: github/codeql-action/upload-sarif@v3
         with:
           sarif_file: "trivy-results.sarif"

.github/workflows/publish.yml

@@ -9,9 +9,6 @@ on:
       tags:
         required: false
         type: string
-      ref:
-        required: false
-        type: string
     secrets:
       DOCKERHUB_USERNAME:
         required: true
@@ -23,39 +20,25 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v6
-        with:
-          ref: ${{ inputs.ref || github.sha }}
+        uses: actions/checkout@v4
 
       - name: Log in to the Container registry (ghcr.io)
-        uses: docker/login-action@v4
+        uses: docker/login-action@v3
         with:
           registry: ghcr.io
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Log in to the Container registry (dockerhub)
-        uses: docker/login-action@v4
+        uses: docker/login-action@v3
         with:
           username: ${{ secrets.DOCKERHUB_USERNAME }}
           password: ${{ secrets.DOCKERHUB_TOKEN }}
 
       - uses: depot/setup-action@v1
 
-      - name: Generate Docker metadata
-        id: meta
-        uses: docker/metadata-action@v6
-        with:
-          images: |
-            hkotel/mealie
-            ghcr.io/${{ github.repository }}
-          # Overwrite the image.version label with our tag
-          labels: |
-            org.opencontainers.image.version=${{ inputs.tag }}
-            org.opencontainers.image.revision=${{ inputs.ref || github.sha }}
-
       - name: Retrieve Python package
-        uses: actions/download-artifact@v6
+        uses: actions/download-artifact@v4
         with:
           name: backend-dist
           path: dist
@@ -74,6 +57,5 @@ jobs:
             hkotel/mealie:${{ inputs.tag }}
             ghcr.io/${{ github.repository }}:${{ inputs.tag }}
             ${{ inputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}
           build-args: |
-            COMMIT=${{ inputs.ref || github.sha }}
+            COMMIT=${{ github.sha }}

.github/workflows/pull-request-lint.yml

@@ -13,7 +13,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       # https://github.com/amannn/action-semantic-pull-request
-      - uses: amannn/action-semantic-pull-request@v6
+      - uses: amannn/action-semantic-pull-request@v5
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         with:
@@ -31,7 +31,6 @@ jobs:
             deps
             auto
             l10n
-            config
           # Configure that a scope must always be provided.
           requireScope: false
           # If the PR contains one of these newline-delimited labels, the

.github/workflows/pull-requests.yml

@@ -4,19 +4,14 @@ on:
   pull_request:
     branches:
       - mealie-next
-  merge_group:
-    types: [checks_requested]
-    branches:
-      - mealie-next
 
 concurrency:
-  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.event.merge_group.head_ref }}
+  group: ${{ github.workflow }}-${{ github.event.pull_request.number }}
   cancel-in-progress: true
 
 jobs:
   pull-request-lint:
     name: "Lint PR"
-    if: github.event_name == 'pull_request'
     uses: ./.github/workflows/pull-request-lint.yml
 
   backend-tests:
@@ -29,7 +24,6 @@ jobs:
 
   container-scanning:
     name: "Trivy Container Scanning"
-    if: github.event_name == 'pull_request'
     uses: ./.github/workflows/partial-trivy-container-scanning.yml
 
   code-ql:
@@ -53,10 +47,7 @@ jobs:
 
   publish-image:
     name: "Publish PR Image"
-    if: |
-      github.event_name == 'pull_request' &&
-      contains(github.event.pull_request.labels.*.name, 'build-image') &&
-      github.repository == 'mealie-recipes/mealie'
+    if: contains(github.event.pull_request.labels.*.name, 'build-image') && github.repository == 'mealie-recipes/mealie'
     permissions:
       contents: read
       packages: write

.github/workflows/release-drafter.yml

@@ -5,28 +5,26 @@ on:
   push:
     branches:
       - mealie-next
+  # pull_request event is required for autolabeler
+  pull_request:
+    types: [opened, labeled, unlabeled, reopened, synchronize]
   # pull_request_target event is required for autolabeler to support PRs from forks
   pull_request_target:
     types: [opened, labeled, unlabeled, reopened, synchronize]
   workflow_dispatch:
 
 jobs:
-  draft_release:
-    if: github.event_name == 'push' || github.event_name == 'workflow_dispatch'
-    runs-on: ubuntu-latest
+  update_release_draft:
     permissions:
+      # write permission is required to create a github release
       contents: write
-    steps:
-      - uses: release-drafter/release-drafter@v7
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-  auto_label:
-    if: github.event_name == 'pull_request_target'
-    permissions:
+      # write permission is required for autolabeler
+      # otherwise, read permission is required at least
       pull-requests: write
+    name: ✏️ Draft release
     runs-on: ubuntu-latest
     steps:
-      - uses: release-drafter/release-drafter/autolabeler@v7
+      - name: 🚀 Run Release Drafter
+        uses: release-drafter/release-drafter@v6.0.0
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release.yml

@@ -5,80 +5,19 @@ on:
     types: [published]
 
 jobs:
-  commit-version-bump:
-    name: Commit version bump to repository
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-    outputs:
-      commit-sha: ${{ steps.commit.outputs.commit-sha }}
-    steps:
-      - name: Generate GitHub App Token
-        id: app-token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.COMMIT_BOT_APP_ID }}
-          private-key: ${{ secrets.COMMIT_BOT_APP_PRIVATE_KEY }}
-
-      - name: Checkout 🛎
-        uses: actions/checkout@v6
-        with:
-          token: ${{ steps.app-token.outputs.token }}
-
-      - name: Extract Version From Tag Name
-        run: echo "VERSION_NUM=$(echo ${{ github.event.release.tag_name }} | sed 's/^v//')" >> $GITHUB_ENV
-
-      - name: Configure Git
-        run: |
-          git config user.name "mealie-commit-bot[bot]"
-          git config user.email "mealie-commit-bot[bot]@users.noreply.github.com"
-
-      - name: Update all version strings
-        run: |
-          sed -i 's/^version = "[^"]*"/version = "${{ env.VERSION_NUM }}"/' pyproject.toml
-          sed -i '/^name = "mealie"$/,/^version = / s/^version = "[^"]*"/version = "${{ env.VERSION_NUM }}"/' uv.lock
-          sed -i 's/\("version": "\)[^"]*"/\1${{ env.VERSION_NUM }}"/' frontend/package.json
-          sed -i 's/:v[0-9]*\.[0-9]*\.[0-9]*/:v${{ env.VERSION_NUM }}/' docs/docs/documentation/getting-started/installation/installation-checklist.md
-          sed -i 's/:v[0-9]*\.[0-9]*\.[0-9]*/:v${{ env.VERSION_NUM }}/' docs/docs/documentation/getting-started/installation/sqlite.md
-          sed -i 's/:v[0-9]*\.[0-9]*\.[0-9]*/:v${{ env.VERSION_NUM }}/' docs/docs/documentation/getting-started/installation/postgres.md
-
-      - name: Commit and push changes
-        id: commit
-        run: |
-          git add pyproject.toml frontend/package.json uv.lock docs/
-          git commit -m "chore: bump version to ${{ github.event.release.tag_name }}"
-          git push origin HEAD:${{ github.event.repository.default_branch }}
-          echo "commit-sha=$(git rev-parse HEAD)" >> $GITHUB_OUTPUT
-
-      - name: Move release tag to new commit
-        run: |
-          git tag -f ${{ github.event.release.tag_name }}
-          git push -f origin ${{ github.event.release.tag_name }}
-
   backend-tests:
     name: "Backend Server Tests"
     uses: ./.github/workflows/test-backend.yml
-    needs:
-      - commit-version-bump
-    with:
-      ref: ${{ needs.commit-version-bump.outputs.commit-sha }}
 
   frontend-tests:
     name: "Frontend Tests"
     uses: ./.github/workflows/test-frontend.yml
-    needs:
-      - commit-version-bump
-    with:
-      ref: ${{ needs.commit-version-bump.outputs.commit-sha }}
 
   build-package:
     name: Build Package
     uses: ./.github/workflows/build-package.yml
-    needs:
-      - commit-version-bump
     with:
       tag: ${{ github.event.release.tag_name }}
-      ref: ${{ needs.commit-version-bump.outputs.commit-sha }}
 
   publish:
     permissions:
@@ -95,9 +34,7 @@ jobs:
       - backend-tests
       - frontend-tests
       - build-package
-      - commit-version-bump
     with:
-      ref: ${{ needs.commit-version-bump.outputs.commit-sha }}
       tag: ${{ github.event.release.tag_name }}
       tags: |
           hkotel/mealie:latest
@@ -106,48 +43,10 @@ jobs:
       DOCKERHUB_USERNAME: ${{ secrets.DOCKERHUB_USERNAME }}
       DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
 
-  rollback-on-failure:
-    name: Rollback version commit if deployment fails
-    needs:
-      - commit-version-bump
-      - publish
-    if: always() && needs.publish.result == 'failure'
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-    steps:
-      - name: Generate GitHub App Token
-        id: app-token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.COMMIT_BOT_APP_ID }}
-          private-key: ${{ secrets.COMMIT_BOT_APP_PRIVATE_KEY }}
-
-      - name: Checkout 🛎
-        uses: actions/checkout@v6
-        with:
-          token: ${{ steps.app-token.outputs.token }}
-          fetch-depth: 0
-
-      - name: Configure Git
-        run: |
-          git config user.name "mealie-commit-bot[bot]"
-          git config user.email "mealie-commit-bot[bot]@users.noreply.github.com"
-
-      - name: Delete release tag
-        run: |
-          git push --delete origin ${{ github.event.release.tag_name }}
-
-      - name: Revert version bump commit
-        run: |
-          git revert --no-edit ${{ needs.commit-version-bump.outputs.commit-sha }}
-          git push origin HEAD:${{ github.event.repository.default_branch }}
-
   notify-discord:
     name: Notify Discord
     needs:
       - publish
-    if: success()
     runs-on: ubuntu-latest
     steps:
       - name: Discord notification
@@ -156,3 +55,41 @@ jobs:
         uses: Ilshidur/action-discord@0.3.2
         with:
           args: "🚀  Version {{ EVENT_PAYLOAD.release.tag_name }} of Mealie has been released. See the release notes https://github.com/mealie-recipes/mealie/releases/tag/{{ EVENT_PAYLOAD.release.tag_name }}"
+
+  update-image-tags:
+    name: Update image tag in sample docker-compose files
+    needs:
+      - publish
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      pull-requests: write
+    steps:
+      - name: Checkout 🛎
+        uses: actions/checkout@v4
+
+      - name: Extract Version From Tag Name
+        run: echo "VERSION_NUM=$(echo ${{ github.event.release.tag_name }} | sed 's/^v//')" >> $GITHUB_ENV
+
+      - name: Modify version strings
+        run: |
+          sed -i 's/:v[0-9]*.[0-9]*.[0-9]*/:v${{ env.VERSION_NUM }}/' docs/docs/documentation/getting-started/installation/installation-checklist.md
+          sed -i 's/:v[0-9]*.[0-9]*.[0-9]*/:v${{ env.VERSION_NUM }}/' docs/docs/documentation/getting-started/installation/sqlite.md
+          sed -i 's/:v[0-9]*.[0-9]*.[0-9]*/:v${{ env.VERSION_NUM }}/' docs/docs/documentation/getting-started/installation/postgres.md
+          sed -i 's/^version = "[^"]*"/version = "${{ env.VERSION_NUM }}"/' pyproject.toml
+          sed -i 's/^\s*"version": "[^"]*"/"version": "${{ env.VERSION_NUM }}"/' frontend/package.json
+
+      - name: Create Pull Request
+        uses: peter-evans/create-pull-request@v6
+        # This doesn't currently work for us because it creates the PR but the workflows don't run.
+        # TODO: Provide a personal access token as a parameter here, that solves that problem.
+        # https://github.com/peter-evans/create-pull-request
+        with:
+          commit-message: "Update image tag, for release ${{ github.event.release.tag_name }}"
+          branch: "docs/newrelease-update-version-${{ github.event.release.tag_name }}"
+          labels: |
+            documentation
+          delete-branch: true
+          base: mealie-next
+          title: "docs(auto): Update image tag, for release ${{ github.event.release.tag_name }}"
+          body: "Auto-generated by `.github/workflows/release.yml`, on publish of release ${{ github.event.release.tag_name }}"

.github/workflows/scheduled-checks.yml

@@ -13,10 +13,10 @@ jobs:
       pull-requests: write
     steps:
       - name: Checkout 🛎
-        uses: actions/checkout@v6
+        uses: actions/checkout@v4
 
       - name: Setup Python
-        uses: actions/setup-python@v6
+        uses: actions/setup-python@v5
         with:
           python-version: "3.12"
 
@@ -25,7 +25,7 @@ jobs:
         run: echo "PY=$(python -VV | sha256sum | cut -d' ' -f1)" >> $GITHUB_ENV
 
       - name: Cache
-        uses: actions/cache@v5
+        uses: actions/cache@v4
         with:
           path: |
             ~/.cache/pre-commit
@@ -40,18 +40,12 @@ jobs:
         shell: bash
         run: pre-commit autoupdate --color=always
 
-      - name: Generate GitHub App Token
-        id: app-token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.COMMIT_BOT_APP_ID }}
-          private-key: ${{ secrets.COMMIT_BOT_APP_PRIVATE_KEY }}
-
       - name: Create Pull Request
-        id: create-pr
         uses: peter-evans/create-pull-request@v6
+        # This doesn't currently work for us because it creates the PR but the workflows don't run.
+        # TODO: Provide a personal access token as a parameter here, that solves that problem.
+        # https://github.com/peter-evans/create-pull-request
         with:
-          token: ${{ steps.app-token.outputs.token }}
           commit-message: "Update pre-commit hooks"
           branch: "fix/update-pre-commit-hooks"
           labels: |
@@ -60,38 +54,3 @@ jobs:
           base: mealie-next
           title: "chore(auto): Update pre-commit hooks"
           body: "Auto-generated by `.github/workflows/scheduled-checks.yml`"
-
-      - name: Approve PR
-        if: steps.create-pr.outputs.pull-request-number
-        env:
-          GH_TOKEN: ${{ steps.app-token.outputs.token }}
-          PR_NUMBER: ${{ steps.create-pr.outputs.pull-request-number }}
-          REPO: ${{ github.repository }}
-        run: |
-          APPROVED=$(gh pr view "$PR_NUMBER" \
-            --repo "$REPO" \
-            --json reviews \
-            --jq '.reviews[] | select(.state == "APPROVED") | .id' \
-            | wc -l)
-
-          if [ "$APPROVED" -gt 0 ]; then
-            echo "PR already approved"
-            exit 0
-          fi
-
-          gh pr review "$PR_NUMBER" \
-            --repo "$REPO" \
-            --approve \
-            --body "Auto-approved: Pre-commit hook updates"
-
-      - name: Enable auto-merge
-        if: steps.create-pr.outputs.pull-request-number
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PR_NUMBER: ${{ steps.create-pr.outputs.pull-request-number }}
-          REPO: ${{ github.repository }}
-        run: |
-          gh pr merge "$PR_NUMBER" \
-            --repo "$REPO" \
-            --auto \
-            --squash

.github/workflows/test-backend.yml

@@ -2,10 +2,6 @@ name: Backend Lint and Test
 
 on:
   workflow_call:
-    inputs:
-      ref:
-        required: false
-        type: string
 
 jobs:
   tests:
@@ -46,30 +42,31 @@ jobs:
           repo-token: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Check out repository
-        uses: actions/checkout@v6
-        with:
-          ref: ${{ inputs.ref || github.sha }}
+        uses: actions/checkout@v4
 
       - name: Set up python
-        uses: actions/setup-python@v6
+        uses: actions/setup-python@v5
         with:
           python-version: "3.12"
 
-      - name: Install uv
-        run: pip install uv
+      - name: Install Poetry
+        uses: snok/install-poetry@v1
+        with:
+          virtualenvs-create: true
+          virtualenvs-in-project: true
 
       - name: Load cached venv
-        id: cached-python-dependencies
-        uses: actions/cache@v5
+        id: cached-poetry-dependencies
+        uses: actions/cache@v4
         with:
           path: .venv
-          key: venv-${{ runner.os }}-${{ hashFiles('**/uv.lock') }}
+          key: venv-${{ runner.os }}-${{ hashFiles('**/poetry.lock') }}
 
       - name: Check venv cache
         id: cache-validate
-        if: steps.cached-python-dependencies.outputs.cache-hit == 'true'
+        if: steps.cached-poetry-dependencies.outputs.cache-hit == 'true'
         run: |
-          echo "import fastapi;print('venv good?')" > test.py && uv run python test.py && echo "cache-hit-success=true" >> $GITHUB_OUTPUT
+          echo "import fastapi;print('venv good?')" > test.py && poetry run python test.py && echo "cache-hit-success=true" >> $GITHUB_OUTPUT
           rm test.py
         continue-on-error: true
 
@@ -77,12 +74,13 @@ jobs:
         run: |
           sudo apt-get update
           sudo apt-get install libsasl2-dev libldap2-dev libssl-dev
-          uv sync --group dev --extra pgsql
-        if: steps.cached-python-dependencies.outputs.cache-hit != 'true' || steps.cache-validate.outputs.cache-hit-success != 'true'
+          poetry install
+          poetry add "psycopg2-binary==2.9.9"
+        if: steps.cached-poetry-dependencies.outputs.cache-hit != 'true' || steps.cache-validate.outputs.cache-hit-success != 'true'
 
       - name: Formatting (Ruff)
         run: |
-          uv run ruff format . --check
+          poetry run ruff format . --check
 
       - name: Lint (Ruff)
         run: |

.github/workflows/test-frontend.yml

@@ -2,10 +2,6 @@ name: Frontend Lint and Test
 
 on:
   workflow_call:
-    inputs:
-      ref:
-        required: false
-        type: string
 
 jobs:
   lint:
@@ -13,14 +9,12 @@ jobs:
 
     steps:
       - name: Checkout 🛎
-        uses: actions/checkout@v6
-        with:
-          ref: ${{ inputs.ref || github.sha }}
+        uses: actions/checkout@v4
 
       - name: Setup node env 🏗
-        uses: actions/setup-node@v6
+        uses: actions/setup-node@v4.0.0
         with:
-          node-version: 22
+          node-version: 20
           check-latest: true
 
       - name: Get yarn cache directory path 🛠
@@ -28,7 +22,7 @@ jobs:
         run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
 
       - name: Cache node_modules 📦
-        uses: actions/cache@v5
+        uses: actions/cache@v4
         id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
         with:
           path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
@@ -45,7 +39,7 @@ jobs:
         working-directory: "frontend"
 
       - name: Run linter 👀
-        run: yarn lint --max-warnings=0
+        run: yarn lint
         working-directory: "frontend"
 
       - name: Run tests 🧪

.gitignore

@@ -20,7 +20,6 @@ dev/data/backups/*
 dev/data/debug/*
 dev/data/img/*
 dev/data/migration/*
-dev/data/templates/*
 dev/data/users/*
 dev/data/groups/*
 
@@ -70,11 +69,8 @@ wheels/
 .installed.cfg
 *.egg
 
-# packaged output - temporarily written here by `uv build`
-/mealie-*
-
 # frontend copied into Python module for packaging purposes
-/mealie/frontend
+/mealie/frontend/
 
 # PyInstaller
 #  Usually these files are written by a python script from a template

.pre-commit-config.yaml

@@ -1,6 +1,6 @@
 repos:
   - repo: https://github.com/pre-commit/pre-commit-hooks
-    rev: v6.0.0
+    rev: v5.0.0
     hooks:
       - id: check-yaml
         exclude: "mkdocs.yml"
@@ -12,10 +12,7 @@ repos:
         exclude: ^tests/data/
   - repo: https://github.com/astral-sh/ruff-pre-commit
     # Ruff version.
-    rev: v0.15.8
+    rev: v0.12.3
     hooks:
-        # Linter
-      - id: ruff-check
-        args: [ --fix ]
-        # Formatter
+      - id: ruff
       - id: ruff-format

.vscode/settings.json

@@ -17,8 +17,6 @@
     "source.fixAll.eslint": "explicit",
     "source.organizeImports": "never"
   },
-  "editor.insertSpaces": true,
-  "editor.tabSize": 2,
   "editor.formatOnSave": true,
   "eslint.useFlatConfig": true,
   "eslint.workingDirectories": [
@@ -32,12 +30,11 @@
     "**/.svn": true,
     "**/CVS": true
   },
-  "files.insertFinalNewline": true,
   "i18n-ally.enabledFrameworks": [
     "vue"
   ],
   "i18n-ally.keystyle": "nested",
-  "i18n-ally.localesPaths": "frontend/app/lang/messages",
+  "i18n-ally.localesPaths": "frontend/lang/messages",
   "i18n-ally.sourceLanguage": "en-US",
   "python.defaultInterpreterPath": "${workspaceFolder}/.venv/bin/python",
   "python.testing.autoTestDiscoverOnSaveEnabled": false,
@@ -58,19 +55,15 @@
   "explorer.fileNesting.enabled": true,
   "explorer.fileNesting.patterns": {
     "package.json": "package-lock.json, yarn.lock, .eslintrc.js, tsconfig.json, .prettierrc, .editorconfig",
-    "pyproject.toml": "uv.lock, alembic.ini, .pylintrc",
+    "pyproject.toml": "poetry.lock, alembic.ini, .pylintrc",
     "netlify.toml": "runtime.txt",
     "README.md": "LICENSE, SECURITY.md"
   },
-  "[typescript]": {
-    "editor.formatOnSave": true
-  },
   "[vue]": {
-    "editor.formatOnSave": true
+    "editor.formatOnSave": false
   },
   "[python]": {
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": "charliermarsh.ruff",
-    "editor.tabSize": 4
+    "editor.defaultFormatter": "charliermarsh.ruff"
   }
 }

Taskfile.yml

@@ -25,11 +25,18 @@ dotenv:
   - .env
   - .dev.env
 tasks:
+  docs:gen:
+    desc: runs the API documentation generator
+    cmds:
+      - poetry run python dev/code-generation/gen_docs_api.py
+
   docs:
     desc: runs the documentation server
     dir: docs
+    deps:
+      - docs:gen
     cmds:
-      - uv run python -m mkdocs serve
+      - poetry run python -m mkdocs serve
 
   setup:ui:
     desc: setup frontend dependencies
@@ -40,30 +47,20 @@ tasks:
     sources:
       - package.json
       - yarn.lock
+    generates:
+      - node_modules/**
 
   setup:py:
     desc: setup python dependencies
     run: once
     cmds:
-      - uv sync --extra pgsql --group dev
-      - uv run pre-commit install
+      - poetry install --with main,dev,postgres
+      - poetry run pre-commit install
     sources:
-      - uv.lock
+      - poetry.lock
       - pyproject.toml
       - .pre-commit-config.yaml
 
-  setup:e2e:
-    desc: setup e2e test dependencies
-    dir: tests/e2e
-    run: once
-    cmds:
-      - yarn install
-      - yarn playwright install --with-deps
-    sources:
-      - package.json
-      - playwright.config.ts
-      - yarn.lock
-
   setup:
     desc: setup all dependencies
     deps:
@@ -73,7 +70,7 @@ tasks:
   dev:generate:
     desc: run code generators
     cmds:
-      - uv run python dev/code-generation/main.py {{ .CLI_ARGS }}
+      - poetry run python dev/code-generation/main.py {{ .CLI_ARGS }}
       - task: py:format
 
   dev:services:
@@ -90,30 +87,28 @@ tasks:
       - rm -r ./dev/data/recipes/
       - rm -r ./dev/data/users/
       - rm -f ./dev/data/mealie*.db
-      - rm -f ./dev/data/mealie*.db-shm
-      - rm -f ./dev/data/mealie*.db-wal
       - rm -f ./dev/data/mealie.log
       - rm -f ./dev/data/.secret
 
   py:mypy:
     desc: runs python type checking
     cmds:
-      - uv run mypy mealie
+      - poetry run mypy mealie
 
   py:test:
     desc: runs python tests (support args after '--')
     cmds:
-      - uv run pytest {{ .CLI_ARGS }}
+      - poetry run pytest {{ .CLI_ARGS }}
 
   py:format:
     desc: runs python code formatter
     cmds:
-      - uv run ruff format .
+      - poetry run ruff format .
 
   py:lint:
     desc: runs python linter
     cmds:
-      - uv run ruff check mealie
+      - poetry run ruff check mealie
 
   py:check:
     desc: runs all linters, type checkers, and formatters
@@ -126,10 +121,10 @@ tasks:
   py:coverage:
     desc: runs python coverage and generates html report
     cmds:
-      - uv run pytest
-      - uv run coverage report -m
-      - uv run coveragepy-lcov
-      - uv run coverage html
+      - poetry run pytest
+      - poetry run coverage report -m
+      - poetry run coveragepy-lcov
+      - poetry run coverage html
       - open htmlcov/index.html
 
   py:package:copy-frontend:
@@ -149,17 +144,17 @@ tasks:
     desc: Generate requirements file to pin all packages, effectively a "pip freeze" before installation begins
     internal: true
     cmds:
-      - uv export --no-editable --no-emit-project --extra pgsql --format requirements-txt --output-file dist/requirements.txt
+      - poetry export -n --only=main --extras=pgsql --output=dist/requirements.txt
       # Include mealie in the requirements, hashing the package that was just built to ensure it's the one installed
       - echo "mealie[pgsql]=={{.MEALIE_VERSION}} \\" >> dist/requirements.txt
-      - pip hash dist/mealie-{{.MEALIE_VERSION}}-py3-none-any.whl | tail -n1 | tr -d '\n' >> dist/requirements.txt
+      - poetry run pip hash dist/mealie-{{.MEALIE_VERSION}}-py3-none-any.whl | tail -n1 | tr -d '\n' >> dist/requirements.txt
       - echo " \\" >> dist/requirements.txt
-      - pip hash dist/mealie-{{.MEALIE_VERSION}}.tar.gz | tail -n1 >> dist/requirements.txt
+      - poetry run pip hash dist/mealie-{{.MEALIE_VERSION}}.tar.gz | tail -n1 >> dist/requirements.txt
     vars:
       MEALIE_VERSION:
-         sh: python -c "import tomllib; print(tomllib.load(open('pyproject.toml', 'rb'))['project']['version'])"
+         sh: poetry version --short
     sources:
-      - uv.lock
+      - poetry.lock
       - pyproject.toml
       - dist/mealie-*.whl
       - dist/mealie-*.tar.gz
@@ -181,27 +176,18 @@ tasks:
     status:
       - '{{ .SKIP_PACKAGE_DEPS | default "false"}}'
 
-  py:package:build:
-    internal: true
+  py:package:
+    desc: builds Python packages (sdist and wheel) in top-level dist directory
     deps:
       - py:package:deps
     cmds:
-      - uv build --out-dir dist
-    sources:
-      - uv.lock
-      - pyproject.toml
-      - mealie/**
-
-  py:package:
-    desc: builds Python packages (sdist and wheel) in top-level dist directory
-    cmds:
-      - task: py:package:build
+      - poetry build -n --output=dist
       - task: py:package:generate-requirements
 
   py:
     desc: runs the backend server
     cmds:
-      - uv run python mealie/app.py
+      - poetry run python mealie/app.py
 
   py:postgres:
     desc: runs the backend server configured for containerized postgres
@@ -213,12 +199,12 @@ tasks:
       POSTGRES_PORT: 5432
       POSTGRES_DB: mealie
     cmds:
-      - uv run python mealie/app.py
+      - poetry run python mealie/app.py
 
   py:migrate:
     desc: generates a new database migration file e.g. task py:migrate -- "add new column"
     cmds:
-      - uv run alembic --config mealie/alembic/alembic.ini revision --autogenerate -m "{{ .CLI_ARGS }}"
+      - poetry run alembic --config mealie/alembic/alembic.ini revision --autogenerate -m "{{ .CLI_ARGS }}"
       - task: py:format
 
   ui:build:
@@ -226,12 +212,6 @@ tasks:
     dir: frontend
     cmds:
       - yarn build
-    sources:
-      - "**"
-      - exclude: .nuxt/**
-      - exclude: .output/**
-      - exclude: dist/**
-      - exclude: node_modules/.cache/**
 
   ui:generate:
     desc: generates a static version of the frontend in frontend/dist
@@ -240,36 +220,18 @@ tasks:
       - setup:ui
     cmds:
       - yarn generate
-    sources:
-      - "**"
-      - exclude: .nuxt/**
-      - exclude: .output/**
-      - exclude: dist/**
-      - exclude: node_modules/.cache/**
 
   ui:lint:
     desc: runs the frontend linter
     dir: frontend
     cmds:
-      - yarn lint --max-warnings=0
-    sources:
-      - "**"
-      - exclude: .nuxt/**
-      - exclude: .output/**
-      - exclude: dist/**
-      - exclude: node_modules/.cache/**
+      - yarn lint
 
   ui:test:
     desc: runs the frontend tests
     dir: frontend
     cmds:
       - yarn test
-    sources:
-      - "**"
-      - exclude: .nuxt/**
-      - exclude: .output/**
-      - exclude: dist/**
-      - exclude: node_modules/.cache/**
 
   ui:check:
     desc: runs all frontend checks
@@ -298,48 +260,3 @@ tasks:
     dir: docker
     cmds:
       - docker compose -f docker-compose.yml -p mealie up -d --build
-
-  e2e:build-image:
-    desc: builds the e2e test docker image
-    deps:
-       - py:package
-    cmds:
-      - docker build --tag mealie:e2e --file docker/Dockerfile --build-context packages=dist .
-    sources:
-      - docker/Dockerfile
-      - dist/**
-
-  e2e:start-server:
-    desc: Builds the image and starts the containers for e2e testing
-    dir: tests/e2e/docker
-    deps:
-       - e2e:build-image
-    vars:
-      WAIT_UNTIL_HEALTHY: '{{if .WAIT_UNTIL_HEALTHY}}--wait{{else}}{{end}}'
-    cmds:
-      - docker compose up -d {{.WAIT_UNTIL_HEALTHY}}
-
-  e2e:stop-server:
-    desc: Shuts down the e2e testing containers
-    dir: tests/e2e/docker
-    cmds:
-      - docker compose down --volumes
-
-  e2e:test:
-    desc: runs the e2e tests
-    dir: tests/e2e
-    deps:
-      - setup:e2e
-    vars:
-      PREVENT_REPORT_OPEN: '{{if .PREVENT_REPORT_OPEN}}PLAYWRIGHT_HTML_OPEN=never{{else}}{{end}}'
-    cmds:
-      - '{{.PREVENT_REPORT_OPEN}} yarn playwright test'
-
-  e2e:
-    desc: runs the full e2e test suite
-    cmds:
-      - task: e2e:start-server
-        vars: { WAIT_UNTIL_HEALTHY: true }
-      - defer: { task: e2e:stop-server }
-      - task: e2e:test
-        vars: { PREVENT_REPORT_OPEN: true }

cliff.toml

@@ -35,7 +35,7 @@ conventional_commits = true
 filter_unconventional = true
 # regex for preprocessing the commit messages
 commit_preprocessors = [
-    { pattern = '\((\w+\s)?#([0-9]+)\)', replace = "([#${2}](https://github.com/mealie-recipes/mealie/issues/${2}))"},
+    { pattern = '\((\w+\s)?#([0-9]+)\)', replace = "([#${2}](https://github.com/hay-kot/mealie/issues/${2}))"},
 ]
 # regex for parsing and grouping commits
 commit_parsers = [

crowdin.yml

@@ -4,8 +4,8 @@ pull_request_labels: [
   "l10n"
 ]
 files:
-  - source: /frontend/app/lang/messages/en-US.json
-    translation: /frontend/app/lang/messages/%locale%.json
+  - source: /frontend/lang/messages/en-US.json
+    translation: /frontend/lang/messages/%locale%.json
   - source: /mealie/lang/messages/en-US.json
     translation: /mealie/lang/messages/%locale%.json
   - source: /mealie/repos/seed/resources/foods/locales/en-US.json

dev/code-generation/gen_docs_api.py

@@ -0,0 +1,50 @@
+import json
+
+from fastapi import FastAPI
+from freezegun import freeze_time
+
+from mealie.app import app
+from mealie.core.config import determine_data_dir
+
+DATA_DIR = determine_data_dir()
+
+"""Script to export the ReDoc documentation page into a standalone HTML file."""
+
+HTML_TEMPLATE = """<!-- Custom HTML site displayed as the Home chapter -->
+{% extends "main.html" %}
+{% block tabs %}
+{{ super() }}
+
+<style>
+    body {
+        margin: 0;
+        padding: 0;
+    }
+</style>
+
+
+<div id="redoc-container"></div>
+<script src="https://cdn.jsdelivr.net/npm/redoc/bundles/redoc.standalone.js"> </script>
+<script>
+    var spec = MY_SPECIFIC_TEXT;
+    Redoc.init(spec, {}, document.getElementById("redoc-container"));
+</script>
+
+
+{% endblock %}
+{% block content %}{% endblock %}
+{% block footer %}{% endblock %}
+"""
+
+HTML_PATH = DATA_DIR.parent.parent.joinpath("docs/docs/overrides/api.html")
+
+
+def generate_api_docs(my_app: FastAPI):
+    with open(HTML_PATH, "w") as fd:
+        text = HTML_TEMPLATE.replace("MY_SPECIFIC_TEXT", json.dumps(my_app.openapi()))
+        fd.write(text)
+
+
+if __name__ == "__main__":
+    with freeze_time("2024-01-20T17:00:55Z"):
+        generate_api_docs(app)

dev/code-generation/gen_py_pytest_data_paths.py

@@ -1,4 +1,3 @@
-import subprocess
 from dataclasses import dataclass
 from pathlib import Path
 
@@ -106,16 +105,12 @@ def main():
     # Flatten list of lists
     all_children = [item for sublist in all_children for item in sublist]
 
-    out_path = GENERATED / "__init__.py"
     render_python_template(
         TEMPLATE,
-        out_path,
+        GENERATED / "__init__.py",
         {"children": all_children},
     )
 
-    subprocess.run(["uv", "run", "ruff", "check", str(out_path), "--fix"])
-    subprocess.run(["uv", "run", "ruff", "format", str(out_path)])
-
 
 if __name__ == "__main__":
     main()

dev/code-generation/gen_py_schema_exports.py

@@ -1,6 +1,5 @@
 import pathlib
 import re
-import subprocess
 from dataclasses import dataclass, field
 
 from utils import PROJECT_DIR, log, render_python_template
@@ -85,23 +84,16 @@ def find_modules(root: pathlib.Path) -> list[Modules]:
     return modules
 
 
-def main() -> None:
+def main():
     modules = find_modules(SCHEMA_PATH)
 
-    template_paths: list[pathlib.Path] = []
     for module in modules:
         log.debug(f"Module: {module.directory.name}")
         for file in module.files:
             log.debug(f"  File: {file.import_path}")
             log.debug(f"    Classes: [{', '.join(file.classes)}]")
 
-        template_path = module.directory / "__init__.py"
-        template_paths.append(template_path)
-        render_python_template(template, template_path, {"module": module})
-
-    path_args = (str(p) for p in template_paths)
-    subprocess.run(["uv", "run", "ruff", "check", *path_args, "--fix"])
-    subprocess.run(["uv", "run", "ruff", "format", *path_args])
+        render_python_template(template, module.directory / "__init__.py", {"module": module})
 
 
 if __name__ == "__main__":

dev/code-generation/gen_ts_locales.py

@@ -1,7 +1,6 @@
-import json
 import os
 import pathlib
-import re
+from dataclasses import dataclass
 from pathlib import Path
 
 import dotenv
@@ -11,7 +10,6 @@ from pydantic import ConfigDict
 from requests import Response
 from utils import CodeDest, CodeKeys, inject_inline, log
 
-from mealie.lang.locale_config import LOCALE_CONFIG, LocalePluralFoodHandling, LocaleTextDirection
 from mealie.schema._mealie import MealieModel
 
 BASE = pathlib.Path(__file__).parent.parent.parent
@@ -19,6 +17,57 @@ BASE = pathlib.Path(__file__).parent.parent.parent
 API_KEY = dotenv.get_key(BASE / ".env", "CROWDIN_API_KEY") or os.environ.get("CROWDIN_API_KEY", "")
 
 
+@dataclass
+class LocaleData:
+    name: str
+    dir: str = "ltr"
+
+
+LOCALE_DATA: dict[str, LocaleData] = {
+    "af-ZA": LocaleData(name="Afrikaans (Afrikaans)"),
+    "ar-SA": LocaleData(name="العربية (Arabic)", dir="rtl"),
+    "bg-BG": LocaleData(name="Български (Bulgarian)"),
+    "ca-ES": LocaleData(name="Català (Catalan)"),
+    "cs-CZ": LocaleData(name="Čeština (Czech)"),
+    "da-DK": LocaleData(name="Dansk (Danish)"),
+    "de-DE": LocaleData(name="Deutsch (German)"),
+    "el-GR": LocaleData(name="Ελληνικά (Greek)"),
+    "en-GB": LocaleData(name="British English"),
+    "en-US": LocaleData(name="American English"),
+    "es-ES": LocaleData(name="Español (Spanish)"),
+    "et-EE": LocaleData(name="Eesti (Estonian)"),
+    "fi-FI": LocaleData(name="Suomi (Finnish)"),
+    "fr-BE": LocaleData(name="Belge (Belgian)"),
+    "fr-CA": LocaleData(name="Français canadien (Canadian French)"),
+    "fr-FR": LocaleData(name="Français (French)"),
+    "gl-ES": LocaleData(name="Galego (Galician)"),
+    "he-IL": LocaleData(name="עברית (Hebrew)", dir="rtl"),
+    "hr-HR": LocaleData(name="Hrvatski (Croatian)"),
+    "hu-HU": LocaleData(name="Magyar (Hungarian)"),
+    "is-IS": LocaleData(name="Íslenska (Icelandic)"),
+    "it-IT": LocaleData(name="Italiano (Italian)"),
+    "ja-JP": LocaleData(name="日本語 (Japanese)"),
+    "ko-KR": LocaleData(name="한국어 (Korean)"),
+    "lt-LT": LocaleData(name="Lietuvių (Lithuanian)"),
+    "lv-LV": LocaleData(name="Latviešu (Latvian)"),
+    "nl-NL": LocaleData(name="Nederlands (Dutch)"),
+    "no-NO": LocaleData(name="Norsk (Norwegian)"),
+    "pl-PL": LocaleData(name="Polski (Polish)"),
+    "pt-BR": LocaleData(name="Português do Brasil (Brazilian Portuguese)"),
+    "pt-PT": LocaleData(name="Português (Portuguese)"),
+    "ro-RO": LocaleData(name="Română (Romanian)"),
+    "ru-RU": LocaleData(name="Pусский (Russian)"),
+    "sk-SK": LocaleData(name="Slovenčina (Slovak)"),
+    "sl-SI": LocaleData(name="Slovenščina (Slovenian)"),
+    "sr-SP": LocaleData(name="српски (Serbian)"),
+    "sv-SE": LocaleData(name="Svenska (Swedish)"),
+    "tr-TR": LocaleData(name="Türkçe (Turkish)"),
+    "uk-UA": LocaleData(name="Українська (Ukrainian)"),
+    "vi-VN": LocaleData(name="Tiếng Việt (Vietnamese)"),
+    "zh-CN": LocaleData(name="简体中文 (Chinese simplified)"),
+    "zh-TW": LocaleData(name="繁體中文 (Chinese traditional)"),
+}
+
 LOCALE_TEMPLATE = """// This Code is auto generated by gen_ts_locales.py
 export const LOCALES = [{% for locale in locales %}
   {
@@ -26,7 +75,6 @@ export const LOCALES = [{% for locale in locales %}
     value: "{{ locale.locale }}",
     progress: {{ locale.progress }},
     dir: "{{ locale.dir }}",
-    pluralFoodHandling: "{{ locale.plural_food_handling }}",
   },{% endfor %}
 ];
 
@@ -39,11 +87,10 @@ class TargetLanguage(MealieModel):
     id: str
     name: str
     locale: str
-    dir: LocaleTextDirection = LocaleTextDirection.LTR
-    plural_food_handling: LocalePluralFoodHandling = LocalePluralFoodHandling.ALWAYS
+    dir: str = "ltr"
     threeLettersCode: str
     twoLettersCode: str
-    progress: int = 0
+    progress: float = 0.0
 
 
 class CrowdinApi:
@@ -70,24 +117,52 @@ class CrowdinApi:
     def get_languages(self) -> list[TargetLanguage]:
         response = self.get_project()
         tls = response.json()["data"]["targetLanguages"]
-        return [TargetLanguage(**t) for t in tls]
 
-    def get_progress(self) -> dict[str, int]:
+        models = [TargetLanguage(**t) for t in tls]
+
+        models.insert(
+            0,
+            TargetLanguage(
+                id="en-US",
+                name="English",
+                locale="en-US",
+                dir="ltr",
+                threeLettersCode="en",
+                twoLettersCode="en",
+                progress=100,
+            ),
+        )
+
+        progress: list[dict] = self.get_progress()["data"]
+
+        for model in models:
+            if model.locale in LOCALE_DATA:
+                locale_data = LOCALE_DATA[model.locale]
+                model.name = locale_data.name
+                model.dir = locale_data.dir
+
+            for p in progress:
+                if p["data"]["languageId"] == model.id:
+                    model.progress = p["data"]["translationProgress"]
+
+        models.sort(key=lambda x: x.locale, reverse=True)
+        return models
+
+    def get_progress(self) -> dict:
         response = requests.get(
             f"https://api.crowdin.com/api/v2/projects/{self.project_id}/languages/progress?limit=500",
             headers=self.headers,
         )
-        data = response.json()["data"]
-        return {p["data"]["languageId"]: p["data"]["translationProgress"] for p in data}
+        return response.json()
 
 
 PROJECT_DIR = Path(__file__).parent.parent.parent
 
 
-datetime_dir = PROJECT_DIR / "frontend" / "app" / "lang" / "dateTimeFormats"
-locales_dir = PROJECT_DIR / "frontend" / "app" / "lang" / "messages"
+datetime_dir = PROJECT_DIR / "frontend" / "lang" / "dateTimeFormats"
+locales_dir = PROJECT_DIR / "frontend" / "lang" / "messages"
 nuxt_config = PROJECT_DIR / "frontend" / "nuxt.config.ts"
-i18n_config = PROJECT_DIR / "frontend" / "app" / "i18n.config.ts"
+i18n_config = PROJECT_DIR / "frontend" / "i18n.config.ts"
 reg_valid = PROJECT_DIR / "mealie" / "schema" / "_mealie" / "validators.py"
 
 """
@@ -98,36 +173,15 @@ the code generation ID is hardcoded into the script and required in the nuxt con
 
 
 def inject_nuxt_values():
-    datetime_files = list(datetime_dir.glob("*.json"))
-    datetime_files.sort()
-
-    datetime_imports = []
-    datetime_object_entries = []
-
-    for match in datetime_files:
-        # Convert locale name to camelCase variable name (e.g., "en-US" -> "enUS")
-        var_name = match.stem.replace("-", "")
-
-        # Generate import statement
-        import_line = f'import * as {var_name} from "./lang/dateTimeFormats/{match.name}";'
-        datetime_imports.append(import_line)
-
-        # Generate object entry
-        object_entry = f'  "{match.stem}": {var_name},'
-        datetime_object_entries.append(object_entry)
-
-    all_date_locales = datetime_imports + ["", "const datetimeFormats = {"] + datetime_object_entries + ["};"]
+    all_date_locales = [
+        f'"{match.stem}": require("./lang/dateTimeFormats/{match.name}"),' for match in datetime_dir.glob("*.json")
+    ]
 
     all_langs = []
     for match in locales_dir.glob("*.json"):
-        match_data = LOCALE_CONFIG.get(match.stem)
-        match_dir = match_data.dir if match_data else LocaleTextDirection.LTR
-
-        lang_string = f'{{ code: "{match.stem}", file: "{match.name.replace(".json", ".ts")}", dir: "{match_dir}" }},'
+        lang_string = f'{{ code: "{match.stem}", file: "{match.name.replace(".json", ".ts")}" }},'
         all_langs.append(lang_string)
 
-    all_langs.sort()
-
     log.debug(f"injecting locales into nuxt config -> {nuxt_config}")
     inject_inline(nuxt_config, CodeKeys.nuxt_local_messages, all_langs)
     inject_inline(i18n_config, CodeKeys.nuxt_local_dates, all_date_locales)
@@ -146,82 +200,9 @@ def inject_registration_validation_values():
     inject_inline(reg_valid, CodeKeys.nuxt_local_messages, all_langs)
 
 
-def _get_local_models() -> list[TargetLanguage]:
-    return [
-        TargetLanguage(
-            id=locale,
-            name=data.name,
-            locale=locale,
-            threeLettersCode=locale.split("-")[-1],
-            twoLettersCode=locale.split("-")[-1],
-        )
-        for locale, data in LOCALE_CONFIG.items()
-        if locale != "en-US"  # Crowdin doesn't include this, so we manually inject it later
-    ]
-
-
-def _get_local_progress() -> dict[str, int]:
-    with open(CodeDest.use_locales) as f:
-        content = f.read()
-
-    # Extract the array content between [ and ]
-    match = re.search(r"export const LOCALES = (\[.*?\]);", content, re.DOTALL)
-    if not match:
-        raise ValueError("Could not find LOCALES array in file")
-
-    # Convert JS to JSON
-    array_content = match.group(1)
-
-    # Replace unquoted keys with quoted keys for valid JSON
-    # This converts: { name: "value" } to { "name": "value" }
-    json_str = re.sub(r"([,\{\s])([a-zA-Z_][a-zA-Z0-9_]*)\s*:", r'\1"\2":', array_content)
-
-    # Remove trailing commas before } and ]
-    json_str = re.sub(r",(\s*[}\]])", r"\1", json_str)
-
-    locales = json.loads(json_str)
-    return {locale["value"]: locale["progress"] for locale in locales}
-
-
-def get_languages() -> list[TargetLanguage]:
-    if API_KEY:
-        api = CrowdinApi(None)
-        models = api.get_languages()
-        progress = api.get_progress()
-    else:
-        log.warning("CROWDIN_API_KEY is not set, using local lanugages instead")
-        log.warning("DOUBLE CHECK the output!!! Do not overwrite with bad local locale data!")
-        models = _get_local_models()
-        progress = _get_local_progress()
-
-    models.insert(
-        0,
-        TargetLanguage(
-            id="en-US",
-            name="English",
-            locale="en-US",
-            dir=LocaleTextDirection.LTR,
-            plural_food_handling=LocalePluralFoodHandling.WITHOUT_UNIT,
-            threeLettersCode="en",
-            twoLettersCode="en",
-            progress=100,
-        ),
-    )
-
-    for model in models:
-        if model.locale in LOCALE_CONFIG:
-            locale_data = LOCALE_CONFIG[model.locale]
-            model.name = locale_data.name
-            model.dir = locale_data.dir
-            model.plural_food_handling = locale_data.plural_food_handling
-            model.progress = progress.get(model.id, model.progress)
-
-    models.sort(key=lambda x: x.locale, reverse=True)
-    return models
-
-
 def generate_locales_ts_file():
-    models = get_languages()
+    api = CrowdinApi(None)
+    models = api.get_languages()
     tmpl = Template(LOCALE_TEMPLATE)
     rendered = tmpl.render(locales=models)
 
@@ -231,6 +212,10 @@ def generate_locales_ts_file():
 
 
 def main():
+    if API_KEY is None or API_KEY == "":
+        log.error("CROWDIN_API_KEY is not set")
+        return
+
     generate_locales_ts_file()
     inject_nuxt_values()
     inject_registration_validation_values()

dev/code-generation/gen_ts_types.py

@@ -1,5 +1,4 @@
 import re
-import subprocess
 from pathlib import Path
 
 from jinja2 import Template
@@ -9,8 +8,8 @@ from utils import log
 # ============================================================
 
 template = """// This Code is auto generated by gen_ts_types.py
-{% for name in global %}import type {{ name }} from "@/components/global/{{ name }}.vue";
-{% endfor %}{% for name in layout %}import type {{ name }} from "@/components/layout/{{ name }}.vue";
+{% for name in global %}import {{ name }} from "@/components/global/{{ name }}.vue";
+{% endfor %}{% for name in layout %}import {{ name }} from "@/components/layout/{{ name }}.vue";
 {% endfor %}
 declare module "vue" {
   export interface GlobalComponents {
@@ -33,11 +32,11 @@ PROJECT_DIR = Path(__file__).parent.parent.parent
 
 
 def generate_global_components_types() -> None:
-    destination_file = PROJECT_DIR / "frontend" / "app" / "types" / "components.d.ts"
+    destination_file = PROJECT_DIR / "frontend" / "types" / "components.d.ts"
 
     component_paths = {
-        "global": PROJECT_DIR / "frontend" / "app" / "components" / "global",
-        "layout": PROJECT_DIR / "frontend" / "app" / "components" / "Layout",
+        "global": PROJECT_DIR / "frontend" / "components" / "global",
+        "layout": PROJECT_DIR / "frontend" / "components" / "Layout",
     }
 
     def render_template(template: str, data: dict) -> str | None:
@@ -182,7 +181,7 @@ def generate_typescript_types() -> None:  # noqa: C901
         return str_path
 
     schema_path = PROJECT_DIR / "mealie" / "schema"
-    types_dir = PROJECT_DIR / "frontend" / "app" / "lib" / "api" / "types"
+    types_dir = PROJECT_DIR / "frontend" / "lib" / "api" / "types"
 
     ignore_dirs = ["__pycache__", "static", "_mealie"]
 
@@ -190,7 +189,6 @@ def generate_typescript_types() -> None:  # noqa: C901
     skipped_dirs: list[Path] = []
     failed_modules: list[Path] = []
 
-    out_paths: list[Path] = []
     for module in schema_path.iterdir():
         if module.is_dir() and module.stem in ignore_dirs:
             skipped_dirs.append(module)
@@ -207,18 +205,10 @@ def generate_typescript_types() -> None:  # noqa: C901
             path_as_module = path_to_module(module)
             generate_typescript_defs(path_as_module, str(out_path), exclude=("MealieModel"))  # type: ignore
             clean_output_file(out_path)
-            out_paths.append(out_path)
         except Exception:
             failed_modules.append(module)
             log.exception(f"Module Error: {module}")
 
-    # Run ESLint --fix on the files to clean up any formatting issues
-    subprocess.run(
-        ["yarn", "lint", "--fix", *(str(path) for path in out_paths)],
-        check=True,
-        cwd=PROJECT_DIR / "frontend",
-    )
-
     log.debug("\n📁 Skipped Directories:")
     for skipped_dir in skipped_dirs:
         log.debug(f"   📁 {skipped_dir.name}")

dev/code-generation/utils/static.py

@@ -16,7 +16,7 @@ class CodeTemplates:
 class CodeDest:
     interface = PARENT / "generated" / "interface.js"
     pytest_routes = PARENT / "generated" / "test_routes.py"
-    use_locales = PROJECT_DIR / "frontend" / "app" / "composables" / "use-locales" / "available-locales.ts"
+    use_locales = PROJECT_DIR / "frontend" / "composables" / "use-locales" / "available-locales.ts"
 
 
 class CodeKeys:

dev/code-generation/utils/template.py

@@ -1,4 +1,5 @@
 import logging
+import subprocess
 from dataclasses import dataclass
 from pathlib import Path
 
@@ -22,6 +23,11 @@ def render_python_template(template_file: Path | str, dest: Path, data: dict):
 
     dest.write_text(text)
 
+    # lint/format file with Ruff
+    log.info(f"Formatting {dest}")
+    subprocess.run(["poetry", "run", "ruff", "check", str(dest), "--fix"])
+    subprocess.run(["poetry", "run", "ruff", "format", str(dest)])
+
 
 @dataclass
 class CodeSlicer:
@@ -31,7 +37,7 @@ class CodeSlicer:
     indentation: str | None
     text: list[str]
 
-    _next_line: int | None = None
+    _next_line = None
 
     def purge_lines(self) -> None:
         start = self.start + 1

dev/scripts/all_recipes_stress_test.py

@@ -44,6 +44,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1 cup unsalted butter, cut into cubes",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "ea3b6702-9532-4fbc-a40b-f99917831c26",
@@ -53,6 +54,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1 cup light brown sugar",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "c5bbfefb-1e23-4ffd-af88-c0363a0fae82",
@@ -62,6 +64,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1/2 cup granulated white sugar",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "034f481b-c426-4a17-b983-5aea9be4974b",
@@ -71,6 +74,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "2 large eggs",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "37c1f796-3bdb-4856-859f-dbec90bc27e4",
@@ -80,6 +84,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "2 tsp vanilla extract",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "85561ace-f249-401d-834c-e600a2f6280e",
@@ -89,6 +94,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1/2 cup creamy peanut butter",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "ac91bda0-e8a8-491a-976a-ae4e72418cfd",
@@ -98,6 +104,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1 tsp cornstarch",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "4d1256b3-115e-4475-83cd-464fbc304cb0",
@@ -107,6 +114,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1 tsp baking soda",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "64627441-39f9-4ee3-8494-bafe36451d12",
@@ -116,6 +124,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1/2 tsp salt",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "7ae212d0-3cd1-44b0-899e-ec5bd91fd384",
@@ -125,6 +134,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1 cup cake flour",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "06967994-8548-4952-a8cc-16e8db228ebd",
@@ -134,6 +144,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "2 cups all-purpose flour",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "bdb33b23-c767-4465-acf8-3b8e79eb5691",
@@ -143,6 +154,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "2 cups peanut butter chips",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "12ba0af8-affd-4fb2-9cca-6f1b3e8d3aef",
@@ -152,6 +164,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
                 "note": "1½ cups Reese's Pieces candies",
                 "unit": None,
                 "food": None,
+                "disableAmount": True,
                 "quantity": 1,
                 "originalText": None,
                 "referenceId": "4bdc0598-a3eb-41ee-8af0-4da9348fbfe2",
@@ -208,6 +221,7 @@ def recipe_data(name: str, slug: str, id: str, userId: str, groupId: str) -> dic
             "showAssets": False,
             "landscapeView": False,
             "disableComments": False,
+            "disableAmount": True,
             "locked": False,
         },
         "assets": [],

docker/Dockerfile

@@ -1,8 +1,7 @@
 ###############################################
 # Frontend Build
 ###############################################
-FROM node:24@sha256:80fc934952c8f1b2b4d39907af7211f8a9fff1a4c2cf673fb49099292c251cec \
-    AS frontend-builder
+FROM node:20 AS frontend-builder
 
 WORKDIR /frontend
 
@@ -21,8 +20,7 @@ RUN yarn generate
 ###############################################
 # Base Image - Python
 ###############################################
-FROM python:3.12-slim@sha256:7026274c107626d7e940e0e5d6730481a4600ae95d5ca7eb532dd4180313fea9 \
-    AS python-base
+FROM python:3.12-slim AS python-base
 
 ENV MEALIE_HOME="/app"
 
@@ -50,29 +48,40 @@ RUN apt-get update \
     curl \
     && rm -rf /var/lib/apt/lists/*
 
-RUN pip install uv
+ENV POETRY_HOME="/opt/poetry" \
+    POETRY_NO_INTERACTION=1
+
+# prepend poetry to path
+ENV PATH="$POETRY_HOME/bin:$PATH"
+
+# install poetry - respects $POETRY_VERSION & $POETRY_HOME
+ENV POETRY_VERSION=2.0.1
+RUN curl -sSL https://install.python-poetry.org | python3 -
+
+# install poetry plugins needed to build the package
+RUN poetry self add "poetry-plugin-export>=1.9"
 
 WORKDIR /mealie
 
 # copy project files here to ensure they will be cached.
-COPY uv.lock pyproject.toml ./
+COPY poetry.lock pyproject.toml ./
 COPY mealie ./mealie
 
 # Copy frontend to package it into the wheel
 COPY --from=frontend-builder /frontend/dist ./mealie/frontend
 
 # Build the source and binary package
-RUN uv build --out-dir dist
+RUN poetry build --output=dist
 
 # Create the requirements file, which is used to install the built package and
 # its pinned dependencies later. mealie is included to ensure the built one is
 # what's installed.
-RUN uv export --no-editable --no-emit-project --extra pgsql --format requirements-txt --output-file dist/requirements.txt \
-    && MEALIE_VERSION=$(python -c "import tomllib; print(tomllib.load(open('pyproject.toml', 'rb'))['project']['version'])") \
-    && echo "mealie[pgsql]==${MEALIE_VERSION} \\" >> dist/requirements.txt \
-    && pip hash dist/mealie-${MEALIE_VERSION}-py3-none-any.whl | tail -n1 | tr -d '\n' >> dist/requirements.txt \
+RUN export MEALIE_VERSION=$(poetry version --short) \
+    && poetry export --only=main --extras=pgsql --output=dist/requirements.txt \
+    && echo "mealie[pgsql]==$MEALIE_VERSION \\" >> dist/requirements.txt \
+    && poetry run pip hash dist/mealie-$MEALIE_VERSION-py3-none-any.whl | tail -n1 | tr -d '\n' >> dist/requirements.txt \
     && echo " \\" >> dist/requirements.txt \
-    && pip hash dist/mealie-${MEALIE_VERSION}.tar.gz | tail -n1 >> dist/requirements.txt
+    && poetry run pip hash dist/mealie-$MEALIE_VERSION.tar.gz | tail -n1 >> dist/requirements.txt
 
 ###############################################
 # Package Container
@@ -91,7 +100,6 @@ RUN apt-get update \
     build-essential \
     libpq-dev \
     libwebp-dev \
-    ffmpeg \
     # LDAP Dependencies
     libsasl2-dev libldap2-dev libssl-dev \
     gnupg gnupg2 gnupg1 \
@@ -112,6 +120,7 @@ RUN . $VENV_PATH/bin/activate \
 # Production Image
 ###############################################
 FROM python-base AS production
+LABEL org.opencontainers.image.source="https://github.com/mealie-recipes/mealie"
 ENV PRODUCTION=true
 ENV TESTING=false
 
@@ -120,12 +129,10 @@ ENV GIT_COMMIT_HASH=$COMMIT
 
 RUN apt-get update \
     && apt-get install --no-install-recommends -y \
-    curl \
-    ffmpeg \
     gosu \
     iproute2 \
     libldap-common \
-    libldap2 \
+    libldap-2.5 \
     && rm -rf /var/lib/apt/lists/*
 
 # create directory used for Docker Secrets
@@ -144,9 +151,7 @@ ENV APP_PORT=9000
 
 EXPOSE ${APP_PORT}
 
-COPY ./docker/healthcheck.sh $MEALIE_HOME/healthcheck.sh
-RUN chmod +x $MEALIE_HOME/healthcheck.sh
-HEALTHCHECK CMD $MEALIE_HOME/healthcheck.sh
+HEALTHCHECK CMD python -m mealie.scripts.healthcheck || exit 1
 
 ENV HOST 0.0.0.0
 

docker/healthcheck.sh

@@ -1,12 +0,0 @@
-#!/bin/bash
-
-PORT="${API_PORT:-9000}"
-
-if [ -n "$TLS_CERTIFICATE_PATH" ] && [ -n "$TLS_PRIVATE_KEY_PATH" ]; then
-  PROTO="https"
-else
-  PROTO="http"
-fi
-
-# -k: TLS certificate is likely not issued for 127.0.0.1, so don't verify
-curl -fsk "${PROTO}://127.0.0.1:${PORT}/api/app/about" > /dev/null

docs/docs/api/redoc.md

@@ -0,0 +1,4 @@
+---
+title: API
+template: api.html
+---

docs/docs/contributors/developers-guide/building-packages.md

@@ -12,13 +12,13 @@ yarnpkg generate
 popd
 rm -r mealie/frontend
 cp -a frontend/dist mealie/frontend
-uv build --out-dir dist
-uv export --no-editable --no-emit-project --extra pgsql --format requirements-txt --output-file dist/requirements.txt
-MEALIE_VERSION=$(python -c "import tomllib; print(tomllib.load(open('pyproject.toml', 'rb'))['project']['version'])")
+poetry build
+poetry export -n --only=main --extras=pgsql --output=dist/requirements.txt
+MEALIE_VERSION=$(poetry version --short)
 echo "mealie[pgsql]==${MEALIE_VERSION} \\" >> dist/requirements.txt
-pip hash dist/mealie-${MEALIE_VERSION}-py3-none-any.whl | tail -n1 | tr -d '\n' >> dist/requirements.txt
+poetry run pip hash dist/mealie-${MEALIE_VERSION}-py3-none-any.whl | tail -n1 | tr -d '\n' >> dist/requirements.txt
 echo " \\" >> dist/requirements.txt
-pip hash dist/mealie-${MEALIE_VERSION}.tar.gz | tail -n1 >> dist/requirements.txt
+poetry run pip hash dist/mealie-${MEALIE_VERSION}.tar.gz | tail -n1 >> dist/requirements.txt
 ```
 
 The Python package can be installed with all of its dependencies pinned to the versions tested by the developers with:

docs/docs/contributors/developers-guide/migration-guide.md

@@ -6,7 +6,7 @@ While this guide aims to simplify the migration process for developers, it's not
 
 ## V1 → V2
 
-The biggest change between V1 and V2 is the introduction of Households. For more information on how households work in relation to groups/users, check out the [Groups and Households](../../documentation/getting-started/features.md#groups-and-households) section in the Features guide.
+The biggest change between V1 and V2 is the introduction of Households. For more information on how households work in relation to groups/users, check out the [Groups and Households](./features.md#groups-and-households) section in the Features guide.
 
 ### `updateAt` is now `updatedAt`
 

docs/docs/contributors/developers-guide/starting-dev-server.md

@@ -33,8 +33,8 @@ Make sure the VSCode Dev Containers extension is installed, then select "Dev Con
 ### Prerequisites
 
 - [Python 3.12](https://www.python.org/downloads/)
-- [uv](https://docs.astral.sh/uv/)
-- [Node](https://nodejs.org/en/)
+- [Poetry](https://python-poetry.org/docs/#installation)
+- [Node v16.x](https://nodejs.org/en/)
 - [yarn](https://classic.yarnpkg.com/lang/en/docs/install/#mac-stable)
 - [task](https://taskfile.dev/#/installation)
 
@@ -45,7 +45,7 @@ Once the prerequisites are installed you can cd into the project base directory
 === "Linux / macOS"
 
     ```bash
-    # Navigate To The Root Directory
+    # Naviate To The Root Directory
     cd /path/to/project
 
     # Utilize the Taskfile to Install Dependencies
@@ -77,7 +77,7 @@ Now you're ready to start the servers. You'll need two shells open, One for the
 
 ### Frontend
 
-We use vue-i18n package for internationalization. Translations are stored in json format located in [frontend/app/lang/messages](https://github.com/mealie-recipes/mealie/tree/mealie-next/frontend/app/lang/messages).
+We use vue-i18n package for internationalization. Translations are stored in json format located in [frontend/lang/messages](https://github.com/mealie-recipes/mealie/tree/mealie-next/frontend/lang/messages).
 
 ### Backend
 

docs/docs/documentation/community-guide/bring-api.md

@@ -1,5 +1,5 @@
 !!! info
-    This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
+This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
 
 Mealie supports adding the ingredients of a recipe to your [Bring](https://www.getbring.com/) shopping list, as you can
 see [here](https://docs.mealie.io/documentation/getting-started/features/#recipe-actions).

docs/docs/documentation/community-guide/home-assistant.md

@@ -1,26 +1,26 @@
 !!! info
-    This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
+  This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
 
 In a lot of ways, Home Assistant is why this project exists! Since Mealie has a robust API it makes it a great fit for interacting with Home Assistant and pulling information into your dashboard.
 
-## Display Today's Meal in Lovelace
+### Display Today's Meal in Lovelace
 
 You can use the Mealie API to get access to meal plans in Home Assistant like in the image below.
 
 ![api-extras-gif](../../assets/img/home-assistant-card.png)
 
-## Steps:
+Steps:
 
-### 1. Get your API Token
+#### 1. Get your API Token
 
-Create an API token from Mealie's User Settings page (see [this page](https://docs.mealie.io/documentation/getting-started/api-usage/#getting-a-token) to learn how).
+Create an API token from Mealie's User Settings page (https://hay-kot.github.io/mealie/documentation/users-groups/user-settings/#api-key-generation)
 
-### 2. Create Home Assistant Sensors
+#### 2. Create Home Assistant Sensors
 
 Create REST sensors in home assistant to get the details of today's meal.
 We will create sensors to get the name and ID of the first meal in today's meal plan (note that this may not be what is wanted if there is more than one meal planned for the day). We need the ID as well as the name to be able to retrieve the image for the meal.
 
-Make sure the url and port (`http://mealie:9000`) matches your installation's address and _API_ port.
+Make sure the url and port (`http://mealie:9000` ) matches your installation's address and _API_ port.
 
 ```yaml
 rest:
@@ -40,7 +40,7 @@ rest:
         unique_id: mealie_todays_meal_id
 ```
 
-### 3. Create a Camera Entity
+#### 3. Create a Camera Entity
 
 We will create a camera entity to display the image of today's meal in Lovelace.
 
@@ -52,7 +52,7 @@ In the still image url field put in:
 Under the entity page for the new camera, rename it.
 e.g. `camera.mealie_todays_meal_image`
 
-### 4. Create a Lovelace Card
+#### 4. Create a Lovelace Card
 
 Create a picture entity card and set the entity to `mealie_todays_meal` and the camera entity to `camera.mealie_todays_meal_image` or set in the yaml directly.
 
@@ -76,4 +76,4 @@ card_mod:
 ```
 
 !!! tip
-    Due to how Home Assistant works with images, I had to include the additional styling to get the images to not appear distorted. This requires an [additional installation](https://github.com/thomasloven/lovelace-card-mod) from HACS.
+Due to how Home Assistant works with images, I had to include the additional styling to get the images to not appear distorted. This requires an [additional installation](https://github.com/thomasloven/lovelace-card-mod) from HACS.

docs/docs/documentation/community-guide/import-recipe-bookmarklet.md

@@ -12,10 +12,12 @@ var url = document.URL.endsWith('/') ?
     document.URL;
 var mealie = "http://localhost:8080";
 var group_slug = "home" // Change this to your group slug. You can obtain this from your URL after logging-in to Mealie
+var use_keywords= "&use_keywords=1" // Optional - use keywords from recipe - update to "" if you don't want that
+var edity = "&edit=1" // Optional - keep in edit mode - update to "" if you don't want that
 
 if (mealie.slice(-1) === "/") {
     mealie = mealie.slice(0, -1)
 }
-var dest = mealie + "/g/" + group_slug + "/r/create/url?recipe_import_url=" + url;
+var dest = mealie + "/g/" + group_slug + "/r/create/url?recipe_import_url=" + url + use_keywords + edity;
 window.open(dest, "_blank");
 ```

docs/docs/documentation/community-guide/ios-shortcut.md

@@ -1,10 +1,9 @@
 !!! info
-    This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
+  This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
 
 An easy way to add recipes to Mealie from an Apple device is via an Apple Shortcut. This is a short guide to install an configure a shortcut able to add recipes via a link or image(s). 
 
-!!! note
-    If adding via images make sure to enable [Mealie's OpenAI Integration](https://docs.mealie.io/documentation/getting-started/installation/open-ai/)
+*Note: if adding via images make sure to enable [Mealie's openai integration](https://docs.mealie.io/documentation/getting-started/installation/open-ai/)*
 
 ## Javascript can only be run via Shortcuts on the Safari browser on MacOS and iOS. If you do not use Safari you may skip this section
 Some sites have begun blocking AI scraping bots, inadvertently blocking the recipe scraping library Mealie uses as well. To circumvent this, the shortcut uses javascript to capture the raw html loaded in the browser and sends that to mealie when possible.
@@ -17,13 +16,12 @@ Settings app -> apps -> Shortcuts -> Advanced -> Allow Running Scripts
 
 Shortcuts app -> Settings (CMD ,) -> Advanced -> Allow Running Scripts
 
-## Initial Setup
+## Initial setup
 An API key is needed to authenticate with mealie. To create an api key for a user, navigate to http://YOUR_MEALIE_URL/user/profile/api-tokens. Alternatively you can create a key via the mealie home page by clicking the user's profile pic in the top left -> Api Tokens
 
 The shortcut can be installed via **[This link](https://www.icloud.com/shortcuts/52834724050b42aebe0f2efd8d067360)**. Upon install, replace "MEALIE_API_KEY" with the API key generated previously and "MEALIE_URI" with the full URL used to access your mealie instance e.g. "http://10.0.0.5:9000" or "https://mealie.domain.com".
 
-## Using the Shortcut
+## Using the shortcut
 Once installed, the shortcut will automatically appear as an option when sharing an image or webpage. It can also be useful to add the shortcut to the home screen of your device. If selected from the home screen or shortcuts app, a menu will appear with prompts to import via **taking photo(s)**, **selecting photo(s)**, **scanning a URL**, or **pasting a URL**. 
 
-!!! note
-    Despite the Mealie API being able to accept multiple recipe images for import it is currently impossible to send multiple files in 1 web request via Shortcuts. Instead, the shortcut combines the images into a singular, vertically-concatenated image to send to mealie. This can result in slightly less-accurate text recognition.
+*Note: despite the mealie API being able to accept multiple recipe images for import it is currently impossible to send multiple files in 1 web request via Shortcuts. Instead, the shortcut combines the images into a singular, vertically-concatenated image to send to mealie. This can result in slightly less-accurate text recognition.*

docs/docs/documentation/community-guide/n8n-backup-automation.md

@@ -1,77 +1,71 @@
 # Automating Backups with n8n
 
 !!! info
-    This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
+This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
 
-[n8n](https://github.com/n8n-io/n8n) is a free and source-available fair-code licensed workflow automation tool. It's an alternative to tools like Zapier or Make, allowing you to use a UI to create automated workflows.
+> [n8n](https://github.com/n8n-io/n8n) is a free and source-available fair-code licensed workflow automation tool. Alternative to Zapier or Make, allowing you to use a UI to create automated workflows.
 
 This example workflow:
 
-1. Creates a Mealie backup every morning via an API call
-2. Keeps the last 7 backups, deleting older ones
+1. Backups Mealie every morning via an API call
+2. Deletes all but the last 7 backups
 
-!!! warning "Important"
-    This only automates the backup function, this does not backup your data to anywhere except your local instance. Please make sure you are backing up your data to an external source.
+> [!CAUTION]
+> This only automates the backup function, this does not backup your data to anywhere except your local instance. Please make sure you are backing up your data to an external source.
 
+---
 
 ![screenshot](../../assets/img/n8n/n8n-mealie-backup.png)
 
-## Setup
+# Setup
 
-### Deploying n8n
+## Deploying n8n
 
 Follow the relevant guide in the [n8n Documentation](https://docs.n8n.io/)
 
-### Importing n8n workflow
+## Importing n8n workflow
 
 1. In n8n, add a new workflow
 2. In the top right hit the 3 dot menu and select 'Import from URL...'
 
-    ![screenshot](../../assets/img/n8n/n8n-workflow-import.png)
+![screenshot](../../assets/img/n8n/n8n-workflow-import.png)
 
-3. Paste `https://github.com/mealie-recipes/mealie/blob/mealie-next/docs/docs/assets/other/n8n/n8n-mealie-backup.json` and click 'Import'
+3. Paste `https://github.com/mealie-recipes/mealie/blob/mealie-next/docs/docs/assets/other/n8n/n8n-mealie-backup.json` and click Import
 4. Click through the nodes and update the URLs for your environment
 
-### API Credentials
+## API Credentials
 
 #### Generate Mealie API Token
 
-1. Head to `<YOUR MEALIE INSTANCE>/user/profile/api-tokens`
-
-    !!! tip
-        If you dont see this screen make sure that "Show advanced features" is checked under `<YOUR MEALIE INSTANCE>/user/profile/edit`
-
-2. Under token name, enter the name of the token (for example, 'n8n') and hit 'Generate'
-
+1. Head to https://mealie.example.com/user/profile/api-tokens
+   > If you dont see this screen make sure that "Show advanced features" is checked under https://mealie.example.com/user/profile/edit
+2. Under token name, enter the name of the token i.e. 'n8n' and hit Generate
 3. Copy and keep this API Token somewhere safe, this is like your password!
 
-!!! tip
-    You can use your normal user for this, but assuming you're an admin you could also choose to create a user named n8n and generate the API key against that user.
+> You can use your normal user for this, but assuming you're an admin you could also choose to create a user named n8n and generate the API key against that user.
 
 #### Setup Credentials in n8n
 
-See also [n8n Docs](https://docs.n8n.io/credentials/add-edit-credentials/).
+> [n8n Docs](https://docs.n8n.io/credentials/add-edit-credentials/)
 
 1. Create a new "Header Auth" Credential
 
-    ![screenshot](../../assets/img/n8n/n8n-cred-app.png)
+![screenshot](../../assets/img/n8n/n8n-cred-app.png)
 
 2. In the connection screen set - Name as `Authorization` - Value as `Bearer {INSERT MEALIE API KEY}`
 
-    ![screenshot](../../assets/img/n8n/n8n-cred-connection.png)
+![screenshot](../../assets/img/n8n/n8n-cred-connection.png)
 
 3. In the workflow you created, for the "Run Backup", "Get All backups", and "Delete Oldies" nodes, update:
+   - Authentication to `Generic Credential Type`
+   - Generic Auth Type to `Header Auth`
+   - Header Auth to `Mealie API` or whatever you named your credentials
 
-    - Authentication to `Generic Credential Type`
-    - Generic Auth Type to `Header Auth`
-    - Header Auth to `Mealie API` or whatever you named your credentials
+![screenshot](../../assets/img/n8n/n8n-workflow-auth.png)
 
-    ![screenshot](../../assets/img/n8n/n8n-workflow-auth.png)
+## Notification Node
 
-### Notification Node
-
-!!! warning "Important"
-    Please use error notifications of some kind. It's very easy to set and forget an automation, then have the worst happen and lose data.
+> Please use error notifications of some kind. It's very easy to set and forget an automation, then have the worst happen and lose data.
 
 [ntfy](https://github.com/binwiederhier/ntfy) is a great open source, self-hostable tool for sending notifications.
 

docs/docs/documentation/community-guide/swag.md

@@ -1,10 +1,11 @@
 # Using SWAG as Reverse Proxy
 
 !!! info
-    This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
+	This guide was submitted by a community member. Find something wrong? Submit a PR to get it fixed!
 
-To make the setup of a Reverse Proxy much easier, Linuxserver.io developed [SWAG](https://github.com/linuxserver/docker-swag).
 
+
+To make the setup of a Reverse Proxy much easier, Linuxserver.io developed [SWAG](https://github.com/linuxserver/docker-swag)
 SWAG - Secure Web Application Gateway (formerly known as letsencrypt, no relation to Let's Encrypt™) sets up an Nginx web server and reverse proxy with PHP support and a built-in certbot client that automates free SSL server certificate generation and renewal processes (Let's Encrypt and ZeroSSL). It also contains fail2ban for intrusion prevention.
 
 ## Step 1: Get a domain

docs/docs/documentation/getting-started/api-usage.md

@@ -16,7 +16,7 @@ Recipes extras are a key feature of the Mealie API. They allow you to create cus
 For example you could add `{"message": "Remember to thaw the chicken"}` to a recipe and use the webhooks built into mealie to send that message payload to a destination to be processed.
 
 #### Shopping List and Food Extras
-Similarly to recipes, extras are supported on shopping lists, shopping list items, and foods. At this time they are only accessible through the API. Extras for these objects allow for rich integrations between the Mealie shopping list and your favorite list manager, such as Todoist, Trello, or any other list manager with an API.
+Similarly to recipes, extras are supported on shopping lists, shopping list items, and foods. At this time they are only accessible through the API. Extras for these objects allow for rich integrations between the Mealie shopping list and your favorite list manager, such as Alexa, ToDoist, Trello, or any other list manager with an API.
 
 To keep shopping lists in sync, for instance, you can store your Trello list id on your Mealie shopping list: <br />
 `{"trello_list_id": "5abbe4b7ddc1b351ef961414"}`
@@ -52,7 +52,6 @@ Many applications will keep track of the query and adjust the page parameter app
 Notice that the route does not contain the baseurl (e.g. `https://mymealieapplication.com/api`).
 
 There are a few shorthands available to reduce the number of calls for certain common requests:
-
 - if you want to return _all_ results, effectively disabling pagination, set `perPage = -1` (and fetch the first page)
 - if you want to fetch the _last_ page, set `page = -1`
 
@@ -79,8 +78,8 @@ This filter will find all foods that are not named "carrot": <br>
 ##### Keyword Filters
 The API supports many SQL keywords, such as `IS NULL` and `IN`, as well as their negations (e.g. `IS NOT NULL` and `NOT IN`).
 
-Here is an example of a filter that returns all shopping list items without a food: <br>
-`foodId IS NULL`
+Here is an example of a filter that returns all recipes where the "last made" value is not null: <br>
+`lastMade IS NOT NULL`
 
 This filter will find all recipes that don't start with the word "Test": <br>
 `name NOT LIKE "Test%"`
@@ -90,28 +89,6 @@ This filter will find all recipes that don't start with the word "Test": <br>
 This filter will find all recipes that have particular slugs: <br>
 `slug IN ["pasta-fagioli", "delicious-ramen"]`
 
-##### Placeholder Keywords
-You can use placeholders to insert dynamic values as opposed to static values. Currently the only supported placeholder keyword is `$NOW`, to insert the current date/time.
-
-`$NOW` can optionally be paired with basic offsets. Here is an example of a filter which gives you recipes not made within the past 30 days: <br>
-`lastMade <= "$NOW-30d"`
-
-Supported offset operations include:
-
-- `-` for subtracting a time (i.e. in the past)
-- `+` for adding a time (i.e. in the future)
-
-Supported offset intervals include:
-
-- `y` for years
-- `m` for months
-- `d` for days
-- `H` for hours
-- `M` for minutes
-- `S` for seconds
-
-Note that intervals are _case sensitive_ (e.g. `s` is an invalid interval).
-
 ##### Nested Property filters
 When querying tables with relationships, you can filter properties on related tables. For instance, if you want to query all recipes owned by a particular user: <br>
 `user.username = "SousChef20220320"`
@@ -119,7 +96,7 @@ When querying tables with relationships, you can filter properties on related ta
 This timeline event filter will return all timeline events for recipes that were created after a particular date: <br>
 `recipe.createdAt >= "2023-02-25"`
 
-This recipe filter will return all recipes that contain a particular set of tags: <br>
+This recipe filter will return all recipes that contains a particular set of tags: <br>
 `tags.name CONTAINS ALL ["Easy", "Cajun"]`
 
 ##### Compound Filters

docs/docs/documentation/getting-started/authentication/oidc-v2.md

@@ -9,7 +9,7 @@
 
 Mealie supports 3rd party authentication via [OpenID Connect (OIDC)](https://openid.net/connect/), an identity layer built on top of OAuth2. OIDC is supported by many Identity Providers (IdP), including:
 
-- [Authentik](https://integrations.goauthentik.io/documentation/mealie/)
+- [Authentik](https://goauthentik.io/integrations/sources/oauth/#openid-connect)
 - [Authelia](https://www.authelia.com/integration/openid-connect/mealie/)
 - [Keycloak](https://www.keycloak.org/docs/latest/securing_apps/#_oidc)
 - [Okta](https://www.okta.com/openid-connect/)
@@ -68,6 +68,7 @@ Example configurations for several Identity Providers have been provided by the
 
 If you don't see your provider and have successfully set it up, please consider [creating your own example](https://github.com/mealie-recipes/mealie/discussions/new?category=oauth-provider-example) so that others can have a smoother setup.
 
+
 ## Migration from Mealie v1.x
 
 **High level changes**

docs/docs/documentation/getting-started/faq.md

@@ -72,7 +72,7 @@
     Mealie allows you to link ingredients to specific steps in a recipe, ensuring you know exactly when to add each ingredient during the cooking process.
 
     **Link Ingredients to Steps in a Recipe**
-
+    
     1. Go to a recipe
     2. Click the Edit button/icon
     3. Scroll down to the step you want to link ingredients to
@@ -82,7 +82,7 @@
     7. Click 'Save' on the Recipe
 
     You can optionally link the same ingredient to multiple steps, which is useful for prepping an ingredient in one step and using it in another.
-
+    
 ??? question "What is fuzzy search and how do I use it?"
 
     ### What is fuzzy search and how do I use it?
@@ -111,7 +111,7 @@
 
     You can change the theme by settings the environment variables.
 
-    - [Backend Config - Theming](./installation/backend-config.md#theming)
+    - [Backend Config - Themeing](./installation/backend-config.md#themeing)
 
 
 ??? question "How can I change the login session timeout?"
@@ -233,7 +233,7 @@
 
     ### How can I use Mealie externally
 
-    Exposing Mealie or any service to the internet can pose significant security risks. Before proceeding, carefully evaluate the potential impacts on your system. Due to the unique nature of each network, we cannot provide specific steps for your setup.
+    Exposing Mealie or any service to the internet can pose significant security risks. Before proceeding, carefully evaluate the potential impacts on your system. Due to the unique nature of each network, we cannot provide specific steps for your setup. 
 
     There is a community guide available for one way to potentially set this up, and you could reach out on Discord for further discussion on what may be best for your network.
 
@@ -267,7 +267,7 @@
 
     ### Why setup Email?
 
-    Mealie uses email to send account invites and password resets. If you don't use these features, you don't need to set up email. There are also other methods to perform these actions that do not require the setup of Email.
+    Mealie uses email to send account invites and password resets. If you don't use these features, you don't need to set up email. There are also other methods to perform these actions that do not require the setup of Email. 
 
     Email settings can be adjusted via environment variables on the backend container:
 

docs/docs/documentation/getting-started/features.md

@@ -5,11 +5,9 @@
 ## Recipes
 
 ### Creating Recipes
-Mealie offers several ways to create recipes:
-- **Recipe Scraper:** Create recipes from hundreds of websites by simply providing a URL.
-- **Image Import:** Upload an image of a written or typed recipe and Mealie will use OCR to import it.
-- **Video URL Import:** Provide a video URL (e.g., YouTube) and Mealie will transcribe the audio and parse the recipe.
-- **Manual Editor:** Create recipes from scratch using the integrated editor.
+
+Mealie offers two main ways to create recipes. You can use the integrated recipe-scraper to create recipes from hundreds of websites, or you can create recipes manually using the recipe editor.
+
 [Creation Demo](https://demo.mealie.io/g/home/r/create/url){ .md-button .md-button--primary .align-right }
 
 ### Importing Recipes
@@ -24,7 +22,6 @@ Mealie supports importing recipes from a few other sources besides websites. Cur
 - Recipe Keeper
 - Copy Me That
 - My Recipe Box
-- DVO Cook'n X3
 
 You can access these options on your installation at the `/group/migrations` page on your installation. If you'd like to see another source added, feel free to request so on Github.
 
@@ -87,13 +84,12 @@ The meal planner has the concept of plan rules. These offer a flexible way to us
 
 The shopping lists feature is a great way to keep track of what you need to buy for your next meal. You can add items directly to the shopping list or link a recipe and all of it's ingredients to track meals during the week.
 
-Managing shopping lists can be done from the Sidebar > Shopping Lists.
+Managing shopping lists can be done from the Sidebar > Shopping Lists. 
 
 Here you will be able to:
-
 - See items already on the Shopping List
 - See linked recipes with ingredients
-    - Toggling via the 'Pot' icon will show you the linked recipe, allowing you to click to access it.
+    - Toggling via the 'Pot' icon will show you the linked recipe, allowing you to click to access it. 
 - Check off an item
 - Add / Change / Remove / Sort Items via the grid icon
     - Be sure if you are modifying an ingredient to click the 'Save' icon.
@@ -105,10 +101,13 @@ Here you will be able to:
 
 !!! tip
     You can use Labels to categorize your ingredients. You may want to Label by Food Type (Frozen, Fresh, etc), by Store, Tool, Recipe, or more. Play around with this to see what works best for you.
+    
+!!! tip
+    You can toggle 'Food' on items so that if you add multiple of the same food / ingredient, Mealie will automatically combine them together. Do this by editing an item in the Shopping List and clicking the 'Apple' icon. If you then have recipes that contain "1 | cup | cheese" and "2 | cup | cheese" this would be combined to show "3 cups of cheese."
 
 [See FAQ for more information](../getting-started/faq.md)
 
-
+    
 [Shopping List Demo](https://demo.mealie.io/shopping-lists){ .md-button .md-button--primary }
 
 ## Integrations
@@ -118,7 +117,6 @@ Mealie is designed to integrate with many different external services. There are
 ### Notifiers
 
 Notifiers are event-driven notifications sent when specific actions are performed within Mealie. Some actions include:
-
 - Creating / Updating a recipe
 - Adding items to a shopping list
 - Creating a new mealplan
@@ -197,10 +195,9 @@ Mealie lets you fully customize how you organize your users. You can use Groups
 
 ### Groups
 
-Groups are fully isolated instances of Mealie. Think of a group as a completely separate, fully self-contained site. There is no data shared between groups. Each group has its own users, recipes, tags, categories, etc. A user logged-in to one group cannot make any changes to another.
+Groups are fully isolated instances of Mealie. Think of a goup as a completely separate, fully self-contained site. There is no data shared between groups. Each group has its own users, recipes, tags, categories, etc. A user logged-in to one group cannot make any changes to another.
 
 Common use cases for groups include:
-
 - Hosting multiple instances of Mealie for others who want to keep their data private and secure
 - Creating completely isolated recipe pools
 
@@ -209,7 +206,6 @@ Common use cases for groups include:
 Households are subdivisions within a single Group. Households maintain their own users and settings, while sharing their recipes with other households. Households also share organizers (tags, categories, etc.) with the entire group. Meal Plans, Shopping Lists, and Integrations are only accessible within a household.
 
 Common use cases for households include:
-
 - Sharing a common recipe pool amongst families
 - Maintaining separate meal plans and shopping lists from other households
 - Maintaining separate integrations and customizations from other households

docs/docs/documentation/getting-started/installation/backend-config.md

@@ -4,22 +4,22 @@
 
 ### General
 
-| Variables                     |        Default        | Description                                                                                                                                             |
-| ----------------------------- | :-------------------: | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| PUID                          |          911          | UserID permissions between host OS and container                                                                                                        |
-| PGID                          |          911          | GroupID permissions between host OS and container                                                                                                       |
-| DEFAULT_GROUP                 |         Home          | The default group for users                                                                                                                             |
-| DEFAULT_HOUSEHOLD             |        Family         | The default household for users in each group                                                                                                           |
-| BASE_URL                      | http://localhost:8080 | Used for Notifications                                                                                                                                  |
-| TOKEN_TIME                    |          48           | The time in hours that a login/auth token is valid. Must be <= 9600 (400 days, in hours).                                                               |
-| API_PORT                      |         9000          | The port exposed by backend API. **Do not change this if you're running in Docker**                                                                     |
-| API_DOCS                      |         True          | Turns on/off access to the API documentation locally                                                                                                    |
-| TZ                            |          UTC          | Must be set to get correct date/time on the server                                                                                                      |
-| ALLOW_SIGNUP<super>\*</super> |         false         | Allow user sign-up without token                                                                                                                        |
-| ALLOW_PASSWORD_LOGIN          |         true          | Whether or not to display the username+password input fields. Keep set to true unless you use OIDC authentication                                       |
-| LOG_CONFIG_OVERRIDE           |                       | Override the config for logging with a custom path                                                                                                      |
-| LOG_LEVEL                     |         info          | Logging level (e.g. critical, error, warning, info, debug)                                                                                              |
-| DAILY_SCHEDULE_TIME           |         23:45         | The time of day to run daily server tasks, in HH:MM format. Use the server's local time, *not* UTC                                                      |
+| Variables                     |        Default        | Description                                                                                        |
+| ----------------------------- | :-------------------: | -------------------------------------------------------------------------------------------------- |
+| PUID                          |          911          | UserID permissions between host OS and container                                                   |
+| PGID                          |          911          | GroupID permissions between host OS and container                                                  |
+| DEFAULT_GROUP                 |         Home          | The default group for users                                                                        |
+| DEFAULT_HOUSEHOLD             |        Family         | The default household for users in each group                                                      |
+| BASE_URL                      | http://localhost:8080 | Used for Notifications                                                                             |
+| TOKEN_TIME                    |          48           | The time in hours that a login/auth token is valid                                                 |
+| API_PORT                      |         9000          | The port exposed by backend API. **Do not change this if you're running in Docker**                |
+| API_DOCS                      |         True          | Turns on/off access to the API documentation locally                                               |
+| TZ                            |          UTC          | Must be set to get correct date/time on the server                                                 |
+| ALLOW_SIGNUP<super>\*</super> |         false         | Allow user sign-up without token                                                                   |
+| ALLOW_PASSWORD_LOGIN          |         true          | Whether or not to display the username+password input fields. Keep set to true unless you use OIDC authentication |
+| LOG_CONFIG_OVERRIDE           |                       | Override the config for logging with a custom path                                                 |
+| LOG_LEVEL                     |         info          | Logging level (e.g. critical, error, warning, info, debug)                                         |
+| DAILY_SCHEDULE_TIME           |         23:45         | The time of day to run daily server tasks, in HH:MM format. Use the server's local time, *not* UTC |
 
 <super>\*</super> Starting in v1.4.0 this was changed to default to `false` as part of a security review of the application.
 
@@ -32,16 +32,15 @@
 
 ### Database
 
- | Variables                                               | Default  | Description                                                                                                                                                                                                                      |
- |---------------------------------------------------------|:--------:|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
- | DB_ENGINE                                               |  sqlite  | Optional: 'sqlite', 'postgres'                                                                                                                                                                                                   |
- | SQLITE_MIGRATE_JOURNAL_WAL                              |  False   | If set to true, switches SQLite's journal mode to WAL, which allows for multiple concurrent accesses. This can be useful when you have a decent amount of concurrency or when using certain remote storage systems such as Ceph. |
- | POSTGRES_USER<super>[&dagger;][secrets]</super>         |  mealie  | Postgres database user                                                                                                                                                                                                           |
- | POSTGRES_PASSWORD<super>[&dagger;][secrets]</super>     |  mealie  | Postgres database password                                                                                                                                                                                                       |
- | POSTGRES_SERVER<super>[&dagger;][secrets]</super>       | postgres | Postgres database server address                                                                                                                                                                                                 |
- | POSTGRES_PORT<super>[&dagger;][secrets]</super>         |   5432   | Postgres database port                                                                                                                                                                                                           |
- | POSTGRES_DB<super>[&dagger;][secrets]</super>           |  mealie  | Postgres database name                                                                                                                                                                                                           |
- | POSTGRES_URL_OVERRIDE<super>[&dagger;][secrets]</super> |   None   | Optional Postgres URL override to use instead of POSTGRES\_\* variables                                                                                                                                                          |
+ | Variables                                               | Default  | Description                                                             |
+ | ------------------------------------------------------- | :------: | ----------------------------------------------------------------------- |
+ | DB_ENGINE                                               |  sqlite  | Optional: 'sqlite', 'postgres'                                          |
+ | POSTGRES_USER<super>[&dagger;][secrets]</super>         |  mealie  | Postgres database user                                                  |
+ | POSTGRES_PASSWORD<super>[&dagger;][secrets]</super>     |  mealie  | Postgres database password                                              |
+ | POSTGRES_SERVER<super>[&dagger;][secrets]</super>       | postgres | Postgres database server address                                        |
+ | POSTGRES_PORT<super>[&dagger;][secrets]</super>         |   5432   | Postgres database port                                                  |
+ | POSTGRES_DB<super>[&dagger;][secrets]</super>           |  mealie  | Postgres database name                                                  |
+ | POSTGRES_URL_OVERRIDE<super>[&dagger;][secrets]</super> |   None   | Optional Postgres URL override to use instead of POSTGRES\_\* variables |
 
 ### Email
 
@@ -122,125 +121,38 @@ For usage, see [Usage - OpenID Connect](../authentication/oidc-v2.md)
 Mealie supports various integrations using OpenAI. For more information, check out our [OpenAI documentation](./open-ai.md).
 For custom mapping variables (e.g. OPENAI_CUSTOM_HEADERS) you should pass values as JSON encoded strings (e.g. `OPENAI_CUSTOM_PARAMS='{"k1": "v1", "k2": "v2"}'`)
 
-| Variables                                                               | Default     | Description                                                                                                                                                                                                                                                                                                            |
-|-------------------------------------------------------------------------|:-----------:|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| OPENAI_BASE_URL<super>[&dagger;][secrets]</super>                       |    None     | The base URL for the OpenAI API. If you're not sure, leave this empty to use the standard OpenAI platform                                                                                                                                                                                                              |
-| OPENAI_API_KEY<super>[&dagger;][secrets]</super>                        |    None     | Your OpenAI API Key. Enables OpenAI-related features                                                                                                                                                                                                                                                                   |
-| OPENAI_MODEL                                                            |   gpt-4o    | Which OpenAI model to use. If you're not sure, leave this empty                                                                                                                                                                                                                                                        |
-| OPENAI_AUDIO_MODEL <br/> :octicons-tag-24: v3.13.0                      |  whisper-1  | Which OpenAI model to use for audio transcriptions, if enabled. If you're not sure, leave this empty                                                                                                                                                                                                                   |
-| OPENAI_CUSTOM_HEADERS <br/> :octicons-tag-24: v2.0.0                    |    None     | Custom HTTP headers to add to all OpenAI requests. This should generally be left empty unless your custom service requires them                                                                                                                                                                                        |
-| OPENAI_CUSTOM_PARAMS <br/> :octicons-tag-24: v2.0.0                     |    None     | Custom HTTP query params to add to all OpenAI requests. This should generally be left empty unless your custom service requires them                                                                                                                                                                                   |
-| OPENAI_ENABLE_IMAGE_SERVICES <br/> :octicons-tag-24: v1.12.0            |    True     | Whether to enable OpenAI image services, such as creating recipes via image. Leave this enabled unless your custom model doesn't support it, or you want to reduce costs                                                                                                                                               |
-| OPENAI_ENABLE_TRANSCRIPTION_SERVICES <br/> :octicons-tag-24: v3.13.0    |    True     | Whether to enable OpenAI transcription services, such as creating recipes via video URL. Leave this enabled unless your custom model doesn't support it, or you want to reduce costs                                                                                                                                   |
-| OPENAI_WORKERS                                                          |      2      | Number of OpenAI workers per request. Higher values may increase processing speed, but will incur additional API costs                                                                                                                                                                                                 |
-| OPENAI_SEND_DATABASE_DATA                                               |    True     | Whether to send Mealie data to OpenAI to improve request accuracy. This will incur additional API costs                                                                                                                                                                                                                |
-| OPENAI_REQUEST_TIMEOUT                                                  |     300     | The number of seconds to wait for an OpenAI request to complete before cancelling the request. Leave this empty unless you're running into timeout issues on slower hardware                                                                                                                                           |
-| OPENAI_CUSTOM_PROMPT_DIR <br/> :octicons-tag-24: v3.10.0                |    None.    | Path to custom prompt files. Only existing files in your custom directory will override the defaults; any missing or empty custom files will automatically fall back to the system defaults. See https://github.com/mealie-recipes/mealie/tree/mealie-next/mealie/services/openai/prompts for expected file names.     |
+| Variables                                         | Default | Description                                                                                                                                                                  |
+| ------------------------------------------------- | :-----: | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| OPENAI_BASE_URL<super>[&dagger;][secrets]</super> |  None   | The base URL for the OpenAI API. If you're not sure, leave this empty to use the standard OpenAI platform                                                                    |
+| OPENAI_API_KEY<super>[&dagger;][secrets]</super>  |  None   | Your OpenAI API Key. Enables OpenAI-related features                                                                                                                         |
+| OPENAI_MODEL                                      | gpt-4o  | Which OpenAI model to use. If you're not sure, leave this empty                                                                                                              |
+| OPENAI_CUSTOM_HEADERS                             |  None   | Custom HTTP headers to add to all OpenAI requests. This should generally be left empty unless your custom service requires them                                              |
+| OPENAI_CUSTOM_PARAMS                              |  None   | Custom HTTP query params to add to all OpenAI requests. This should generally be left empty unless your custom service requires them                                         |
+| OPENAI_ENABLE_IMAGE_SERVICES                      |  True   | Whether to enable OpenAI image services, such as creating recipes via image. Leave this enabled unless your custom model doesn't support it, or you want to reduce costs     |
+| OPENAI_WORKERS                                    |    2    | Number of OpenAI workers per request. Higher values may increase processing speed, but will incur additional API costs                                                       |
+| OPENAI_SEND_DATABASE_DATA                         |  True   | Whether to send Mealie data to OpenAI to improve request accuracy. This will incur additional API costs                                                                      |
+| OPENAI_REQUEST_TIMEOUT                            |   60    | The number of seconds to wait for an OpenAI request to complete before cancelling the request. Leave this empty unless you're running into timeout issues on slower hardware |
 
 ### Theming
 
 Setting the following environmental variables will change the theme of the frontend. Note that the themes are the same for all users. This is a break-change when migration from v0.x.x -> 1.x.x.
 
-!!! info
-    If you're setting these variables but not seeing these changes persist, try removing the `#` character. Also, depending on which syntax you're using, double-check you're using quotes correctly.
-
-    If using YAML mapping syntax, be sure to include quotes around these values, otherwise they will be treated as comments in your YAML file:<br>`THEME_LIGHT_PRIMARY: '#E58325'` or  `THEME_LIGHT_PRIMARY: 'E58325'`
-
-    If using YAML sequence syntax, don't include any quotes:<br>`THEME_LIGHT_PRIMARY=#E58325` or `THEME_LIGHT_PRIMARY=E58325`
-
-| Variables             | Default | Description                        |
-| --------------------- | :-----: | ---------------------------------- |
-| THEME_LIGHT_PRIMARY   | #E58325 | Main brand color and headers       |
-| THEME_LIGHT_ACCENT    | #007A99 | Buttons and interactive elements   |
-| THEME_LIGHT_SECONDARY | #973542 | Navigation and sidebar backgrounds |
-| THEME_LIGHT_SUCCESS   | #43A047 | Success messages and confirmations |
-| THEME_LIGHT_INFO      | #1976D2 | Information alerts and tooltips    |
-| THEME_LIGHT_WARNING   | #FF6D00 | Warning notifications              |
-| THEME_LIGHT_ERROR     | #EF5350 | Error messages and alerts          |
-| THEME_DARK_PRIMARY    | #E58325 | Main brand color and headers       |
-| THEME_DARK_ACCENT     | #007A99 | Buttons and interactive elements   |
-| THEME_DARK_SECONDARY  | #973542 | Navigation and sidebar backgrounds |
-| THEME_DARK_SUCCESS    | #43A047 | Success messages and confirmations |
-| THEME_DARK_INFO       | #1976D2 | Information alerts and tooltips    |
-| THEME_DARK_WARNING    | #FF6D00 | Warning notifications              |
-| THEME_DARK_ERROR      | #EF5350 | Error messages and alerts          |
-
-#### Theming Examples
-
-The examples below provide copy-ready Docker Compose environment configurations for three different color palettes. Copy and paste the desired theme into your `docker-compose.yml` file's environment section.
-
-!!! info
-    These themes are functional and ready to use, but they are provided primarily as examples. The color palettes can be adjusted or refined to better suit your preferences.
-
-=== "Blue Theme"
-
-    ```yaml
-    environment:
-      # Light mode colors
-      THEME_LIGHT_PRIMARY: '#5E9BD1'
-      THEME_LIGHT_ACCENT: '#A3C9E8'
-      THEME_LIGHT_SECONDARY: '#4F89BA'
-      THEME_LIGHT_SUCCESS: '#4CAF50'
-      THEME_LIGHT_INFO: '#4A9ED8'
-      THEME_LIGHT_WARNING: '#EAC46B'
-      THEME_LIGHT_ERROR: '#E57373'
-      # Dark mode colors
-      THEME_DARK_PRIMARY: '#5A8FBF'
-      THEME_DARK_ACCENT: '#90B8D9'
-      THEME_DARK_SECONDARY: '#406D96'
-      THEME_DARK_SUCCESS: '#81C784'
-      THEME_DARK_INFO: '#78B2C0'
-      THEME_DARK_WARNING: '#EBC86E'
-      THEME_DARK_ERROR: '#E57373'
-    ```
-
-=== "Green Theme"
-
-    ```yaml
-    environment:
-      # Light mode colors
-      THEME_LIGHT_PRIMARY: '#75A86C'
-      THEME_LIGHT_ACCENT: '#A8D0A6'
-      THEME_LIGHT_SECONDARY: '#638E5E'
-      THEME_LIGHT_SUCCESS: '#4CAF50'
-      THEME_LIGHT_INFO: '#4A9ED8'
-      THEME_LIGHT_WARNING: '#EAC46B'
-      THEME_LIGHT_ERROR: '#E57373'
-      # Dark mode colors
-      THEME_DARK_PRIMARY: '#739B7A'
-      THEME_DARK_ACCENT: '#9FBE9D'
-      THEME_DARK_SECONDARY: '#56775E'
-      THEME_DARK_SUCCESS: '#81C784'
-      THEME_DARK_INFO: '#78B2C0'
-      THEME_DARK_WARNING: '#EBC86E'
-      THEME_DARK_ERROR: '#E57373'
-    ```
-
-=== "Pink Theme"
-
-    ```yaml
-    environment:
-      # Light mode colors
-      THEME_LIGHT_PRIMARY: '#D97C96'
-      THEME_LIGHT_ACCENT: '#E891A7'
-      THEME_LIGHT_SECONDARY: '#C86C88'
-      THEME_LIGHT_SUCCESS: '#4CAF50'
-      THEME_LIGHT_INFO: '#2196F3'
-      THEME_LIGHT_WARNING: '#FFC107'
-      THEME_LIGHT_ERROR: '#E57373'
-      # Dark mode colors
-      THEME_DARK_PRIMARY: '#C2185B'
-      THEME_DARK_ACCENT: '#FF80AB'
-      THEME_DARK_SECONDARY: '#AD1457'
-      THEME_DARK_SUCCESS: '#81C784'
-      THEME_DARK_INFO: '#64B5F6'
-      THEME_DARK_WARNING: '#FFD54F'
-      THEME_DARK_ERROR: '#E57373'
-    ```
-
-!!! info
-    Browser cookies may cause the client to keep outdated settings.
-    Clearing the cookies can be required for the change to take effect.
+| Variables             | Default | Description                 |
+| --------------------- | :-----: | --------------------------- |
+| THEME_LIGHT_PRIMARY   | #E58325 | Light Theme Config Variable |
+| THEME_LIGHT_ACCENT    | #007A99 | Light Theme Config Variable |
+| THEME_LIGHT_SECONDARY | #973542 | Light Theme Config Variable |
+| THEME_LIGHT_SUCCESS   | #43A047 | Light Theme Config Variable |
+| THEME_LIGHT_INFO      | #1976D2 | Light Theme Config Variable |
+| THEME_LIGHT_WARNING   | #FF6D00 | Light Theme Config Variable |
+| THEME_LIGHT_ERROR     | #EF5350 | Light Theme Config Variable |
+| THEME_DARK_PRIMARY    | #E58325 | Dark Theme Config Variable  |
+| THEME_DARK_ACCENT     | #007A99 | Dark Theme Config Variable  |
+| THEME_DARK_SECONDARY  | #973542 | Dark Theme Config Variable  |
+| THEME_DARK_SUCCESS    | #43A047 | Dark Theme Config Variable  |
+| THEME_DARK_INFO       | #1976D2 | Dark Theme Config Variable  |
+| THEME_DARK_WARNING    | #FF6D00 | Dark Theme Config Variable  |
+| THEME_DARK_ERROR      | #EF5350 | Dark Theme Config Variable  |
 
 ### Docker Secrets
 

docs/docs/documentation/getting-started/installation/installation-checklist.md

@@ -31,7 +31,7 @@ To deploy mealie on your local network, it is highly recommended to use Docker t
 We've gone through a few versions of Mealie v1 deployment targets. We have settled on a single container deployment, and we've begun publishing the nightly container on github containers. If you're looking to move from the old nightly (split containers _or_ the omni image) to the new nightly, there are a few things you need to do:
 
 1. Take a backup just in case!
-2. Replace the image for the API container with `ghcr.io/mealie-recipes/mealie:v3.15.2`
+2. Replace the image for the API container with `ghcr.io/mealie-recipes/mealie:v3.0.1`
 3. Take the external port from the frontend container and set that as the port mapped to port `9000` on the new container. The frontend is now served on port 9000 from the new container, so it will need to be mapped for you to have access.
 4. Restart the container
 
@@ -60,7 +60,7 @@ The following steps were tested on a Ubuntu 20.04 server, but should work for mo
 
 ## Step 3: Customizing The `docker-compose.yaml` files.
 
-After you've decided how to set up your files, it's important to set a few ENV variables to ensure that you can use all the features of Mealie. Verify that:
+After you've decided setup the files it's important to set a few ENV variables to ensure that you can use all the features of Mealie. I recommend that you verify and check that:
 
 - [x] You've configured the relevant ENV variables for your database selection in the `docker-compose.yaml` files.
 - [x] You've configured the [SMTP server settings](./backend-config.md#email) (used for invitations, password resets, etc). You can setup a [google app password](https://support.google.com/accounts/answer/185833?hl=en) if you want to send email via gmail.
@@ -117,7 +117,7 @@ The latest tag provides the latest released image of Mealie.
 
 ---
 
-**These tags are no longer updated**
+**These tags no are long updated**
 
 `mealie:frontend-v1.0.0beta-x` **and** `mealie:api-v1.0.0beta-x`
 

docs/docs/documentation/getting-started/installation/open-ai.md

@@ -10,15 +10,9 @@ For most users, supplying the OpenAI API key is all you need to do; you will use
 
 Alternatively, if you have another service you'd like to use in-place of OpenAI, you can configure Mealie to use that instead, as long as it has an OpenAI-compatible API. For instance, a common self-hosted alternative to OpenAI is [Ollama](https://ollama.com/). To use Ollama with Mealie, change your `OPENAI_BASE_URL` to `http://localhost:11434/v1` (where `http://localhost:11434` is wherever you're hosting Ollama, and `/v1` enables the OpenAI-compatible endpoints). Note that you *must* provide an API key, even though it is ultimately ignored by Ollama.
 
-If you wish to disable image recognition features (to save costs, or because your custom model doesn't support them) you can set `OPENAI_ENABLE_IMAGE_SERVICES` to `False`.
-If you wish to disable transcription features (to save costs, or because your custom model doesn't support them) you can set `OPENAI_ENABLE_TRANSCRIPTION_SERVICES` to `False`.
-
-For more information on what configuration options are available, check out the [backend configuration](./backend-config.md#openai).
-
-
+If you wish to disable image recognition features (to save costs, or because your custom model doesn't support them) you can set `OPENAI_ENABLE_IMAGE_SERVICES` to `False`. For more information on what configuration options are available, check out the [backend configuration](./backend-config.md#openai).
 
 ## OpenAI Features
 - The OpenAI Ingredient Parser can be used as an alternative to the NLP and Brute Force parsers. Simply choose the OpenAI parser while parsing ingredients (:octicons-tag-24: v1.7.0)
 - When importing a recipe via URL, if the default recipe scraper is unable to read the recipe data from a webpage, the webpage contents will be parsed by OpenAI (:octicons-tag-24: v1.9.0)
 - You can import an image of a written recipe, which is sent to OpenAI and imported into Mealie. The recipe can be hand-written or typed, as long as the text is in the picture. You can also optionally have OpenAI translate the recipe into your own language (:octicons-tag-24: v1.12.0)
-- You can import a recipe via a video URL (e.g., a YouTube link). The video is transcribed using OpenAI's Whisper model, and the transcription is parsed into a recipe (:octicons-tag-24: v3.13.0)

docs/docs/documentation/getting-started/installation/postgres.md

@@ -1,8 +1,5 @@
 # Installing with PostgreSQL
 
-!!! Warning
-    When upgrading postgresql major versions, manual steps are required [Postgres#37](https://github.com/docker-library/postgres/issues/37).
-
 PostgreSQL might be considered if you need to support many concurrent users. In addition, some features are only enabled on PostgreSQL, such as fuzzy search.
 
 **For Environment Variable Configuration, see** [Backend Configuration](./backend-config.md)
@@ -10,7 +7,7 @@ PostgreSQL might be considered if you need to support many concurrent users. In
 ```yaml
 services:
   mealie:
-    image: ghcr.io/mealie-recipes/mealie:v3.15.2 # (3)
+    image: ghcr.io/mealie-recipes/mealie:v3.0.1 # (3)
     container_name: mealie
     restart: always
     ports:
@@ -41,7 +38,7 @@ services:
 
   postgres:
     container_name: postgres
-    image: postgres:17
+    image: postgres:15
     restart: always
     volumes:
       - mealie-pgdata:/var/lib/postgresql/data
@@ -49,7 +46,6 @@ services:
       POSTGRES_PASSWORD: mealie
       POSTGRES_USER: mealie
       PGUSER: mealie
-      POSTGRES_DB: mealie
     healthcheck:
       test: ["CMD", "pg_isready"]
       interval: 30s

docs/docs/documentation/getting-started/installation/sqlite.md

@@ -11,7 +11,7 @@ SQLite is a popular, open source, self-contained, zero-configuration database th
 ```yaml
 services:
   mealie:
-    image: ghcr.io/mealie-recipes/mealie:v3.15.2 # (3)
+    image: ghcr.io/mealie-recipes/mealie:v3.0.1 # (3)
     container_name: mealie
     restart: always
     ports:

docs/docs/documentation/getting-started/introduction.md

@@ -28,7 +28,6 @@ Mealie is a self hosted recipe manager and meal planner with a RestAPI backend a
     - Copy Me That
     - Paprika
     - Tandoor Recipes
-    - DVO Cook'n X3
   - Random Meal Plan generation
     - Advanced rule configuration to fine tune random recipes
 

docs/docs/documentation/getting-started/roadmap.md

@@ -2,3 +2,6 @@
 
 ## Feature Requests
 [Please request new features on Github](https://github.com/mealie-recipes/mealie/discussions/new?category=feature-request)
+
+## Progress
+See the [Github Projects page](https://github.com/users/hay-kot/projects/2) to see what is currently being worked on

docs/docs/documentation/getting-started/updating.md

@@ -4,28 +4,11 @@
     You MUST read the release notes prior to upgrading your container. Mealie has a robust backup and restore system for managing your data. Pre-v1.0.0 versions of Mealie use a different database structure, so if you are upgrading from pre-v1.0.0 to v1.0.0, you MUST backup your data and then re-import it. Even if you are already on v1.0.0, it is strongly recommended to backup all data before updating.
 
     ### Before Upgrading
-     - [Read The Release Notes](https://github.com/mealie-recipes/mealie/releases)
+     - Read The Release Notes
      - Identify Breaking Changes
      - Create a Backup and Download from the UI
      - Upgrade
 
-!!! info "Improved Image Processing"
-    Starting with :octicons-tag-24: v3.7.0, we updated our image processing algorithm to improve image quality and compression. New image processing can be up to 40%-50% smaller on disk while providing higher resolution thumbnails. To take advantage of these improvements on older recipes, you can run our image-processing script:
-
-    ```shell
-    docker exec -it mealie bash
-    python /opt/mealie/lib64/python3.12/site-packages/mealie/scripts/reprocess_images.py
-    ```
-
-    ### Options
-     - `--workers N`: Number of worker threads (default: 2, safe for low-powered devices)
-     - `--force-all`: Reprocess all recipes regardless of current image state
-
-    ### Example
-    ```shell
-    python /opt/mealie/lib64/python3.12/site-packages/mealie/scripts/reprocess_images.py --workers 8
-    ```
-
 ## Upgrading to Mealie v1 or later
 If you are upgrading from pre-v1.0.0 to v1.0.0 or later (v2.0.0, etc.), make sure you read [Migrating to Mealie v1](./migrating-to-mealie-v1.md)!
 

docs/docs/documentation/getting-started/usage/backups-and-restoring.md

@@ -1,10 +1,10 @@
 # Backups and Restores
 
-Mealie provides an integrated mechanic for doing full installation backups of the database.
+Mealie provides an integrated mechanic for doing full installation backups of the database. 
 
-Navigate to Settings > Admin Settings > Backups or manually by adding `/admin/backups` to your instance URL.
+Navigate to Settings > Backups or manually by adding `/admin/backups` to your instance URL.
 
-From this page, you will be able to:
+From this page, you will be able to: 
 
 - See a list of available backups
 - Create a backup
@@ -39,7 +39,7 @@ Restoring the Database when using Postgres requires Mealie to be configured with
 ```sql
 ALTER USER mealie WITH SUPERUSER;
 
--- Run restore from Mealie
+# Run restore from Mealie
 
 ALTER USER mealie WITH NOSUPERUSER;
 ```

docs/docs/documentation/getting-started/usage/permissions-and-public-access.md

@@ -1,7 +1,6 @@
 # Permissions and Public Access
 
 Mealie provides various levels of user access and permissions. This includes:
-
 - Authentication and registration ([LDAP](../authentication/ldap.md) and [OpenID Connect](../authentication/oidc.md) are both supported)
 - Customizable user permissions
 - Fine-tuned public access for non-users
@@ -9,12 +8,12 @@ Mealie provides various levels of user access and permissions. This includes:
 ## Customizable User Permissions
 
 Each user can be configured to have varying levels of access. Some of these permissions include:
-
 - Access to Administrator tools
 - Access to inviting other users
 - Access to manage their group and group data
 
-Administrators can configure these settings on the User Management page (navigate to Settings > Admin Settings > Users or append `/admin/manage/users` to your instance URL).
+Administrators can navigate to the Settings page and access the User Management page to configure these settings.
+
 
 [User Management Demo](https://demo.mealie.io/admin/manage/users){ .md-button .md-button--primary }
 
@@ -23,8 +22,8 @@ Administrators can configure these settings on the User Management page (navigat
 By default, groups and households are set to private, meaning only logged-in users may access the group/household. In order for a recipe to be viewable by public (not logged-in) users, three criteria must be met:
 
 1. The group must not be private
-2. The household must not be private, _and_ the household setting for allowing users outside of your group to see your recipes must be enabled. These can be toggled on the Household Management page (navigate to Settings > Admin Settings > Households or append `/admin/manage/households` to your instance URL)
-3. The recipe must be set to public. This can be toggled for each recipe individually, or in bulk using the Recipe Data Management page
+2. The household must not be private, *and* the household setting for allowing users outside of your group to see your recipes must be enabled. These can be toggled on the Household Settings page
+2. The recipe must be set to public. This can be toggled for each recipe individually, or in bulk using the Recipe Data Management page
 
 Additionally, if the group is not private, public users can view all public group data (public recipes, public cookbooks, etc.) from the home page ([e.g. the demo home page](https://demo.mealie.io/g/home)).
 

docs/docs/overrides/home.html

@@ -351,24 +351,24 @@
 <!-- Custom narrow footer -->
 <div class="md-footer-meta__inner md-grid">
   <div class="md-footer-social">
-    <a class="md-footer-social__link" href="https://github.com/mealie-recipes/mealie" rel="noopener" target="_blank"
+    <a class="md-footer-social__link" href="https://github.com/hay-kot/mealie" rel="noopener" target="_blank"
       title="github.com">
       <svg style="width: 32px; height: 32px" viewBox="0 0 480 512" xmlns="http://www.w3.org/2000/svg">
         <path
-          d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6.0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6.0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3.0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1.0-6.2-.3-40.4-.3-61.4.0.0-70 15-84.7-29.8.0.0-11.4-29.1-27.8-36.6.0.0-22.9-15.7 1.6-15.4.0.0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5.0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9.0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4.0 33.7-.3 75.4-.3 83.6.0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6.0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9.0-6.2-1.4-2.3-4-3.3-5.6-2z">
+          d="M186.1 328.7c0 20.9-10.9 55.1-36.7 55.1s-36.7-34.2-36.7-55.1 10.9-55.1 36.7-55.1 36.7 34.2 36.7 55.1zM480 278.2c0 31.9-3.2 65.7-17.5 95-37.9 76.6-142.1 74.8-216.7 74.8-75.8 0-186.2 2.7-225.6-74.8-14.6-29-20.2-63.1-20.2-95 0-41.9 13.9-81.5 41.5-113.6-5.2-15.8-7.7-32.4-7.7-48.8 0-21.5 4.9-32.3 14.6-51.8 45.3 0 74.3 9 108.8 36 29-6.9 58.8-10 88.7-10 27 0 54.2 2.9 80.4 9.2 34-26.7 63-35.2 107.8-35.2 9.8 19.5 14.6 30.3 14.6 51.8 0 16.4-2.6 32.7-7.7 48.2 27.5 32.4 39 72.3 39 114.2zm-64.3 50.5c0-43.9-26.7-82.6-73.5-82.6-18.9 0-37 3.4-56 6-14.9 2.3-29.8 3.2-45.1 3.2-15.2 0-30.1-.9-45.1-3.2-18.7-2.6-37-6-56-6-46.8 0-73.5 38.7-73.5 82.6 0 87.8 80.4 101.3 150.4 101.3h48.2c70.3 0 150.6-13.4 150.6-101.3zm-82.6-55.1c-25.8 0-36.7 34.2-36.7 55.1s10.9 55.1 36.7 55.1 36.7-34.2 36.7-55.1-10.9-55.1-36.7-55.1z">
         </path>
       </svg>
     </a>
-    <a class="md-footer-social__link" href="https://bsky.app/profile/haykot.dev" rel="noopener" target="_blank"
-      title="bsky.app">
-      <svg style="width: 32px; height: 32px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <a class="md-footer-social__link" href="https://twitter.com/kot_hay" rel="noopener" target="_blank"
+      title="twitter.com">
+      <svg style="width: 32px; height: 32px" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
         <path
-          d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-3.912.58-7.387 2.005-2.83 7.078 5.013 5.19 6.87-1.113 7.823-4.308.953 3.195 2.05 9.271 7.733 4.308 4.267-4.308 1.172-6.498-2.74-7.078a8.741 8.741 0 0 1-.415-.056c.14.017.279.036.415.056 2.67.297 5.568-.628 6.383-3.364.246-.828.624-5.79.624-6.478 0-.69-.139-1.861-.902-2.204-.659-.299-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8z">
+          d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z">
         </path>
       </svg>
     </a>
     <a class="md-footer-social__link" href="https://www.linkedin.com/in/hay-kot" rel="noopener" target="_blank"
-      title="linkedin.com">
+      title="www.linkedin.com">
       <svg style="width: 32px; height: 32px" viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg">
         <path
           d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z">

docs/mkdocs.yml

@@ -32,8 +32,8 @@ theme:
 
 markdown_extensions:
   - pymdownx.emoji:
-      emoji_index: !!python/name:material.extensions.emoji.twemoji
-      emoji_generator: !!python/name:material.extensions.emoji.to_svg
+      emoji_index: !!python/name:materialx.emoji.twemoji
+      emoji_generator: !!python/name:materialx.emoji.to_svg
   - def_list
   - pymdownx.highlight
   - pymdownx.superfences
@@ -86,14 +86,14 @@ nav:
 
       - Community Guides:
           - Bring API without internet exposure: "documentation/community-guide/bring-api.md"
-          - Automating Backups with n8n: "documentation/community-guide/n8n-backup-automation.md"
+          - Automate Backups with n8n: "documentation/community-guide/n8n-backup-automation.md"
           - Bulk Url Import: "documentation/community-guide/bulk-url-import.md"
           - Home Assistant: "documentation/community-guide/home-assistant.md"
           - Import Bookmarklet: "documentation/community-guide/import-recipe-bookmarklet.md"
           - iOS Shortcut: "documentation/community-guide/ios-shortcut.md"
           - Reverse Proxy (SWAG): "documentation/community-guide/swag.md"
 
-  - API Reference: "https://demo.mealie.io/docs"
+  - API Reference: "api/redoc.md"
 
   - Contributors Guide:
       - Non-Code: "contributors/non-coders.md"

frontend/app/components/Domain/Admin/Setup/EndPageContent.vue

@@ -1,116 +0,0 @@
-<template>
-  <v-container max-width="880" class="end-page-content">
-    <div class="d-flex flex-column ga-6">
-      <div>
-        <v-card-title class="text-h4 justify-center">
-          {{ $t('admin.setup.setup-complete') }}
-        </v-card-title>
-        <v-card-subtitle class="justify-center">
-          {{ $t('admin.setup.here-are-a-few-things-to-help-you-get-started') }}
-        </v-card-subtitle>
-      </div>
-      <div
-        v-for="section, idx in sections"
-        :key="idx"
-        class="d-flex flex-column ga-3"
-      >
-        <v-card-title class="text-h6 pl-0">
-          {{ section.title }}
-        </v-card-title>
-        <div class="sections d-flex flex-column ga-2">
-          <v-card
-            v-for="link, linkIdx in section.links"
-            :key="linkIdx"
-            clas="link-card"
-            :href="link.to"
-            :title="link.text"
-            :subtitle="link.description"
-            :append-icon="$globals.icons.chevronRight"
-          >
-            <template #prepend>
-              <v-avatar :icon="link.icon || undefined" variant="tonal" :color="section.color" />
-            </template>
-          </v-card>
-        </div>
-      </div>
-    </div>
-  </v-container>
-</template>
-
-<script setup lang="ts">
-const i18n = useI18n();
-const auth = useMealieAuth();
-const groupSlug = computed(() => auth.user.value?.groupSlug);
-const { $globals } = useNuxtApp();
-
-const sections = ref([
-  {
-    title: i18n.t("profile.data-migrations"),
-    color: "info",
-    links: [
-      {
-        icon: $globals.icons.backupRestore,
-        to: "/admin/backups",
-        text: i18n.t("settings.backup.backup-restore"),
-        description: i18n.t("admin.setup.restore-from-v1-backup"),
-      },
-      {
-        icon: $globals.icons.import,
-        to: "/group/migrations",
-        text: i18n.t("migration.recipe-migration"),
-        description: i18n.t("migration.coming-from-another-application-or-an-even-older-version-of-mealie"),
-      },
-    ],
-  },
-  {
-    title: i18n.t("recipe.create-recipes"),
-    color: "success",
-    links: [
-      {
-        icon: $globals.icons.createAlt,
-        to: computed(() => `/g/${groupSlug.value || ""}/r/create/new`),
-        text: i18n.t("recipe.create-recipe"),
-        description: i18n.t("recipe.create-recipe-description"),
-      },
-      {
-        icon: $globals.icons.link,
-        to: computed(() => `/g/${groupSlug.value || ""}/r/create/url`),
-        text: i18n.t("recipe.import-with-url"),
-        description: i18n.t("recipe.scrape-recipe-description"),
-      },
-    ],
-  },
-  {
-    title: i18n.t("user.manage-users"),
-    color: "primary",
-    links: [
-      {
-        icon: $globals.icons.group,
-        to: "/admin/manage/users",
-        text: i18n.t("user.manage-users"),
-        description: i18n.t("user.manage-users-description"),
-      },
-      {
-        icon: $globals.icons.user,
-        to: "/user/profile",
-        text: i18n.t("profile.manage-user-profile"),
-        description: i18n.t("admin.setup.manage-profile-or-get-invite-link"),
-      },
-    ],
-  },
-]);
-</script>
-
-<style>
-.v-container {
-  .v-card-title,
-  .v-card-subtitle {
-    padding: 0;
-    white-space: unset;
-  }
-
-  .v-card-item {
-    gap: 0.5rem;
-  }
-}
-</style>

frontend/app/components/Domain/Announcement/AnnouncementDialog.vue

@@ -1,139 +0,0 @@
-<template>
-  <BaseDialog
-    v-if="currentAnnouncement"
-    v-model="dialog"
-    :title="$t('announcements.announcements')"
-    :icon="$globals.icons.bullhornVariant"
-    :cancel-text="$t('general.done')"
-    width="100%"
-    max-width="1200"
-  >
-    <div class="d-flex" :style="{ height: useMobile ? '100%' : '60vh', minHeight: '60vh' }">
-      <!-- Nav list -->
-      <v-list
-        v-show="!useMobile || navOpen"
-        nav
-        density="compact"
-        color="primary"
-        class="overflow-y-auto border-e flex-shrink-0"
-        style="width: 200px; max-height: 60vh"
-      >
-        <v-list-item
-          v-for="announcement in allAnnouncements.toReversed()"
-          :key="announcement.key"
-          :active="currentAnnouncement.key === announcement.key"
-          rounded
-          @click="setCurrentAnnouncement(announcement); navOpen = false"
-        >
-          <v-list-item-title class="text-body-2">
-            {{ announcement.meta?.title }}
-          </v-list-item-title>
-          <v-list-item-subtitle v-if="announcement.date">
-            {{ $d(announcement.date) }}
-          </v-list-item-subtitle>
-
-          <template v-if="newAnnouncements.some(a => a.key === announcement.key)" #append>
-            <v-icon size="x-small" color="info">
-              {{ $globals.icons.alertCircle }}
-            </v-icon>
-          </template>
-        </v-list-item>
-      </v-list>
-
-      <!-- Main content -->
-      <div
-        class="flex-grow-1 overflow-y-auto"
-      >
-        <v-btn
-          v-if="useMobile"
-          :prepend-icon="navOpen ? $globals.icons.chevronLeft : $globals.icons.chevronRight"
-          density="compact"
-          variant="text"
-          class="mt-2 ms-2"
-          @click="navOpen = !navOpen"
-        >
-          {{ $t("announcements.all-announcements") }}
-        </v-btn>
-        <v-card-title>
-          <v-chip v-if="currentAnnouncement.date" label large class="me-1">
-            <v-icon class="me-1">
-              {{ $globals.icons.calendar }}
-            </v-icon>
-            {{ $d(currentAnnouncement.date) }}
-          </v-chip>
-          {{ currentAnnouncement.meta?.title }}
-        </v-card-title>
-        <v-card-text>
-          <component :is="currentAnnouncement.component" />
-        </v-card-text>
-      </div>
-    </div>
-    <template #custom-card-action>
-      <BaseButton
-        v-if="newAnnouncements.length"
-        color="success"
-        :icon="$globals.icons.textBoxCheckOutline"
-        :text="$t('announcements.mark-all-as-read')"
-        @click="markAllAsRead"
-      />
-      <BaseButton
-        :disabled="isLastAnnouncement(currentAnnouncement.key)"
-        color="info"
-        :icon="$globals.icons.arrowRightBold"
-        icon-right
-        :text="$t('general.next')"
-        @click="nextAnnouncement"
-      />
-    </template>
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-import { useAnnouncements } from "~/composables/use-announcements";
-import type { Announcement } from "~/composables/use-announcements";
-
-const dialog = defineModel<boolean>({ default: false });
-
-const display = useDisplay();
-const useMobile = computed(() => display.smAndDown.value);
-const navOpen = ref(false);
-
-const route = useRoute();
-watch(() => route.fullPath, () => { dialog.value = false; });
-
-const { newAnnouncements, allAnnouncements, setLastRead, markAllAsRead } = useAnnouncements();
-
-const currentAnnouncement = shallowRef<Announcement | undefined>();
-
-watch(dialog, () => {
-  if (!dialog.value || currentAnnouncement.value) {
-    return;
-  }
-
-  // Show first unread on open, or fall back to the newest
-  const next = newAnnouncements.value.at(0) || allAnnouncements.at(-1)!;
-  setCurrentAnnouncement(next);
-});
-
-function setCurrentAnnouncement(announcement: Announcement) {
-  currentAnnouncement.value = announcement;
-  setLastRead(announcement.key);
-}
-
-function nextAnnouncement() {
-  // Find the first unread announcement after the current one (current is already removed from newAnnouncements)
-  const next = newAnnouncements.value.find(a => a.key > currentAnnouncement.value!.key);
-  if (next) {
-    setCurrentAnnouncement(next);
-  }
-}
-
-function isLastAnnouncement(key: string) {
-  if (!newAnnouncements.value.length) {
-    return true;
-  }
-  else {
-    return key >= newAnnouncements.value.at(-1)!.key;
-  }
-}
-</script>

frontend/app/components/Domain/Announcement/Announcements/2026-03-27_1_welcome.vue

@@ -1,62 +0,0 @@
-<template>
-  <div>
-    <p>
-      Welcome to Mealie! If this is your first time seeing announcements, here's what to expect.
-    </p>
-    <div class="mb-2">
-      Announcements are reserved for things like:
-      <ul class="ml-6">
-        <li>Important new features</li>
-        <li>Major changes</li>
-        <li>Anything that might require additional user actions (such as migration scripts)</li>
-      </ul>
-    </div>
-    <p>
-      While we generally keep everything in our <a class="text-primary" href="https://github.com/mealie-recipes/mealie/releases" target="_blank">GitHub release notes</a>,
-      sometimes certain changes require some extra attention.
-    </p>
-    <p>
-      Announcements are English-only; they're one-off messages from the maintainers, not a replacement for our release notes. Some elements may still be translated.
-    </p>
-    <hr class="mt-2 mb-4">
-    <p>
-      You can opt out of announcements in your user settings:
-      <br>
-      <v-btn class="mt-2" color="primary" to="/user/profile/edit">
-        {{ $t("profile.user-settings") }}
-      </v-btn>
-    </p>
-    <p v-if="user?.canManageHousehold" class="mt-3">
-      As {{ user?.admin ? "an admin" : "a household manager" }}, you can disable announcements for your entire household:
-      <br>
-      <v-btn class="mt-2" color="primary" to="/household">
-        {{ $t("profile.household-settings") }}
-      </v-btn>
-    </p>
-    <p v-if="user?.canManage" class="mt-3">
-      {{ user?.admin ? "You can also" : "As a group manager, you can" }} disable announcements for your entire group:
-      <br>
-      <v-btn class="mt-2" color="primary" to="/group">
-        {{ $t("profile.group-settings") }}
-      </v-btn>
-    </p>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { AnnouncementMeta } from "~/composables/use-announcements";
-
-const { user } = useMealieAuth();
-</script>
-
-<script lang="ts">
-export const meta: AnnouncementMeta = {
-  title: "Welcome to Mealie 🎉",
-};
-</script>
-
-<style scoped lang="css">
-p {
-  padding-bottom: 8px;
-}
-</style>

frontend/app/components/Domain/Announcement/Announcements/announcements.test.ts

@@ -1,37 +0,0 @@
-import { describe, test, expect } from "vitest";
-
-const announcementFiles = import.meta.glob<{ default: unknown }>(
-  "~/components/Domain/Announcement/Announcements/*.vue",
-);
-
-// Expected format: YYYY-MM-DD_N_slug  e.g. 2026-03-27_1_welcome
-const FILE_FORMAT = /^\d{4}-\d{2}-\d{2}_\d+_.+$/;
-
-describe("Announcement files", () => {
-  const filenames = Object.keys(announcementFiles).map(path =>
-    path.split("/").at(-1)!.replace(".vue", ""),
-  );
-
-  test("directory is not empty", () => {
-    expect(filenames.length).toBeGreaterThan(0);
-  });
-
-  test("all filenames match YYYY-MM-DD_N_slug format", () => {
-    for (const name of filenames) {
-      expect(name, `"${name}" does not match the expected format`).toMatch(FILE_FORMAT);
-    }
-  });
-
-  test("all date prefixes are valid dates", () => {
-    for (const name of filenames) {
-      const datePart = name.split("_", 1)[0]!;
-      const date = new Date(datePart);
-      expect(isNaN(date.getTime()), `"${name}" has an invalid date prefix "${datePart}"`).toBe(false);
-    }
-  });
-
-  test("all filenames are unique", () => {
-    const unique = new Set(filenames);
-    expect(unique.size).toBe(filenames.length);
-  });
-});

frontend/app/components/Domain/Cookbook/CookbookEditor.vue

@@ -1,102 +0,0 @@
-<template>
-  <div>
-    <v-card-text
-      v-if="cookbook"
-      class="px-1"
-    >
-      <v-text-field
-        v-model="cookbook.name"
-        :label="$t('cookbook.cookbook-name')"
-        variant="underlined"
-        color="primary"
-      />
-      <v-textarea
-        v-model="cookbook.description"
-        auto-grow
-        :rows="2"
-        :label="$t('recipe.description')"
-        variant="underlined"
-        color="primary"
-      />
-      <QueryFilterBuilder
-        :field-defs="fieldDefs"
-        :initial-query-filter="cookbook.queryFilter"
-        @input="handleInput"
-      />
-      <v-switch
-        v-model="cookbook.public"
-        hide-details
-        single-line
-        color="primary"
-      >
-        <template #label>
-          {{ $t('cookbook.public-cookbook') }}
-          <HelpIcon
-            size="small"
-            right
-            class="ml-2"
-          >
-            {{ $t('cookbook.public-cookbook-description') }}
-          </HelpIcon>
-        </template>
-      </v-switch>
-    </v-card-text>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { Organizer } from "~/lib/api/types/non-generated";
-import QueryFilterBuilder from "~/components/Domain/QueryFilterBuilder.vue";
-import type { FieldDefinition } from "~/composables/use-query-filter-builder";
-import type { ReadCookBook } from "~/lib/api/types/cookbook";
-
-const modelValue = defineModel<ReadCookBook>({ required: true });
-const i18n = useI18n();
-const cookbook = toRef(modelValue);
-function handleInput(value: string | undefined) {
-  cookbook.value.queryFilterString = value || "";
-}
-
-const fieldDefs: FieldDefinition[] = [
-  {
-    name: "recipe_category.id",
-    label: i18n.t("category.categories"),
-    type: Organizer.Category,
-  },
-  {
-    name: "tags.id",
-    label: i18n.t("tag.tags"),
-    type: Organizer.Tag,
-  },
-  {
-    name: "recipe_ingredient.food.id",
-    label: i18n.t("recipe.ingredients"),
-    type: Organizer.Food,
-  },
-  {
-    name: "tools.id",
-    label: i18n.t("tool.tools"),
-    type: Organizer.Tool,
-  },
-  {
-    name: "household_id",
-    label: i18n.t("household.households"),
-    type: Organizer.Household,
-  },
-  {
-    name: "user_id",
-    label: i18n.t("user.users"),
-    type: Organizer.User,
-  },
-  {
-    name: "created_at",
-    label: i18n.t("general.date-created"),
-    type: "date",
-  },
-  {
-    name: "updated_at",
-    label: i18n.t("general.date-updated"),
-    type: "date",
-  },
-];
-</script>

frontend/app/components/Domain/Cookbook/CookbookPage.vue

@@ -1,130 +0,0 @@
-<template>
-  <div>
-    <!-- Edit Dialog -->
-    <BaseDialog
-      v-if="editTarget"
-      v-model="dialogStates.edit"
-      width="100%"
-      max-width="1100px"
-      :icon="$globals.icons.pages"
-      :title="$t('general.edit')"
-      :submit-icon="$globals.icons.save"
-      :submit-text="$t('general.save')"
-      :submit-disabled="!editTarget.queryFilterString"
-      can-submit
-      @submit="editCookbook"
-    >
-      <v-card-text>
-        <CookbookEditor
-          v-model="editTarget"
-        />
-      </v-card-text>
-    </BaseDialog>
-
-    <v-container
-      v-if="book"
-      class="my-0"
-    >
-      <v-sheet
-        color="transparent"
-        class="d-flex flex-column w-100 pa-0 ma-0"
-        elevation="0"
-      >
-        <div class="d-flex align-center w-100 mb-2">
-          <v-toolbar-title class="headline mb-0">
-            <v-icon size="large" class="mr-3">
-              {{ $globals.icons.pages }}
-            </v-icon>
-            {{ book.name }}
-          </v-toolbar-title>
-          <BaseButton
-            v-if="canEdit"
-            class="mx-1"
-            :edit="true"
-            @click="handleEditCookbook"
-          />
-        </div>
-        <div v-if="book.description" class="subtitle-1 text-grey-lighten-1 mb-2">
-          {{ book.description }}
-        </div>
-      </v-sheet>
-
-      <v-container class="pa-0">
-        <RecipeCardSection
-          class="mb-5 mx-1"
-          :recipes="recipes"
-          :query="{ cookbook: slug }"
-          @sort-recipes="assignSorted"
-          @replace-recipes="replaceRecipes"
-          @append-recipes="appendRecipes"
-          @delete="removeRecipe"
-        />
-      </v-container>
-    </v-container>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useLazyRecipes } from "~/composables/recipes";
-import RecipeCardSection from "@/components/Domain/Recipe/RecipeCardSection.vue";
-import { useCookbookStore } from "~/composables/store/use-cookbook-store";
-import { useCookbook } from "~/composables/use-group-cookbooks";
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-import type { ReadCookBook } from "~/lib/api/types/cookbook";
-import CookbookEditor from "~/components/Domain/Cookbook/CookbookEditor.vue";
-
-const auth = useMealieAuth();
-const { isOwnGroup } = useLoggedInState();
-
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
-
-const { recipes, appendRecipes, assignSorted, removeRecipe, replaceRecipes } = useLazyRecipes(isOwnGroup.value ? null : groupSlug.value);
-const slug = route.params.slug as string;
-const { getOne } = useCookbook(isOwnGroup.value ? null : groupSlug.value);
-const { actions } = useCookbookStore();
-const router = useRouter();
-
-const book = getOne(slug);
-
-const isOwnHousehold = computed(() => {
-  if (!(auth.user.value && book.value?.householdId)) {
-    return false;
-  }
-
-  return auth.user.value.householdId === book.value.householdId;
-});
-const canEdit = computed(() => isOwnGroup.value && isOwnHousehold.value);
-
-const dialogStates = reactive({
-  edit: false,
-});
-
-const editTarget = ref<ReadCookBook | null>(null);
-function handleEditCookbook() {
-  dialogStates.edit = true;
-  editTarget.value = book.value;
-}
-
-async function editCookbook() {
-  if (!editTarget.value) {
-    return;
-  }
-  const response = await actions.updateOne(editTarget.value);
-
-  if (response?.slug && book.value?.slug !== response?.slug) {
-    // if name changed, redirect to new slug
-    router.push(`/g/${route.params.groupSlug}/cookbooks/${response?.slug}`);
-  }
-  else {
-    // otherwise reload the page, since the recipe criteria changed
-    router.go(0);
-  }
-  dialogStates.edit = false;
-  editTarget.value = null;
-}
-
-useSeoMeta({
-  title: book?.value?.name || "Cookbook",
-});
-</script>

frontend/app/components/Domain/Group/GroupDataPage.vue

@@ -1,230 +0,0 @@
-<template>
-  <!-- Create Dialog -->
-  <BaseDialog
-    v-model="createDialog"
-    :title="createTitle || $t('general.create')"
-    :icon="icon"
-    color="primary"
-    max-width="600px"
-    width="100%"
-    :submit-disabled="!createFormValid"
-    can-confirm
-    @confirm="emit('create-one', createForm.data)"
-  >
-    <div class="mx-2 mt-2">
-      <slot name="create-dialog-top" />
-      <AutoForm
-        v-model="createForm.data"
-        v-model:is-valid="createFormValid"
-        :items="createForm.items"
-        class="py-2"
-      />
-    </div>
-  </BaseDialog>
-
-  <!-- Edit Dialog -->
-  <BaseDialog
-    v-model="editDialog"
-    :title="editTitle || $t('general.edit')"
-    :icon="icon"
-    color="primary"
-    max-width="600px"
-    width="100%"
-    :submit-disabled="!editFormValid"
-    can-confirm
-    @confirm="emit('edit-one', editForm.data)"
-  >
-    <div class="mx-2 mt-2">
-      <slot name="edit-dialog-top" />
-      <AutoForm
-        v-model="editForm.data"
-        v-model:is-valid="editFormValid"
-        :items="editForm.items"
-        class="py-2"
-      />
-    </div>
-    <template #custom-card-action>
-      <slot name="edit-dialog-custom-action" />
-    </template>
-  </BaseDialog>
-
-  <!-- Delete Dialog -->
-  <BaseDialog
-    v-model="deleteDialog"
-    :title="$t('general.confirm')"
-    :icon="$globals.icons.alertCircle"
-    color="error"
-    can-confirm
-    @confirm="$emit('deleteOne', deleteTarget.id)"
-  >
-    <v-card-text>
-      {{ $t("general.confirm-delete-generic") }}
-      <p v-if="deleteTarget" class="mt-4 ml-4">
-        {{ deleteTarget.name || deleteTarget.title || deleteTarget.id }}
-      </p>
-    </v-card-text>
-  </BaseDialog>
-
-  <!-- Bulk Delete Dialog -->
-  <BaseDialog
-    v-model="bulkDeleteDialog"
-    width="650px"
-    :title="$t('general.confirm')"
-    :icon="$globals.icons.alertCircle"
-    color="error"
-    can-confirm
-    @confirm="$emit('bulk-action', 'delete-selected', bulkDeleteTarget)"
-  >
-    <v-card-text>
-      <p class="h4">
-        {{ $t('general.confirm-delete-generic-items') }}
-      </p>
-      <v-card variant="outlined">
-        <v-virtual-scroll height="400" item-height="25" :items="bulkDeleteTarget">
-          <template #default="{ item }">
-            <v-list-item class="pb-2">
-              <v-list-item-title>{{ item.name || item.title || item.id }}</v-list-item-title>
-            </v-list-item>
-          </template>
-        </v-virtual-scroll>
-      </v-card>
-    </v-card-text>
-  </BaseDialog>
-
-  <BaseCardSectionTitle
-    :icon="icon"
-    section
-    :title="title"
-  />
-
-  <CrudTable
-    :headers="tableHeaders"
-    :table-config="tableConfig"
-    :data="data || []"
-    :bulk-actions="bulkActions"
-    :initial-sort="initialSort"
-    @edit-one="editEventHandler"
-    @delete-one="deleteEventHandler"
-    @bulk-action="handleBulkAction"
-  >
-    <template
-      v-for="slotName in itemSlotNames"
-      #[slotName]="slotProps"
-    >
-      <slot
-        :name="slotName"
-        v-bind="slotProps"
-      />
-    </template>
-    <template #button-row>
-      <BaseButton
-        create
-        @click="createDialog = true"
-      >
-        {{ $t("general.create") }}
-      </BaseButton>
-      <slot name="table-button-row" />
-    </template>
-    <template #button-bottom>
-      <slot name="table-button-bottom" />
-    </template>
-  </CrudTable>
-</template>
-
-<script setup lang="ts">
-import type { TableHeaders, TableConfig, BulkAction } from "~/components/global/CrudTable.vue";
-import type { AutoFormItems } from "~/types/auto-forms";
-
-const slots = useSlots();
-
-const emit = defineEmits<{
-  (e: "deleteOne", id: string): void;
-  (e: "deleteMany", ids: string[]): void;
-  (e: "create-one" | "edit-one", data: any): void;
-  (e: "bulk-action", event: string, items: any[]): void;
-}>();
-
-const tableHeaders = defineModel<TableHeaders[]>("tableHeaders", { required: true });
-const createForm = defineModel<{ items: AutoFormItems; data: Record<string, any> }>("createForm", { required: true });
-const createDialog = defineModel("createDialog", { type: Boolean, default: false });
-
-const editForm = defineModel<{ items: AutoFormItems; data: Record<string, any> }>("editForm", { required: true });
-const editDialog = defineModel("editDialog", { type: Boolean, default: false });
-
-defineProps({
-  icon: {
-    type: String,
-    required: true,
-  },
-  title: {
-    type: String,
-    required: true,
-  },
-  createTitle: {
-    type: String,
-  },
-  editTitle: {
-    type: String,
-  },
-  tableConfig: {
-    type: Object as PropType<TableConfig>,
-    default: () => ({
-      hideColumns: false,
-      canExport: true,
-    }),
-  },
-  data: {
-    type: Array as PropType<Array<any>>,
-    required: true,
-  },
-  bulkActions: {
-    type: Array as PropType<BulkAction[]>,
-    required: true,
-  },
-  initialSort: {
-    type: String,
-    default: "name",
-  },
-});
-
-// ============================================================
-// Bulk Action Handler
-function handleBulkAction(event: string, items: any[]) {
-  if (event === "delete-selected") {
-    bulkDeleteEventHandler(items);
-    return;
-  }
-  emit("bulk-action", event, items);
-}
-
-// ============================================================
-// Create & Edit
-const createFormValid = ref(false);
-const editFormValid = ref(false);
-const itemSlotNames = computed(() => Object.keys(slots).filter(slotName => slotName.startsWith("item.")));
-const editEventHandler = (item: any) => {
-  editForm.value.data = { ...item };
-  editDialog.value = true;
-};
-
-// ============================================================
-// Delete Logic
-const deleteTarget = ref<any>(null);
-const deleteDialog = ref(false);
-
-function deleteEventHandler(item: any) {
-  deleteTarget.value = item;
-  deleteDialog.value = true;
-}
-
-// ============================================================
-// Bulk Delete Logic
-const bulkDeleteTarget = ref<Array<any>>([]);
-const bulkDeleteDialog = ref(false);
-
-function bulkDeleteEventHandler(items: Array<any>) {
-  bulkDeleteTarget.value = items;
-  bulkDeleteDialog.value = true;
-  console.log("Bulk Delete Event Handler", items);
-}
-</script>

frontend/app/components/Domain/Group/GroupExportData.vue

@@ -1,52 +0,0 @@
-<template>
-  <v-data-table
-    item-key="id"
-    :headers="headers"
-    :items="exports"
-    :items-per-page="15"
-    class="elevation-0"
-    @click:row="downloadData"
-  >
-    <template #[`item.expires`]="{ item }">
-      {{ getTimeToExpire(item.expires) }}
-    </template>
-    <template #[`item.actions`]="{ item }">
-      <BaseButton
-        download
-        size="small"
-        :download-url="`/api/recipes/bulk-actions/export/${item.id}/download`"
-      />
-    </template>
-  </v-data-table>
-</template>
-
-<script setup lang="ts">
-import { parseISO, formatDistanceToNow } from "date-fns";
-import type { GroupDataExport } from "~/lib/api/types/group";
-
-defineProps<{
-  exports: GroupDataExport[];
-}>();
-
-const i18n = useI18n();
-
-const headers = [
-  { title: i18n.t("export.export"), value: "name" },
-  { title: i18n.t("export.file-name"), value: "filename" },
-  { title: i18n.t("export.size"), value: "size" },
-  { title: i18n.t("export.link-expires"), value: "expires" },
-  { title: "", value: "actions" },
-];
-
-function getTimeToExpire(timeString: string) {
-  const expiresAt = parseISO(timeString);
-
-  return formatDistanceToNow(expiresAt, {
-    addSuffix: false,
-  });
-}
-
-function downloadData(_: any) {
-  console.log("Downloading data...");
-}
-</script>

frontend/app/components/Domain/Group/GroupPreferencesEditor.vue

@@ -1,45 +0,0 @@
-<template>
-  <div v-if="preferences">
-    <BaseCardSectionTitle :title="$t('group.group-preferences')" />
-    <div class="mb-6">
-      <v-checkbox
-        v-model="local.privateGroup"
-        hide-details
-        density="compact"
-        color="primary"
-        :label="$t('group.private-group')"
-      />
-      <div class="ml-8">
-        <p class="text-subtitle-2 my-0 py-0">
-          {{ $t("group.private-group-description") }}
-        </p>
-        <DocLink
-          class="mt-2"
-          link="/documentation/getting-started/faq/#how-do-private-groups-and-recipes-work"
-        />
-      </div>
-    </div>
-    <div class="mb-6">
-      <v-checkbox
-        v-model="local.showAnnouncements"
-        hide-details
-        density="compact"
-        color="primary"
-        :label="$t('announcements.show-announcements-from-mealie')"
-      />
-      <div class="ml-8">
-        <p class="text-subtitle-2 my-0 py-0">
-          {{ $t("announcements.show-announcements-setting-description") }}
-        </p>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { ReadGroupPreferences } from "~/lib/api/types/user";
-
-const preferences = defineModel<ReadGroupPreferences>({ required: true });
-const local = reactive({ ...preferences.value });
-watch(local, (newVal) => { preferences.value = { ...newVal }; });
-</script>

frontend/app/components/Domain/Household/GroupMealPlanDayContextMenu.vue

@@ -1,144 +0,0 @@
-<template>
-  <div class="text-center">
-    <RecipeDialogAddToShoppingList
-      v-if="shoppingLists"
-      v-model="shoppingListDialog"
-      :recipes="recipesWithScales"
-      :shopping-lists="shoppingLists"
-    />
-    <v-menu
-      offset-y
-      start
-      :bottom="!menuTop"
-      :nudge-bottom="!menuTop ? '5' : '0'"
-      :top="menuTop"
-      :nudge-top="menuTop ? '5' : '0'"
-      allow-overflow
-      close-delay="125"
-      content-class="d-print-none"
-    >
-      <template #activator="{ props: activatorProps }">
-        <v-btn
-          :class="{ 'rounded-circle': fab }"
-          :size="fab ? 'small' : undefined"
-          :color="color"
-          :icon="!fab"
-          variant="text"
-          dark
-          v-bind="activatorProps"
-          @click.prevent
-        >
-          <v-icon>{{ icon }}</v-icon>
-        </v-btn>
-      </template>
-      <v-list density="compact">
-        <v-list-item
-          v-for="(item, index) in menuItems"
-          :key="index"
-          @click="contextMenuEventHandler(item.event)"
-        >
-          <template #prepend>
-            <v-icon :color="item.color">
-              {{ item.icon }}
-            </v-icon>
-          </template>
-          <v-list-item-title>{{ item.title }}</v-list-item-title>
-        </v-list-item>
-      </v-list>
-    </v-menu>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { Recipe } from "~/lib/api/types/recipe";
-import RecipeDialogAddToShoppingList from "~/components/Domain/Recipe/RecipeDialogAddToShoppingList.vue";
-import type { ShoppingListSummary } from "~/lib/api/types/household";
-import { useUserApi } from "~/composables/api";
-
-export interface ContextMenuItem {
-  title: string;
-  icon: string;
-  color: string | undefined;
-  event: string;
-  isPublic: boolean;
-}
-
-interface Props {
-  recipes?: Recipe[];
-  menuTop?: boolean;
-  fab?: boolean;
-  color?: string;
-  menuIcon?: string | null;
-}
-const props = withDefaults(defineProps<Props>(), {
-  recipes: () => [],
-  menuTop: true,
-  fab: false,
-  color: "primary",
-  menuIcon: null,
-});
-
-const emit = defineEmits<{
-  [key: string]: [];
-}>();
-
-const i18n = useI18n();
-const { $globals } = useNuxtApp();
-const api = useUserApi();
-
-const state = reactive({
-  loading: false,
-  shoppingListDialog: false,
-  menuItems: [
-    {
-      title: i18n.t("meal-plan.add-day-to-list"),
-      icon: $globals.icons.cartCheck,
-      color: undefined,
-      event: "shoppingList",
-      isPublic: false,
-    },
-  ],
-});
-
-const { shoppingListDialog, menuItems } = toRefs(state);
-
-const icon = props.menuIcon || $globals.icons.dotsVertical;
-
-const shoppingLists = ref<ShoppingListSummary[]>();
-const recipesWithScales = computed(() => {
-  return props.recipes.map((recipe) => {
-    return {
-      scale: 1,
-      ...recipe,
-    };
-  });
-});
-
-async function getShoppingLists() {
-  const { data } = await api.shopping.lists.getAll(1, -1, { orderBy: "name", orderDirection: "asc" });
-  if (data) {
-    shoppingLists.value = data.items as ShoppingListSummary[] ?? [];
-  }
-}
-
-// eslint-disable-next-line @typescript-eslint/no-invalid-void-type
-const eventHandlers: { [key: string]: () => void | Promise<any> } = {
-  shoppingList: async () => {
-    await getShoppingLists();
-    state.shoppingListDialog = true;
-  },
-};
-
-function contextMenuEventHandler(eventKey: string) {
-  const handler = eventHandlers[eventKey];
-
-  if (handler && typeof handler === "function") {
-    handler();
-    state.loading = false;
-    return;
-  }
-
-  emit(eventKey);
-  state.loading = false;
-}
-</script>

frontend/app/components/Domain/Household/GroupMealPlanRuleForm.vue

@@ -1,129 +0,0 @@
-<template>
-  <div>
-    <div
-      class="d-md-flex"
-      style="gap: 10px"
-    >
-      <v-select
-        v-model="day"
-        :items="MEAL_DAY_OPTIONS"
-        :label="$t('meal-plan.rule-day')"
-      />
-      <v-select
-        v-model="entryType"
-        :items="MEAL_TYPE_OPTIONS"
-        :label="$t('meal-plan.meal-type')"
-      />
-    </div>
-
-    <div class="mb-5">
-      <QueryFilterBuilder
-        :field-defs="fieldDefs"
-        :initial-query-filter="props.queryFilter"
-        @input="handleQueryFilterInput"
-      />
-    </div>
-
-    <!-- TODO: proper pluralization of inputDay -->
-    {{ $t('meal-plan.this-rule-will-apply', {
-      dayCriteria: day === "unset" ? $t('meal-plan.to-all-days') : $t('meal-plan.on-days', [day]),
-      mealTypeCriteria: entryType === "unset" ? $t('meal-plan.for-all-meal-types') : $t('meal-plan.for-type-meal-types', [entryType]),
-    }) }}
-  </div>
-</template>
-
-<script setup lang="ts">
-import QueryFilterBuilder from "~/components/Domain/QueryFilterBuilder.vue";
-import type { FieldDefinition } from "~/composables/use-query-filter-builder";
-import { Organizer } from "~/lib/api/types/non-generated";
-import type { QueryFilterJSON } from "~/lib/api/types/non-generated";
-
-interface Props {
-  queryFilter?: QueryFilterJSON | null;
-  showHelp?: boolean;
-}
-const props = withDefaults(defineProps<Props>(), {
-  queryFilter: null,
-  showHelp: false,
-});
-
-const day = defineModel<string>("day", { default: "unset" });
-const entryType = defineModel<string>("entryType", { default: "unset" });
-const queryFilterString = defineModel<string>("queryFilterString", { default: "" });
-
-const i18n = useI18n();
-
-const MEAL_TYPE_OPTIONS = [
-  { title: i18n.t("meal-plan.breakfast"), value: "breakfast" },
-  { title: i18n.t("meal-plan.lunch"), value: "lunch" },
-  { title: i18n.t("meal-plan.dinner"), value: "dinner" },
-  { title: i18n.t("meal-plan.side"), value: "side" },
-  { title: i18n.t("meal-plan.snack"), value: "snack" },
-  { title: i18n.t("meal-plan.drink"), value: "drink" },
-  { title: i18n.t("meal-plan.dessert"), value: "dessert" },
-  { title: i18n.t("meal-plan.type-any"), value: "unset" },
-];
-
-const MEAL_DAY_OPTIONS = [
-  { title: i18n.t("general.monday"), value: "monday" },
-  { title: i18n.t("general.tuesday"), value: "tuesday" },
-  { title: i18n.t("general.wednesday"), value: "wednesday" },
-  { title: i18n.t("general.thursday"), value: "thursday" },
-  { title: i18n.t("general.friday"), value: "friday" },
-  { title: i18n.t("general.saturday"), value: "saturday" },
-  { title: i18n.t("general.sunday"), value: "sunday" },
-  { title: i18n.t("meal-plan.day-any"), value: "unset" },
-];
-
-function handleQueryFilterInput(value: string | undefined) {
-  queryFilterString.value = value || "";
-}
-
-const fieldDefs: FieldDefinition[] = [
-  {
-    name: "recipe_category.id",
-    label: i18n.t("category.categories"),
-    type: Organizer.Category,
-  },
-  {
-    name: "tags.id",
-    label: i18n.t("tag.tags"),
-    type: Organizer.Tag,
-  },
-  {
-    name: "recipe_ingredient.food.id",
-    label: i18n.t("recipe.ingredients"),
-    type: Organizer.Food,
-  },
-  {
-    name: "tools.id",
-    label: i18n.t("tool.tools"),
-    type: Organizer.Tool,
-  },
-  {
-    name: "household_id",
-    label: i18n.t("household.households"),
-    type: Organizer.Household,
-  },
-  {
-    name: "user_id",
-    label: i18n.t("user.users"),
-    type: Organizer.User,
-  },
-  {
-    name: "last_made",
-    label: i18n.t("general.last-made"),
-    type: "relativeDate",
-  },
-  {
-    name: "created_at",
-    label: i18n.t("general.date-created"),
-    type: "date",
-  },
-  {
-    name: "updated_at",
-    label: i18n.t("general.date-updated"),
-    type: "date",
-  },
-];
-</script>

frontend/app/components/Domain/Household/HouseholdPreferencesEditor.vue

@@ -1,142 +0,0 @@
-<template>
-  <div v-if="preferences">
-    <BaseCardSectionTitle :title="$t('household.household-preferences')" />
-    <div class="mb-6">
-      <v-checkbox v-model="local.privateHousehold" hide-details density="compact" :label="$t('household.private-household')" color="primary" />
-      <div class="ml-8">
-        <p class="text-subtitle-2 my-0 py-0">
-          {{ $t("household.private-household-description") }}
-        </p>
-        <DocLink class="mt-2" link="/documentation/getting-started/faq/#how-do-private-groups-and-recipes-work" />
-      </div>
-    </div>
-    <div class="mb-6">
-      <v-checkbox v-model="local.lockRecipeEditsFromOtherHouseholds" hide-details density="compact" :label="$t('household.lock-recipe-edits-from-other-households')" color="primary" />
-      <div class="ml-8">
-        <p class="text-subtitle-2 my-0 py-0">
-          {{ $t("household.lock-recipe-edits-from-other-households-description") }}
-        </p>
-      </div>
-    </div>
-    <div class="mb-6">
-      <v-checkbox
-        v-model="local.showAnnouncements"
-        hide-details
-        density="compact"
-        color="primary"
-        :label="$t('announcements.show-announcements-from-mealie')"
-      />
-      <div class="ml-8">
-        <p class="text-subtitle-2 my-0 py-0">
-          {{ $t("announcements.show-announcements-setting-description") }}
-        </p>
-      </div>
-    </div>
-    <v-select
-      v-model="local.firstDayOfWeek"
-      :prepend-icon="$globals.icons.calendarWeekBegin"
-      :items="allDays"
-      item-title="name"
-      item-value="value"
-      :label="$t('settings.first-day-of-week')"
-      variant="underlined"
-      flat
-    />
-
-    <BaseCardSectionTitle class="mt-5" :title="$t('household.household-recipe-preferences')">
-      {{ $t("household.default-recipe-preferences-description") }}
-    </BaseCardSectionTitle>
-    <div class="preference-container">
-      <div v-for="p in recipePreferences" :key="p.key">
-        <v-checkbox v-model="local[p.key]" hide-details density="compact" :label="p.label" color="primary" />
-        <p class="ml-8 text-subtitle-2 my-0 py-0">
-          {{ p.description }}
-        </p>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { ReadHouseholdPreferences } from "~/lib/api/types/household";
-
-const preferences = defineModel<ReadHouseholdPreferences>({ required: true });
-const local = reactive({ ...preferences.value });
-watch(local, (newVal) => { preferences.value = { ...newVal }; });
-
-const i18n = useI18n();
-
-type Preference = {
-  key: keyof ReadHouseholdPreferences;
-  label: string;
-  description: string;
-};
-
-const recipePreferences: Preference[] = [
-  {
-    key: "recipePublic",
-    label: i18n.t("group.allow-users-outside-of-your-group-to-see-your-recipes"),
-    description: i18n.t("group.allow-users-outside-of-your-group-to-see-your-recipes-description"),
-  },
-  {
-    key: "recipeShowNutrition",
-    label: i18n.t("group.show-nutrition-information"),
-    description: i18n.t("group.show-nutrition-information-description"),
-  },
-  {
-    key: "recipeShowAssets",
-    label: i18n.t("group.show-recipe-assets"),
-    description: i18n.t("group.show-recipe-assets-description"),
-  },
-  {
-    key: "recipeLandscapeView",
-    label: i18n.t("group.default-to-landscape-view"),
-    description: i18n.t("group.default-to-landscape-view-description"),
-  },
-  {
-    key: "recipeDisableComments",
-    label: i18n.t("group.disable-users-from-commenting-on-recipes"),
-    description: i18n.t("group.disable-users-from-commenting-on-recipes-description"),
-  },
-];
-
-const allDays = [
-  {
-    name: i18n.t("general.sunday"),
-    value: 0,
-  },
-  {
-    name: i18n.t("general.monday"),
-    value: 1,
-  },
-  {
-    name: i18n.t("general.tuesday"),
-    value: 2,
-  },
-  {
-    name: i18n.t("general.wednesday"),
-    value: 3,
-  },
-  {
-    name: i18n.t("general.thursday"),
-    value: 4,
-  },
-  {
-    name: i18n.t("general.friday"),
-    value: 5,
-  },
-  {
-    name: i18n.t("general.saturday"),
-    value: 6,
-  },
-];
-</script>
-
-<style lang="css">
-.preference-container {
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-  max-width: 600px;
-}
-</style>

frontend/app/components/Domain/QueryFilterBuilder.vue

@@ -1,797 +0,0 @@
-<template>
-  <v-card class="ma-0" flat fluid>
-    <v-card-text class="ma-0 pa-0">
-      <VueDraggable
-        v-model="fields"
-        handle=".handle"
-        :delay="250"
-        :delay-on-touch-only="true"
-        v-bind="{
-          animation: 200,
-          group: 'recipe-instructions',
-          ghostClass: 'ghost',
-        }"
-        @start="drag = true"
-        @end="onDragEnd"
-      >
-        <v-row
-          v-for="(field, index) in fields"
-          :key="field.id"
-          class="d-flex flex-row flex-wrap mx-auto pb-2"
-          :class="$vuetify.display.xs ? (Math.floor(index / 1) % 2 === 0 ? 'bg-dark' : 'bg-light') : ''"
-          style="max-width: 100%;"
-        >
-          <!-- drag handle -->
-          <v-col
-            :cols="config.items.icon.cols(index)"
-            :sm="config.items.icon.sm(index)"
-            :class="$vuetify.display.smAndDown ? 'd-flex pa-0' : 'd-flex justify-end pr-6'"
-          >
-            <v-icon class="handle my-auto" :size="28" style="cursor: move;">
-              {{ $globals.icons.arrowUpDown }}
-            </v-icon>
-          </v-col>
-
-          <!-- and / or  -->
-          <v-col
-            v-if="index != 0 || $vuetify.display.smAndUp"
-            :cols="config.items.logicalOperator.cols(index)"
-            :sm="config.items.logicalOperator.sm(index)"
-            :class="config.col.class"
-          >
-            <v-select
-              v-if="index"
-              :model-value="field.logicalOperator"
-              :items="[logOps.AND, logOps.OR]"
-              item-title="label"
-              item-value="value"
-              variant="underlined"
-              @update:model-value="setLogicalOperatorValue(field, index, $event as unknown as LogicalOperator)"
-            >
-              <template #chip="{ item }">
-                <span :class="config.select.textClass" style="width: 100%;">
-                  {{ item.raw.label }}
-                </span>
-              </template>
-            </v-select>
-          </v-col>
-
-          <!-- left parenthesis -->
-          <v-col
-            v-if="showAdvanced"
-            :cols="config.items.leftParens.cols(index)"
-            :sm="config.items.leftParens.sm(index)"
-            :class="config.col.class"
-          >
-            <v-select
-              :model-value="field.leftParenthesis"
-              :items="['', '(', '((', '(((']"
-              variant="underlined"
-              @update:model-value="setLeftParenthesisValue(field, index, $event)"
-            >
-              <template #chip="{ item }">
-                <span :class="config.select.textClass" style="width: 100%;">
-                  {{ item.raw }}
-                </span>
-              </template>
-            </v-select>
-          </v-col>
-
-          <!-- field name -->
-          <v-col
-            :cols="config.items.fieldName.cols(index)"
-            :sm="config.items.fieldName.sm(index)"
-            :class="config.col.class"
-          >
-            <v-select
-              chips
-              :model-value="field.label"
-              :items="fieldDefs"
-              variant="underlined"
-              item-title="label"
-              @update:model-value="setField(index, $event)"
-            >
-              <template #chip="{ item }">
-                <span :class="config.select.textClass" style="width: 100%;">
-                  {{ item.raw.label }}
-                </span>
-              </template>
-            </v-select>
-          </v-col>
-
-          <!-- relational operator -->
-          <v-col
-            :cols="config.items.relationalOperator.cols(index)"
-            :sm="config.items.relationalOperator.sm(index)"
-            :class="config.col.class"
-          >
-            <v-select
-              v-if="field.type !== 'boolean'"
-              :model-value="field.relationalOperatorValue"
-              :items="field.relationalOperatorChoices"
-              item-title="label"
-              item-value="value"
-              variant="underlined"
-              @update:model-value="setRelationalOperatorValue(field, index, $event as unknown as RelationalKeyword | RelationalOperator)"
-            >
-              <template #chip="{ item }">
-                <span :class="config.select.textClass" style="width: 100%;">
-                  {{ item.raw.label }}
-                </span>
-              </template>
-            </v-select>
-          </v-col>
-
-          <!-- field value -->
-          <v-col
-            :cols="config.items.fieldValue.cols(index)"
-            :sm="config.items.fieldValue.sm(index)"
-            :class="config.col.class"
-          >
-            <v-select
-              v-if="field.fieldChoices"
-              :model-value="field.values"
-              :items="field.fieldChoices"
-              item-title="label"
-              item-value="value"
-              multiple
-              variant="underlined"
-              @update:model-value="setFieldValues(field, index, $event)"
-            />
-            <v-text-field
-              v-else-if="field.type === 'string'"
-              :model-value="field.value"
-              variant="underlined"
-              @update:model-value="setFieldValue(field, index, $event)"
-            />
-            <v-number-input
-              v-else-if="field.type === 'number'"
-              :model-value="field.value"
-              variant="underlined"
-              control-variant="stacked"
-              inset
-              :precision="null"
-              @update:model-value="setFieldValue(field, index, $event)"
-            />
-            <v-checkbox
-              v-else-if="field.type === 'boolean'"
-              :model-value="field.value"
-              @update:model-value="setFieldValue(field, index, $event!)"
-            />
-            <v-menu
-              v-else-if="field.type === 'date'"
-              v-model="datePickers[index]"
-              :close-on-content-click="false"
-              transition="scale-transition"
-              offset-y
-              max-width="290px"
-              min-width="auto"
-            >
-              <template #activator="{ props: activatorProps }">
-                <v-text-field
-                  :model-value="$d(safeNewDate(field.value + 'T00:00:00'))"
-                  variant="underlined"
-                  color="primary"
-                  class="date-input"
-                  v-bind="activatorProps"
-                  readonly
-                />
-              </template>
-              <v-date-picker
-                :model-value="safeNewDate(field.value + 'T00:00:00')"
-                hide-header
-                :first-day-of-week="firstDayOfWeek"
-                :local="$i18n.locale"
-                @update:model-value="val => setFieldValue(field, index, val ? val.toISOString().slice(0, 10) : '')"
-              />
-            </v-menu>
-            <!--
-              Relative dates are assumed to be negative intervals with a unit of days.
-              The input is a *positive*, interpreted internally as a *negative* offset.
-            -->
-            <v-number-input
-              v-else-if="field.type === 'relativeDate'"
-              :model-value="parseRelativeDateOffset(field.value)"
-              :suffix="$t('query-filter.dates.days-ago', parseRelativeDateOffset(field.value))"
-              variant="underlined"
-              control-variant="stacked"
-              density="compact"
-              inset
-              :min="0"
-              :precision="0"
-              class="date-input"
-              @update:model-value="setFieldValue(field, index, $event)"
-            />
-            <RecipeOrganizerSelector
-              v-else-if="field.type === Organizer.Category"
-              v-model="field.organizers"
-              :selector-type="Organizer.Category"
-              :show-add="false"
-              :show-label="false"
-              :show-icon="false"
-              variant="underlined"
-              @update:model-value="val => setFieldOrganizers(field, index, (val || []) as OrganizerBase[])"
-            />
-            <RecipeOrganizerSelector
-              v-else-if="field.type === Organizer.Tag"
-              v-model="field.organizers"
-              :selector-type="Organizer.Tag"
-              :show-add="false"
-              :show-label="false"
-              :show-icon="false"
-              variant="underlined"
-              @update:model-value="val => setFieldOrganizers(field, index, (val || []) as OrganizerBase[])"
-            />
-            <RecipeOrganizerSelector
-              v-else-if="field.type === Organizer.Tool"
-              v-model="field.organizers"
-              :selector-type="Organizer.Tool"
-              :show-add="false"
-              :show-label="false"
-              :show-icon="false"
-              variant="underlined"
-              @update:model-value="val => setFieldOrganizers(field, index, (val || []) as OrganizerBase[])"
-            />
-            <RecipeOrganizerSelector
-              v-else-if="field.type === Organizer.Food"
-              v-model="field.organizers"
-              :selector-type="Organizer.Food"
-              :show-add="false"
-              :show-label="false"
-              :show-icon="false"
-              variant="underlined"
-              @update:model-value="val => setFieldOrganizers(field, index, (val || []) as OrganizerBase[])"
-            />
-            <RecipeOrganizerSelector
-              v-else-if="field.type === Organizer.Household"
-              v-model="field.organizers"
-              :selector-type="Organizer.Household"
-              :show-add="false"
-              :show-label="false"
-              :show-icon="false"
-              variant="underlined"
-              @update:model-value="val => setFieldOrganizers(field, index, (val || []) as OrganizerBase[])"
-            />
-            <RecipeOrganizerSelector
-              v-else-if="field.type === Organizer.User"
-              v-model="field.organizers"
-              :selector-type="Organizer.User"
-              :show-add="false"
-              :show-label="false"
-              :show-icon="false"
-              variant="underlined"
-              @update:model-value="val => setFieldOrganizers(field, index, (val || []) as OrganizerBase[])"
-            />
-          </v-col>
-
-          <!-- right parenthesis -->
-          <v-col
-            v-if="showAdvanced"
-            :cols="config.items.rightParens.cols(index)"
-            :sm="config.items.rightParens.sm(index)"
-            :class="config.col.class"
-          >
-            <v-select
-              :model-value="field.rightParenthesis"
-              :items="['', ')', '))', ')))']"
-              variant="underlined"
-              @update:model-value="setRightParenthesisValue(field, index, $event)"
-            >
-              <template #chip="{ item }">
-                <span :class="config.select.textClass" style="width: 100%;">
-                  {{ item.raw }}
-                </span>
-              </template>
-            </v-select>
-          </v-col>
-
-          <!-- field actions -->
-          <v-col
-            v-if="!$vuetify.display.smAndDown || index === fields.length - 1"
-            :cols="config.items.fieldActions.cols(index)"
-            :sm="config.items.fieldActions.sm(index)"
-            :class="config.col.class"
-          >
-            <BaseButtonGroup
-              :buttons="[
-                {
-                  icon: $globals.icons.delete,
-                  text: $t('general.delete'),
-                  event: 'delete',
-                  disabled: fields.length === 1,
-                },
-              ]"
-              class="my-auto"
-              @delete="removeField(index)"
-            />
-          </v-col>
-        </v-row>
-      </VueDraggable>
-    </v-card-text>
-    <v-card-actions>
-      <v-row fluid class="d-flex justify-end ma-2">
-        <v-spacer />
-        <v-checkbox
-          v-model="showAdvanced"
-          hide-details
-          :label="$t('general.show-advanced')"
-          class="my-auto mr-4"
-          color="primary"
-        />
-        <BaseButton
-          create
-          :text="$t('general.add-field')"
-          class="my-auto"
-          @click="addField(fieldDefs[0])"
-        />
-      </v-row>
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script setup lang="ts">
-import { VueDraggable } from "vue-draggable-plus";
-import { useDebounceFn } from "@vueuse/core";
-import { useHouseholdSelf } from "~/composables/use-households";
-import RecipeOrganizerSelector from "~/components/Domain/Recipe/RecipeOrganizerSelector.vue";
-import { Organizer } from "~/lib/api/types/non-generated";
-import type {
-  LogicalOperator,
-  QueryFilterJSON,
-  QueryFilterJSONPart,
-  RelationalKeyword,
-  RelationalOperator,
-} from "~/lib/api/types/non-generated";
-import { useCategoryStore, useFoodStore, useHouseholdStore, useTagStore, useToolStore } from "~/composables/store";
-import { useUserStore } from "~/composables/store/use-user-store";
-import { type Field, type FieldDefinition, type FieldValue, type OrganizerBase, useQueryFilterBuilder } from "~/composables/use-query-filter-builder";
-
-const props = defineProps({
-  fieldDefs: {
-    type: Array as () => FieldDefinition[],
-    required: true,
-  },
-  initialQueryFilter: {
-    type: Object as () => QueryFilterJSON | null,
-    default: null,
-  },
-});
-
-const emit = defineEmits<{
-  (event: "input", value: string | undefined): void;
-  (event: "inputJSON", value: QueryFilterJSON | undefined): void;
-}>();
-
-const { household } = useHouseholdSelf();
-const {
-  logOps,
-  placeholderKeywords,
-  getRelOps,
-  buildQueryFilterString,
-  getFieldFromFieldDef,
-  isOrganizerType,
-} = useQueryFilterBuilder();
-
-const firstDayOfWeek = computed(() => {
-  return household.value?.preferences?.firstDayOfWeek || 0;
-});
-
-const state = reactive({
-  showAdvanced: false,
-  qfValid: false,
-  datePickers: [] as boolean[],
-  drag: false,
-});
-const { showAdvanced, datePickers, drag } = toRefs(state);
-
-const storeMap = {
-  [Organizer.Category]: useCategoryStore(),
-  [Organizer.Tag]: useTagStore(),
-  [Organizer.Tool]: useToolStore(),
-  [Organizer.Food]: useFoodStore(),
-  [Organizer.Household]: useHouseholdStore(),
-  [Organizer.User]: useUserStore(),
-};
-
-function onDragEnd(event: any) {
-  state.drag = false;
-
-  const oldIndex: number = event.oldIndex;
-  const newIndex: number = event.newIndex;
-  state.datePickers[oldIndex] = false;
-  state.datePickers[newIndex] = false;
-}
-
-// add id to fields to prevent reactivity issues
-type FieldWithId = Field & { id: number };
-const fields = ref<FieldWithId[]>([]);
-
-const uid = ref(1); // init uid to pass to fields
-function useUid() {
-  return uid.value++;
-}
-function addField(field: FieldDefinition) {
-  fields.value.push({
-    ...getFieldFromFieldDef(field),
-    id: useUid(),
-  });
-  state.datePickers.push(false);
-}
-
-function setField(index: number, fieldLabel: string) {
-  state.datePickers[index] = false;
-  const fieldDef = props.fieldDefs.find(fieldDef => fieldDef.label === fieldLabel);
-  if (!fieldDef) {
-    return;
-  }
-
-  const resetValue = (fieldDef.type !== fields.value[index].type) || (fieldDef.fieldChoices !== fields.value[index].fieldChoices);
-  const updatedField = { ...fields.value[index], ...fieldDef };
-
-  // we have to set this explicitly since it might be undefined
-  updatedField.fieldChoices = fieldDef.fieldChoices;
-
-  fields.value[index] = {
-    ...getFieldFromFieldDef(updatedField, resetValue),
-    id: fields.value[index].id, // keep the id
-  };
-
-  // Defaults
-  switch (fields.value[index].type) {
-    case "date":
-      fields.value[index].value = safeNewDate("");
-      break;
-    case "relativeDate":
-      fields.value[index].value = "$NOW-30d";
-      break;
-
-    default:
-      break;
-  }
-}
-
-function setLeftParenthesisValue(field: FieldWithId, index: number, value: string) {
-  fields.value[index].leftParenthesis = value;
-}
-
-function setRightParenthesisValue(field: FieldWithId, index: number, value: string) {
-  fields.value[index].rightParenthesis = value;
-}
-
-function setLogicalOperatorValue(field: FieldWithId, index: number, value: LogicalOperator | undefined) {
-  if (!value) {
-    value = logOps.value.AND.value;
-  }
-
-  fields.value[index].logicalOperator = value ? logOps.value[value] : undefined;
-}
-
-function setRelationalOperatorValue(field: FieldWithId, index: number, value: RelationalKeyword | RelationalOperator) {
-  const relOps = getRelOps(field.type);
-  fields.value[index].relationalOperatorValue = relOps.value[value];
-}
-
-function setFieldValue(field: FieldWithId, index: number, value: FieldValue) {
-  state.datePickers[index] = false;
-
-  if (field.type === "relativeDate") {
-    // Value is set to an int representing the offset from $NOW
-    // Values are assumed to be negative offsets ('-') with a unit of days ('d')
-    fields.value[index].value = `$NOW-${Math.abs(value)}d`;
-  }
-  else {
-    fields.value[index].value = value;
-  }
-}
-
-function setFieldValues(field: FieldWithId, index: number, values: FieldValue[]) {
-  fields.value[index].values = values;
-}
-
-function setFieldOrganizers(field: FieldWithId, index: number, organizers: OrganizerBase[]) {
-  fields.value[index].organizers = organizers;
-  // Sync the values array with the organizers array
-  fields.value[index].values = organizers.map(org => org.id?.toString() || "").filter(id => id);
-}
-
-function removeField(index: number) {
-  fields.value.splice(index, 1);
-  state.datePickers.splice(index, 1);
-}
-
-const fieldsUpdater = useDebounceFn(() => {
-  const qf = buildQueryFilterString(fields.value, state.showAdvanced);
-  if (qf) {
-    console.debug(`Set query filter: ${qf}`);
-  }
-  state.qfValid = !!qf;
-
-  emit("input", qf || undefined);
-  emit("inputJSON", qf ? buildQueryFilterJSON() : undefined);
-}, 500);
-
-watch(fields, fieldsUpdater, { deep: true });
-
-async function hydrateOrganizers(field: FieldWithId, _index: number) {
-  if (!field.values?.length || !isOrganizerType(field.type)) {
-    return;
-  }
-
-  const { store, actions } = storeMap[field.type];
-  if (!store.value.length) {
-    await actions.refresh();
-  }
-
-  const organizers = field.values.map((value) => {
-    const organizer = store.value.find(item => item?.id?.toString() === value);
-    if (!organizer) {
-      console.error(`Could not find organizer with id ${value}`);
-      return undefined;
-    }
-    return organizer;
-  });
-
-  field.organizers = organizers.filter(organizer => organizer !== undefined) as OrganizerBase[];
-  return field;
-}
-
-function initFieldsError(error = "") {
-  if (error) {
-    console.error(error);
-  }
-
-  fields.value = [];
-  if (props.fieldDefs.length) {
-    addField(props.fieldDefs[0]);
-  }
-}
-
-async function initializeFields() {
-  if (!props.initialQueryFilter?.parts?.length) {
-    return initFieldsError();
-  }
-
-  const initFields: FieldWithId[] = [];
-  let error = false;
-
-  for (const [index, part] of props.initialQueryFilter.parts.entries()) {
-    const fieldDef = props.fieldDefs.find(fieldDef => fieldDef.name === part.attributeName);
-    if (!fieldDef) {
-      error = true;
-      return initFieldsError(`Invalid query filter; unknown attribute name "${part.attributeName || ""}"`);
-    }
-
-    const field: FieldWithId = {
-      ...getFieldFromFieldDef(fieldDef),
-      id: useUid(),
-    };
-
-    const relOps = getRelOps(field.type);
-
-    field.leftParenthesis = part.leftParenthesis || field.leftParenthesis;
-    field.rightParenthesis = part.rightParenthesis || field.rightParenthesis;
-    field.logicalOperator = part.logicalOperator
-      ? logOps.value[part.logicalOperator]
-      : field.logicalOperator;
-    field.relationalOperatorValue = part.relationalOperator
-      ? relOps.value[part.relationalOperator]
-      : field.relationalOperatorValue;
-    field.relationalOperatorValue = part.relationalOperator
-      ? relOps.value[part.relationalOperator]
-      : field.relationalOperatorValue;
-
-    if (field.leftParenthesis || field.rightParenthesis) {
-      state.showAdvanced = true;
-    }
-
-    if (field.fieldChoices?.length || isOrganizerType(field.type)) {
-      if (typeof part.value === "string") {
-        field.values = part.value ? [part.value] : [];
-      }
-      else {
-        field.values = part.value || [];
-      }
-
-      if (isOrganizerType(field.type)) {
-        await hydrateOrganizers(field, index);
-      }
-    }
-    else if (field.type === "boolean") {
-      const boolString = part.value || "false";
-      field.value = (
-        boolString[0].toLowerCase() === "t"
-        || boolString[0].toLowerCase() === "y"
-        || boolString[0] === "1"
-      );
-    }
-    else if (field.type === "number") {
-      field.value = Number(part.value as string || "0");
-      if (isNaN(field.value)) {
-        error = true;
-        return initFieldsError(`Invalid query filter; invalid number value "${(part.value || "").toString()}"`);
-      }
-    }
-    else if (field.type === "date") {
-      field.value = part.value as string || "";
-      const date = new Date(field.value);
-      if (isNaN(date.getTime())) {
-        error = true;
-        return initFieldsError(`Invalid query filter; invalid date value "${(part.value || "").toString()}"`);
-      }
-    }
-    else {
-      field.value = part.value as string || "";
-    }
-
-    initFields.push(field);
-  }
-
-  if (initFields.length && !error) {
-    fields.value = initFields;
-  }
-  else {
-    initFieldsError();
-  }
-}
-
-onMounted(async () => {
-  try {
-    await initializeFields();
-  }
-  catch (error) {
-    initFieldsError(`Error initializing fields: ${(error || "").toString()}`);
-  }
-});
-
-function buildQueryFilterJSON(): QueryFilterJSON {
-  const parts = fields.value.map((field) => {
-    const part: QueryFilterJSONPart = {
-      attributeName: field.name,
-      leftParenthesis: field.leftParenthesis,
-      rightParenthesis: field.rightParenthesis,
-      logicalOperator: field.logicalOperator?.value,
-      relationalOperator: field.relationalOperatorValue?.value,
-    };
-
-    if (field.fieldChoices?.length || isOrganizerType(field.type)) {
-      part.value = field.values.map(value => value.toString());
-    }
-    else if (field.type === "boolean") {
-      part.value = field.value ? "true" : "false";
-    }
-    else {
-      part.value = (field.value || "").toString();
-    }
-
-    return part;
-  });
-
-  const qfJSON = { parts } as QueryFilterJSON;
-  console.debug(`Built query filter JSON: ${JSON.stringify(qfJSON)}`);
-  return qfJSON;
-}
-
-function safeNewDate(input: string): Date {
-  const date = new Date(input);
-  if (isNaN(date.getTime())) {
-    const today = new Date();
-    today.setHours(0, 0, 0, 0);
-    return today;
-  }
-  return date;
-}
-
-/**
- * Parse a relative date string offset (e.g. $NOW-30d --> 30)
- *
- * Currently only values with a negative offset ('-') and a unit of days ('d') are supported
- */
-function parseRelativeDateOffset(value: string): number {
-  const defaultVal = 30;
-  if (!value) {
-    return defaultVal;
-  }
-
-  try {
-    if (!value.startsWith(placeholderKeywords.value["$NOW"].value)) {
-      return defaultVal;
-    }
-
-    const remainder = value.slice(placeholderKeywords.value["$NOW"].value.length);
-    if (!remainder.startsWith("-")) {
-      throw new Error("Invalid operator (not '-')");
-    }
-
-    if (remainder.slice(-1) !== "d") {
-      throw new Error("Invalid unit (not 'd')");
-    }
-
-    // Slice off sign and unit
-    return parseInt(remainder.slice(1, -1));
-  }
-  catch (error) {
-    console.warn(`Unable to parse relative date offset from '${value}': ${error}`);
-    return defaultVal;
-  }
-}
-
-const config = computed(() => {
-  const multiple = fields.value.length > 1;
-  const adv = state.showAdvanced;
-
-  return {
-    col: {
-      class: "d-flex justify-center align-end py-0",
-    },
-    select: {
-      textClass: "d-flex justify-center text-center",
-    },
-    items: {
-      icon: {
-        cols: (_index: number) => 2,
-        sm: (_index: number) => 1,
-        style: "width: fit-content;",
-      },
-      leftParens: {
-        cols: (index: number) => (adv ? (index === 0 ? 2 : 0) : 0),
-        sm: (_index: number) => (adv ? 1 : 0),
-      },
-      logicalOperator: {
-        cols: (_index: number) => 0,
-        sm: (_index: number) => (multiple ? 1 : 0),
-      },
-      fieldName: {
-        cols: (index: number) => {
-          if (adv) return index === 0 ? 8 : 12;
-          return index === 0 ? 10 : 12;
-        },
-        sm: (_index: number) => (adv ? 2 : 3),
-      },
-      relationalOperator: {
-        cols: (_index: number) => 12,
-        sm: (_index: number) => 2,
-      },
-      fieldValue: {
-        cols: (index: number) => {
-          const last = index === fields.value.length - 1;
-          if (adv) return last ? 8 : 10;
-          return last ? 10 : 12;
-        },
-        sm: (_index: number) => (adv ? 3 : 4),
-      },
-      rightParens: {
-        cols: (index: number) => (adv ? (index === fields.value.length - 1 ? 2 : 0) : 0),
-        sm: (_index: number) => (adv ? 1 : 0),
-      },
-      fieldActions: {
-        cols: (index: number) => (index === fields.value.length - 1 ? 2 : 0),
-        sm: (_index: number) => 1,
-      },
-    },
-  };
-});
-</script>
-
-<style scoped>
-* {
-  font-size: 1em;
-  --bg-opactity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
-}
-
-.bg-dark {
-  background-color: rgba(0, 0, 0, var(--bg-opactity));
-}
-
-.bg-light {
-  background-color: rgba(255, 255, 255, var(--bg-opactity));
-}
-
-:deep(.date-input input) {
-  text-align: end;
-  padding-right: 6px;
-}
-
-:deep(.date-input .v-field__field) {
-  align-items: center;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeCard.vue

@@ -1,168 +0,0 @@
-<template>
-  <!-- Wrap v-hover with a div to provide a proper DOM element for the transition -->
-  <div>
-    <v-hover
-      v-slot="{ isHovering, props: hoverProps }"
-      :open-delay="50"
-    >
-      <v-card
-        v-bind="hoverProps"
-        :class="{ 'on-hover': isHovering }"
-        :style="{ cursor }"
-        :elevation="isHovering ? 12 : 2"
-        :to="recipeRoute"
-        :min-height="imageHeight + 75"
-        @click.self="$emit('click')"
-      >
-        <RecipeCardImage
-          small
-          :icon-size="imageHeight"
-          :height="imageHeight"
-          :slug="slug"
-          :recipe-id="recipeId"
-          :image-version="image"
-        >
-          <v-expand-transition v-if="description">
-            <div
-              v-if="isHovering"
-              class="d-flex transition-fast-in-fast-out bg-secondary v-card--reveal"
-              style="height: 100%"
-            >
-              <v-card-text class="v-card--text-show white--text">
-                <div class="descriptionWrapper">
-                  <SafeMarkdown :source="description" />
-                </div>
-              </v-card-text>
-            </div>
-          </v-expand-transition>
-        </RecipeCardImage>
-        <v-card-title class="mb-n3 px-4" style="font-size: 1.25rem;">
-          {{ name }}
-        </v-card-title>
-
-        <slot name="actions">
-          <v-card-actions
-            v-if="showRecipeContent"
-            class="px-1"
-          >
-            <RecipeFavoriteBadge
-              v-if="isOwnGroup"
-              :recipe-id="recipeId"
-              show-always
-            />
-            <div v-else class="px-1" /> <!-- Empty div to keep the layout consistent -->
-
-            <RecipeCardRating
-              :model-value="rating"
-              :recipe-id="recipeId"
-            />
-            <v-spacer />
-            <RecipeChips
-              :truncate="true"
-              :items="tags"
-              :title="false"
-              :limit="2"
-              small
-              url-prefix="tags"
-              v-bind="$attrs"
-            />
-
-            <!-- If we're not logged-in, no items display, so we hide this menu -->
-            <RecipeContextMenu
-              v-if="isOwnGroup && showRecipeContent"
-              color="grey-darken-2"
-              :slug="slug"
-              :menu-icon="$globals.icons.dotsVertical"
-              :name="name"
-              :recipe-id="recipeId"
-              :use-items="{
-                delete: false,
-                edit: false,
-                download: true,
-                mealplanner: true,
-                shoppingList: true,
-                print: false,
-                printPreferences: false,
-                share: true,
-              }"
-              @deleted="$emit('delete', slug)"
-            />
-          </v-card-actions>
-        </slot>
-        <slot />
-      </v-card>
-    </v-hover>
-  </div>
-</template>
-
-<script setup lang="ts">
-import RecipeFavoriteBadge from "./RecipeFavoriteBadge.vue";
-import RecipeChips from "./RecipeChips.vue";
-import RecipeContextMenu from "./RecipeContextMenu/RecipeContextMenu.vue";
-import RecipeCardImage from "./RecipeCardImage.vue";
-import RecipeCardRating from "./RecipeCardRating.vue";
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-
-interface Props {
-  name: string;
-  slug: string;
-  description?: string | null;
-  rating?: number;
-  ratingColor?: string;
-  image?: string;
-  tags?: Array<any>;
-  recipeId: string;
-  imageHeight?: number;
-}
-const props = withDefaults(defineProps<Props>(), {
-  description: null,
-  rating: 0,
-  ratingColor: "secondary",
-  image: "abc123",
-  tags: () => [],
-  imageHeight: 200,
-});
-
-defineEmits<{
-  click: [];
-  delete: [slug: string];
-}>();
-
-const auth = useMealieAuth();
-const { isOwnGroup } = useLoggedInState();
-
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug || auth.user.value?.groupSlug || "");
-const showRecipeContent = computed(() => props.recipeId && props.slug);
-const recipeRoute = computed<string>(() => {
-  return showRecipeContent.value ? `/g/${groupSlug.value}/r/${props.slug}` : "";
-});
-const cursor = computed(() => showRecipeContent.value ? "pointer" : "auto");
-</script>
-
-<style>
-.v-card--reveal {
-  align-items: center;
-  bottom: 0;
-  justify-content: center;
-  opacity: 0.8;
-  position: absolute;
-  width: 100%;
-}
-.v-card--text-show {
-  opacity: 1 !important;
-}
-.headerClass {
-  white-space: nowrap;
-  word-break: normal;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.descriptionWrapper {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 8;
-  line-clamp: 8;
-  overflow: hidden;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeCardImage.vue

@@ -1,105 +0,0 @@
-<template>
-  <v-img
-    v-if="!fallBackImage"
-    :height="height"
-    cover
-    min-height="125"
-    max-height="fill-height"
-    :src="getImage(recipeId)"
-    @click="$emit('click')"
-    @load="fallBackImage = false"
-    @error="fallBackImage = true"
-  >
-    <slot />
-  </v-img>
-  <div
-    v-else
-    class="icon-slot"
-    @click="$emit('click')"
-  >
-    <v-icon
-      color="primary"
-      class="icon-position"
-      :size="iconSize"
-    >
-      {{ $globals.icons.primary }}
-    </v-icon>
-    <slot />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useStaticRoutes } from "~/composables/api";
-
-interface Props {
-  tiny?: boolean | null;
-  small?: boolean | null;
-  large?: boolean | null;
-  iconSize?: number | string;
-  slug?: string | null;
-  recipeId: string;
-  imageVersion?: string | null;
-  height?: number | string;
-}
-const props = withDefaults(defineProps<Props>(), {
-  tiny: null,
-  small: null,
-  large: null,
-  iconSize: 100,
-  slug: null,
-  imageVersion: null,
-  height: "100%",
-});
-
-defineEmits<{
-  click: [];
-}>();
-
-const { recipeImage, recipeSmallImage, recipeTinyImage } = useStaticRoutes();
-
-const fallBackImage = ref(false);
-const imageSize = computed(() => {
-  if (props.tiny) return "tiny";
-  if (props.small) return "small";
-  if (props.large) return "large";
-  return "large";
-});
-
-watch(
-  () => props.recipeId,
-  () => {
-    fallBackImage.value = false;
-  },
-);
-
-function getImage(recipeId: string) {
-  switch (imageSize.value) {
-    case "tiny":
-      return recipeTinyImage(recipeId, props.imageVersion);
-    case "small":
-      return recipeSmallImage(recipeId, props.imageVersion);
-    case "large":
-      return recipeImage(recipeId, props.imageVersion);
-  }
-}
-</script>
-
-<style scoped>
-.icon-slot {
-  position: relative;
-}
-
-.icon-slot > div {
-  top: 0;
-  position: absolute;
-  z-index: 1;
-}
-
-.icon-position {
-  opacity: 0.8;
-  display: flex !important;
-  position: relative;
-  margin-left: auto !important;
-  margin-right: auto !important;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeCardRating.vue

@@ -1,101 +0,0 @@
-<template>
-  <div class="rating-display">
-    <span
-      v-for="(star, index) in ratingDisplay"
-      :key="index"
-      class="star"
-      :class="{
-        'star-half': star === 'half',
-        'text-secondary': !useGroupStyle,
-        'text-grey-darken-1': useGroupStyle,
-      }"
-    >
-      <!-- We render both the full and empty stars for "half" stars because they're layered over each other -->
-      <span
-        v-if="star === 'empty' || star === 'half'"
-        class="star-empty"
-      >
-        ☆
-      </span>
-      <span
-        v-if="star === 'full' || star === 'half'"
-        class="star-full"
-      >
-        ★
-      </span>
-    </span>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-import { useUserSelfRatings } from "~/composables/use-users";
-
-type Star = "full" | "half" | "empty";
-
-const props = defineProps({
-  modelValue: {
-    type: Number,
-    default: 0,
-  },
-  recipeId: {
-    type: String,
-    default: "",
-  },
-});
-
-const { isOwnGroup } = useLoggedInState();
-const { userRatings } = useUserSelfRatings();
-
-const userRating = computed(() => {
-  return userRatings.value.find(r => r.recipeId === props.recipeId)?.rating ?? undefined;
-});
-
-const ratingValue = computed(() => userRating.value || props.modelValue || 0);
-const useGroupStyle = computed(() => isOwnGroup.value && !userRating.value && props.modelValue);
-const ratingDisplay = computed<Star[]>(
-  () => {
-    const stars: Star[] = [];
-
-    for (let i = 0; i < 5; i++) {
-      const diff = ratingValue.value - i;
-      if (diff >= 1) {
-        stars.push("full");
-      }
-      else if (diff >= 0.25) { // round to half star if rating is at least 0.25 but not quite a full star
-        stars.push("half");
-      }
-      else {
-        stars.push("empty");
-      }
-    }
-
-    return stars;
-  },
-);
-</script>
-
-<style lang="scss" scoped>
-.rating-display {
-  display: inline-flex;
-  align-items: center;
-  gap: 1px;
-
-  .star {
-    font-size: 18px;
-    transition: color 0.2s ease;
-    user-select: none;
-    position: relative;
-    display: inline-block;
-    &.star-half {
-      .star-full {
-        position: absolute;
-        left: 0;
-        top: 0;
-        width: 50%;
-        overflow: hidden;
-      }
-    }
-  }
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeCardSection.vue

@@ -1,465 +0,0 @@
-<template>
-  <div>
-    <v-row
-      v-if="!disableToolbar"
-      class="align-center pb-2"
-    >
-      <v-icon
-        v-if="title"
-        size="large"
-        start
-      >
-        {{ displayTitleIcon }}
-      </v-icon>
-      <span class="text-headline-small">{{ title }}</span>
-      <v-spacer />
-      <v-btn
-        :icon="$vuetify.display.xs"
-        variant="text"
-        :disabled="recipes.length === 0"
-        @click="navigateRandom"
-      >
-        <v-icon :start="!$vuetify.display.xs">
-          {{ $globals.icons.diceMultiple }}
-        </v-icon>
-        {{ $vuetify.display.xs ? null : $t("general.random") }}
-      </v-btn>
-      <v-menu
-        v-if="!disableSort"
-        offset-y
-        start
-      >
-        <template #activator="{ props: activatorProps }">
-          <v-btn
-            variant="text"
-            :icon="$vuetify.display.xs"
-            v-bind="activatorProps"
-            :loading="sortLoading"
-          >
-            <v-icon :start="!$vuetify.display.xs">
-              {{ preferences.sortIcon }}
-            </v-icon>
-            {{ $vuetify.display.xs ? null : $t("general.sort") }}
-          </v-btn>
-        </template>
-        <v-list>
-          <v-list-item @click="sortRecipes(EVENTS.az)">
-            <div class="d-flex align-center flex-nowrap">
-              <v-icon class="mr-2" inline>
-                {{ $globals.icons.orderAlphabeticalAscending }}
-              </v-icon>
-              <v-list-item-title>{{ $t("general.sort-alphabetically") }}</v-list-item-title>
-            </div>
-          </v-list-item>
-          <v-list-item @click="sortRecipes(EVENTS.rating)">
-            <div class="d-flex align-center flex-nowrap">
-              <v-icon class="mr-2" inline>
-                {{ $globals.icons.star }}
-              </v-icon>
-              <v-list-item-title>{{ $t("general.rating") }}</v-list-item-title>
-            </div>
-          </v-list-item>
-          <v-list-item @click="sortRecipes(EVENTS.created)">
-            <div class="d-flex align-center flex-nowrap">
-              <v-icon class="mr-2" inline>
-                {{ $globals.icons.newBox }}
-              </v-icon>
-              <v-list-item-title>{{ $t("general.created") }}</v-list-item-title>
-            </div>
-          </v-list-item>
-          <v-list-item @click="sortRecipes(EVENTS.updated)">
-            <div class="d-flex align-center flex-nowrap">
-              <v-icon class="mr-2" inline>
-                {{ $globals.icons.update }}
-              </v-icon>
-              <v-list-item-title>{{ $t("general.updated") }}</v-list-item-title>
-            </div>
-          </v-list-item>
-          <v-list-item @click="sortRecipes(EVENTS.lastMade)">
-            <div class="d-flex align-center flex-nowrap">
-              <v-icon class="mr-2" inline>
-                {{ $globals.icons.chefHat }}
-              </v-icon>
-              <v-list-item-title>{{ $t("general.last-made") }}</v-list-item-title>
-            </div>
-          </v-list-item>
-          <v-list-item @click="sortRecipes(EVENTS.shuffle)">
-            <div class="d-flex align-center flex-nowrap">
-              <v-icon class="mr-2" inline>
-                {{ $globals.icons.diceMultiple }}
-              </v-icon>
-              <v-list-item-title>{{ $t("general.random") }}</v-list-item-title>
-            </div>
-          </v-list-item>
-        </v-list>
-      </v-menu>
-      <ContextMenu
-        v-if="!$vuetify.display.smAndDown"
-        :items="[
-          {
-            title: $t('general.toggle-view'),
-            icon: $globals.icons.eye,
-            event: 'toggle-dense-view',
-          },
-        ]"
-        @toggle-dense-view="toggleMobileCards()"
-      />
-    </v-row>
-    <div v-if="recipes && ready">
-      <div class="mt-2">
-        <v-row v-if="!useMobileCards">
-          <v-col
-            v-for="recipe in recipes"
-            :key="recipe.id!"
-            :sm="6"
-            :md="6"
-            :lg="4"
-            :xl="3"
-          >
-            <RecipeCard
-              :name="recipe.name!"
-              :description="recipe.description!"
-              :slug="recipe.slug!"
-              :rating="recipe.rating!"
-              :image="recipe.image!"
-              :tags="recipe.tags!"
-              :recipe-id="recipe.id!"
-            />
-          </v-col>
-        </v-row>
-        <v-row
-          v-else
-          density="comfortable"
-        >
-          <v-col
-            v-for="recipe in recipes"
-            :key="recipe.id!"
-            cols="12"
-            :sm="singleColumn ? '12' : '12'"
-            :md="singleColumn ? '12' : '6'"
-            :lg="singleColumn ? '12' : '4'"
-            :xl="singleColumn ? '12' : '3'"
-          >
-            <RecipeCardMobile
-              :name="recipe.name!"
-              :description="recipe.description!"
-              :slug="recipe.slug!"
-              :rating="recipe.rating!"
-              :image="recipe.image!"
-              :tags="recipe.tags!"
-              :recipe-id="recipe.id!"
-            />
-          </v-col>
-        </v-row>
-      </div>
-      <v-card v-intersect="infiniteScroll" variant="flat" />
-    </div>
-    <v-fade-transition>
-      <AppLoader
-        v-if="loading"
-        :loading="loading"
-      />
-    </v-fade-transition>
-    <AppScrollToTop />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useThrottleFn } from "@vueuse/core";
-import RecipeCard from "./RecipeCard.vue";
-import RecipeCardMobile from "./RecipeCardMobile.vue";
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-import { useLazyRecipes } from "~/composables/recipes";
-import type { Recipe } from "~/lib/api/types/recipe";
-import { useUserSortPreferences } from "~/composables/use-users/preferences";
-import type { RecipeSearchQuery } from "~/lib/api/user/recipes/recipe";
-
-const REPLACE_RECIPES_EVENT = "replaceRecipes";
-const APPEND_RECIPES_EVENT = "appendRecipes";
-
-interface Props {
-  disableToolbar?: boolean;
-  disableSort?: boolean;
-  icon?: string | null;
-  title?: string | null;
-  singleColumn?: boolean;
-  recipes?: Recipe[];
-  query?: RecipeSearchQuery | null;
-}
-const props = withDefaults(defineProps<Props>(), {
-  disableToolbar: false,
-  disableSort: false,
-  icon: null,
-  title: null,
-  singleColumn: false,
-  recipes: () => [],
-  query: null,
-});
-
-const emit = defineEmits<{
-  replaceRecipes: [recipes: Recipe[]];
-  appendRecipes: [recipes: Recipe[]];
-}>();
-
-const display = useDisplay();
-const preferences = useUserSortPreferences();
-
-const EVENTS = {
-  az: "az",
-  rating: "rating",
-  created: "created",
-  updated: "updated",
-  lastMade: "lastMade",
-  shuffle: "shuffle",
-};
-
-const auth = useMealieAuth();
-const { $globals } = useNuxtApp();
-const { isOwnGroup } = useLoggedInState();
-const useMobileCards = computed(() => {
-  return display.smAndDown.value || preferences.value.useMobileCards;
-});
-
-const displayTitleIcon = computed(() => {
-  return props.icon || $globals.icons.tags;
-});
-
-const sortLoading = ref(false);
-const randomSeed = ref(Date.now().toString());
-
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
-
-const page = ref(1);
-const perPage = 32;
-const hasMore = ref(true);
-const ready = ref(false);
-const loading = ref(false);
-
-const { fetchMore, getRandom } = useLazyRecipes(isOwnGroup.value ? null : groupSlug.value);
-const { savePosition, getSavedPage, restorePosition } = useScrollPosition();
-const router = useRouter();
-
-const queryFilter = computed(() => {
-  return props.query?.queryFilter || null;
-
-  // TODO: allow user to filter out null values when ordering by a value that may be null (such as lastMade)
-
-  // const orderBy = props.query?.orderBy || preferences.value.orderBy;
-  // const orderByFilter = preferences.value.filterNull && orderBy ? `${orderBy} IS NOT NULL` : null;
-
-  // if (props.query.queryFilter && orderByFilter) {
-  //   return `(${props.query.queryFilter}) AND ${orderByFilter}`;
-  // } else if (props.query.queryFilter) {
-  //   return props.query.queryFilter;
-  // } else {
-  //   return orderByFilter;
-  // }
-});
-
-async function fetchRecipes(pageCount = 1) {
-  const orderDir = props.query?.orderDirection || preferences.value.orderDirection;
-  const orderByNullPosition = props.query?.orderByNullPosition || orderDir === "asc" ? "first" : "last";
-  const orderBy = props.query?.orderBy || preferences.value.orderBy;
-  const localQuery = { ...props.query };
-  if (orderBy === "random") {
-    localQuery._searchSeed = randomSeed.value;
-  }
-  return await fetchMore(
-    page.value,
-    perPage * pageCount,
-    orderBy,
-    orderDir,
-    orderByNullPosition,
-    localQuery,
-    // we use a computed queryFilter to filter out recipes that have a null value for the property we're sorting by
-    queryFilter.value,
-  );
-}
-
-onMounted(async () => {
-  loading.value = true;
-  const savedPage = getSavedPage(route.path);
-
-  if (savedPage && savedPage > 2) {
-    page.value = 1;
-    hasMore.value = true;
-    const newRecipes = await fetchRecipes(savedPage);
-    if (newRecipes.length < perPage * savedPage) {
-      hasMore.value = false;
-    }
-    page.value = savedPage;
-    emit(REPLACE_RECIPES_EVENT, newRecipes);
-    ready.value = true;
-    restorePosition(route.path);
-  }
-  else {
-    await initRecipes();
-    ready.value = true;
-    if (savedPage) {
-      restorePosition(route.path);
-    }
-  }
-  loading.value = false;
-});
-
-let lastQuery: string | undefined = JSON.stringify(props.query);
-watch(
-  () => props.query,
-  async (newValue: RecipeSearchQuery | undefined | null) => {
-    const newValueString = JSON.stringify(newValue);
-    if (lastQuery !== newValueString) {
-      lastQuery = newValueString;
-      ready.value = false;
-      await initRecipes();
-      ready.value = true;
-    }
-  },
-);
-
-async function initRecipes() {
-  if (preferences.value.orderBy === "random") {
-    randomSeed.value = Date.now().toString();
-  }
-  page.value = 1;
-  hasMore.value = true;
-
-  // we double-up the first call to avoid a bug with large screens that render
-  // the entire first page without scrolling, preventing additional loading
-  const newRecipes = await fetchRecipes(page.value + 1);
-  if (newRecipes.length < perPage) {
-    hasMore.value = false;
-  }
-
-  // since we doubled the first call, we also need to advance the page
-  page.value = page.value + 1;
-
-  emit(REPLACE_RECIPES_EVENT, newRecipes);
-}
-
-const infiniteScroll = useThrottleFn(async () => {
-  if (!hasMore.value || loading.value) {
-    return;
-  }
-
-  loading.value = true;
-  page.value = page.value + 1;
-
-  const newRecipes = await fetchRecipes();
-  if (newRecipes.length < perPage) {
-    hasMore.value = false;
-  }
-  if (newRecipes.length) {
-    emit(APPEND_RECIPES_EVENT, newRecipes);
-  }
-
-  savePosition(route.path, page.value);
-
-  loading.value = false;
-}, 500);
-
-async function sortRecipes(sortType: string) {
-  if (sortLoading.value || loading.value) {
-    return;
-  }
-
-  function setter(
-    orderBy: string,
-    ascIcon: string,
-    descIcon: string,
-    defaultOrderDirection = "asc",
-    filterNull = false,
-  ) {
-    if (preferences.value.orderBy !== orderBy) {
-      preferences.value.orderBy = orderBy;
-      preferences.value.orderDirection = defaultOrderDirection;
-      preferences.value.filterNull = filterNull;
-    }
-    else {
-      preferences.value.orderDirection = preferences.value.orderDirection === "asc" ? "desc" : "asc";
-    }
-    preferences.value.sortIcon = preferences.value.orderDirection === "asc" ? ascIcon : descIcon;
-  }
-
-  switch (sortType) {
-    case EVENTS.az:
-      setter(
-        "name",
-        $globals.icons.sortAlphabeticalAscending,
-        $globals.icons.sortAlphabeticalDescending,
-        "asc",
-        false,
-      );
-      break;
-    case EVENTS.rating:
-      setter("rating", $globals.icons.sortAscending, $globals.icons.sortDescending, "desc", true);
-      break;
-    case EVENTS.created:
-      setter(
-        "created_at",
-        $globals.icons.sortCalendarAscending,
-        $globals.icons.sortCalendarDescending,
-        "desc",
-        false,
-      );
-      break;
-    case EVENTS.updated:
-      setter("updated_at", $globals.icons.sortClockAscending, $globals.icons.sortClockDescending, "desc", false);
-      break;
-    case EVENTS.lastMade:
-      setter(
-        "last_made",
-        $globals.icons.sortCalendarAscending,
-        $globals.icons.sortCalendarDescending,
-        "desc",
-        true,
-      );
-      break;
-    case EVENTS.shuffle:
-      setter(
-        "random",
-        $globals.icons.diceMultiple,
-        $globals.icons.diceMultiple, // icon in asc and desc is the same for random
-      );
-      // We update the seed value to have a different order
-      randomSeed.value = Date.now().toString();
-      break;
-    default:
-      console.log("Unknown Event", sortType);
-      return;
-  }
-
-  // reset pagination
-  page.value = 1;
-  hasMore.value = true;
-
-  sortLoading.value = true;
-  loading.value = true;
-
-  // fetch new recipes
-  const newRecipes = await fetchRecipes();
-  emit(REPLACE_RECIPES_EVENT, newRecipes);
-
-  sortLoading.value = false;
-  loading.value = false;
-}
-
-async function navigateRandom() {
-  const recipe = await getRandom(props.query, queryFilter.value);
-  if (!recipe?.slug) {
-    return;
-  }
-
-  router.push(`/g/${groupSlug.value}/r/${recipe.slug}`);
-}
-
-function toggleMobileCards() {
-  preferences.value.useMobileCards = !preferences.value.useMobileCards;
-}
-</script>
-
-<style>
-.transparent {
-  opacity: 1;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeChips.vue

@@ -1,60 +0,0 @@
-<template>
-  <div v-if="items.length > 0">
-    <h2
-      v-if="title"
-      class="mt-4"
-    >
-      {{ title }}
-    </h2>
-    <v-chip
-      v-for="category in items.slice(0, limit)"
-      :key="category.name"
-      label
-      class="mr-1 mt-1"
-      color="accent"
-      variant="flat"
-      :size="small ? 'small' : 'default'"
-      dark
-
-      @click.prevent="() => $emit('item-selected', category, urlPrefix)"
-    >
-      {{ truncateText(category.name) }}
-    </v-chip>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { RecipeCategory, RecipeTag, RecipeTool } from "~/lib/api/types/recipe";
-
-export type UrlPrefixParam = "tags" | "categories" | "tools";
-
-interface Props {
-  truncate?: boolean;
-  items?: RecipeCategory[] | RecipeTag[] | RecipeTool[];
-  title?: boolean;
-  urlPrefix?: UrlPrefixParam;
-  limit?: number;
-  small?: boolean;
-  maxWidth?: string | null;
-}
-const props = withDefaults(defineProps<Props>(), {
-  truncate: false,
-  items: () => [],
-  title: false,
-  urlPrefix: "categories",
-  limit: 999,
-  small: false,
-  maxWidth: null,
-});
-
-defineEmits(["item-selected"]);
-function truncateText(text: string, length = 20, clamp = "...") {
-  if (!props.truncate) return text;
-  const node = document.createElement("div");
-  node.innerHTML = text;
-  const content = node.textContent || "";
-  return content.length > length ? content.slice(0, length) + clamp : content;
-}
-</script>
-
-<style></style>

frontend/app/components/Domain/Recipe/RecipeContextMenu/RecipeContextMenu.vue

@@ -1,137 +0,0 @@
-<template>
-  <div class="text-center">
-    <v-menu
-      offset-y
-      start
-      :eager="isMenuContentLoaded"
-      :bottom="!menuTop"
-      :nudge-bottom="!menuTop ? '5' : '0'"
-      :top="menuTop"
-      :nudge-top="menuTop ? '5' : '0'"
-      allow-overflow
-      close-delay="125"
-      content-class="d-print-none"
-      @update:model-value="onMenuToggle"
-    >
-      <template #activator="{ props: activatorProps }">
-        <v-btn
-          icon
-          :variant="fab ? 'flat' : undefined"
-          :rounded="fab ? 'circle' : undefined"
-          :size="fab ? 'small' : undefined"
-          :color="fab ? 'info' : 'secondary'"
-          :fab="fab"
-          v-bind="activatorProps"
-          @click.prevent
-        >
-          <v-icon
-            :size="!fab ? undefined : 'x-large'"
-            :color="fab ? 'white' : 'secondary'"
-          >
-            {{ icon }}
-          </v-icon>
-        </v-btn>
-      </template>
-
-      <RecipeContextMenuContent
-        v-if="isMenuContentLoaded"
-        v-bind="contentProps"
-        @print="$emit('print')"
-        @deleted="$emit('deleted', $event)"
-      />
-    </v-menu>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { Recipe } from "~/lib/api/types/recipe";
-
-interface ContextMenuIncludes {
-  delete?: boolean;
-  edit?: boolean;
-  download?: boolean;
-  duplicate?: boolean;
-  mealplanner?: boolean;
-  shoppingList?: boolean;
-  print?: boolean;
-  printPreferences?: boolean;
-  share?: boolean;
-  recipeActions?: boolean;
-}
-
-interface ContextMenuItem {
-  title: string;
-  icon: string;
-  color?: string;
-  event: string;
-  isPublic: boolean;
-}
-
-interface Props {
-  useItems?: ContextMenuIncludes;
-  appendItems?: ContextMenuItem[];
-  leadingItems?: ContextMenuItem[];
-  menuTop?: boolean;
-  fab?: boolean;
-  color?: string;
-  slug: string;
-  menuIcon?: string | null;
-  name: string;
-  recipe?: Recipe;
-  recipeId: string;
-  recipeScale?: number;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  useItems: () => ({
-    delete: true,
-    edit: true,
-    download: true,
-    duplicate: false,
-    mealplanner: true,
-    shoppingList: true,
-    print: true,
-    printPreferences: true,
-    share: true,
-    recipeActions: true,
-  }),
-  appendItems: () => [],
-  leadingItems: () => [],
-  menuTop: true,
-  fab: false,
-  color: "primary",
-  menuIcon: null,
-  recipe: undefined,
-  recipeScale: 1,
-});
-
-defineEmits<{
-  [key: string]: any;
-  print: [];
-  deleted: [slug: string];
-}>();
-
-const { $globals } = useNuxtApp();
-
-const isMenuContentLoaded = ref(false);
-
-const icon = computed(() => {
-  return props.menuIcon || $globals.icons.dotsVertical;
-});
-
-// Props to pass to the content component (excluding internal wrapper props)
-const contentProps = computed(() => {
-  const { ...rest } = props;
-  return rest;
-});
-
-function onMenuToggle(isOpen: boolean) {
-  if (isOpen && !isMenuContentLoaded.value) {
-    isMenuContentLoaded.value = true;
-  }
-}
-
-const RecipeContextMenuContent = defineAsyncComponent(
-  () => import("./RecipeContextMenuContent.vue"),
-);
-</script>

frontend/app/components/Domain/Recipe/RecipeContextMenu/RecipeContextMenuContent.vue

@@ -1,448 +0,0 @@
-<template>
-  <RecipeDialogShare v-model="shareDialog" :recipe-id="recipeId" :name="name" />
-  <RecipeDialogPrintPreferences v-model="printPreferencesDialog" :recipe="recipeRef" />
-  <BaseDialog
-    v-model="recipeDeleteDialog"
-    :title="$t('recipe.delete-recipe')"
-    color="error"
-    :icon="$globals.icons.alertCircle"
-    can-confirm
-    @confirm="deleteRecipe()"
-  >
-    <v-card-text>
-      <template v-if="isAdminAndNotOwner">
-        {{ $t("recipe.admin-delete-confirmation") }}
-      </template>
-      <template v-else>
-        {{ $t("recipe.delete-confirmation") }}
-      </template>
-    </v-card-text>
-  </BaseDialog>
-  <BaseDialog
-    v-model="recipeDuplicateDialog"
-    :title="$t('recipe.duplicate')"
-    color="primary"
-    :icon="$globals.icons.duplicate"
-    can-confirm
-    @confirm="duplicateRecipe()"
-  >
-    <v-card-text>
-      <v-text-field
-        v-model="recipeName"
-        density="compact"
-        :label="$t('recipe.recipe-name')"
-        autofocus
-        @keyup.enter="duplicateRecipe()"
-      />
-    </v-card-text>
-  </BaseDialog>
-  <BaseDialog
-    v-model="mealplannerDialog"
-    :title="$t('recipe.add-recipe-to-mealplan')"
-    color="primary"
-    :icon="$globals.icons.calendar"
-    can-confirm
-    @confirm="addRecipeToPlan()"
-  >
-    <v-card-text>
-      <v-date-picker
-        v-model="newMealdate"
-        class="mx-auto mb-3"
-        hide-header
-        show-adjacent-months
-        color="primary"
-        :first-day-of-week="firstDayOfWeek"
-        :local="$i18n.locale"
-      />
-      <v-select
-        v-model="newMealType"
-        :return-object="false"
-        :items="planTypeOptions"
-        :label="$t('recipe.entry-type')"
-        item-title="text"
-        item-value="value"
-      />
-    </v-card-text>
-  </BaseDialog>
-  <RecipeDialogAddToShoppingList
-    v-if="shoppingLists && recipeRefWithScale"
-    v-model="shoppingListDialog"
-    :recipes="[recipeRefWithScale]"
-    :shopping-lists="shoppingLists"
-  />
-
-  <v-list density="compact">
-    <v-list-item v-for="(item, index) in menuItems" :key="index" @click="contextMenuEventHandler(item.event)">
-      <template #prepend>
-        <v-icon :color="item.color">
-          {{ item.icon }}
-        </v-icon>
-      </template>
-      <v-list-item-title>{{ item.title }}</v-list-item-title>
-    </v-list-item>
-    <div v-if="useItems.recipeActions && recipeActions && recipeActions.length">
-      <v-divider />
-      <v-list-item
-        v-for="(action, index) in recipeActions"
-        :key="index"
-        @click="executeRecipeAction(action)"
-      >
-        <template #prepend>
-          <v-icon color="undefined">
-            {{ $globals.icons.linkVariantPlus }}
-          </v-icon>
-        </template>
-        <v-list-item-title>
-          {{ action.title }}
-        </v-list-item-title>
-      </v-list-item>
-    </div>
-  </v-list>
-</template>
-
-<script setup lang="ts">
-import RecipeDialogAddToShoppingList from "~/components/Domain/Recipe/RecipeDialogAddToShoppingList.vue";
-import RecipeDialogPrintPreferences from "~/components/Domain/Recipe/RecipeDialogPrintPreferences.vue";
-import RecipeDialogShare from "~/components/Domain/Recipe/RecipeDialogShare.vue";
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-import { useUserApi } from "~/composables/api";
-import { useGroupRecipeActions } from "~/composables/use-group-recipe-actions";
-import { useHouseholdSelf } from "~/composables/use-households";
-import { alert } from "~/composables/use-toast";
-import { usePlanTypeOptions } from "~/composables/use-group-mealplan";
-import type { Recipe } from "~/lib/api/types/recipe";
-import type { GroupRecipeActionOut, ShoppingListSummary } from "~/lib/api/types/household";
-import type { PlanEntryType } from "~/lib/api/types/meal-plan";
-import { useDownloader } from "~/composables/api/use-downloader";
-
-export interface ContextMenuIncludes {
-  delete: boolean;
-  edit: boolean;
-  download: boolean;
-  duplicate: boolean;
-  mealplanner: boolean;
-  shoppingList: boolean;
-  print: boolean;
-  printPreferences: boolean;
-  share: boolean;
-  recipeActions: boolean;
-}
-
-export interface ContextMenuItem {
-  title: string;
-  icon: string;
-  color: string | undefined;
-  event: string;
-  isPublic: boolean;
-}
-
-interface Props {
-  useItems?: ContextMenuIncludes;
-  appendItems?: ContextMenuItem[];
-  leadingItems?: ContextMenuItem[];
-  menuTop?: boolean;
-  fab?: boolean;
-  color?: string;
-  slug: string;
-  menuIcon?: string | null;
-  name: string;
-  recipe?: Recipe;
-  recipeId: string;
-  recipeScale?: number;
-}
-const props = withDefaults(defineProps<Props>(), {
-  useItems: () => ({
-    delete: true,
-    edit: true,
-    download: true,
-    duplicate: false,
-    mealplanner: true,
-    shoppingList: true,
-    print: true,
-    printPreferences: true,
-    share: true,
-    recipeActions: true,
-  }),
-  appendItems: () => [],
-  leadingItems: () => [],
-  menuTop: true,
-  fab: false,
-  color: "primary",
-  menuIcon: null,
-  recipe: undefined,
-  recipeScale: 1,
-});
-
-const emit = defineEmits<{
-  [key: string]: any;
-  deleted: [slug: string];
-  print: [];
-}>();
-
-const api = useUserApi();
-
-const printPreferencesDialog = ref(false);
-const shareDialog = ref(false);
-const recipeDeleteDialog = ref(false);
-const mealplannerDialog = ref(false);
-const shoppingListDialog = ref(false);
-const recipeDuplicateDialog = ref(false);
-const recipeName = ref(props.name);
-const loading = ref(false);
-const menuItems = ref<ContextMenuItem[]>([]);
-const newMealdate = ref(new Date());
-const newMealType = ref<PlanEntryType>("dinner");
-
-const newMealdateString = computed(() => {
-  // Format the date to YYYY-MM-DD in the same timezone as newMealdate
-  const year = newMealdate.value.getFullYear();
-  const month = String(newMealdate.value.getMonth() + 1).padStart(2, "0");
-  const day = String(newMealdate.value.getDate()).padStart(2, "0");
-  return `${year}-${month}-${day}`;
-});
-
-const i18n = useI18n();
-const auth = useMealieAuth();
-const { $globals } = useNuxtApp();
-const { household } = useHouseholdSelf();
-const { isOwnGroup } = useLoggedInState();
-
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug || auth.user.value?.groupSlug || "");
-
-const firstDayOfWeek = computed(() => {
-  return household.value?.preferences?.firstDayOfWeek || 0;
-});
-
-// ===========================================================================
-// Context Menu Setup
-
-const defaultItems: { [key: string]: ContextMenuItem } = {
-  edit: {
-    title: i18n.t("general.edit"),
-    icon: $globals.icons.edit,
-    color: undefined,
-    event: "edit",
-    isPublic: false,
-  },
-  delete: {
-    title: i18n.t("general.delete"),
-    icon: $globals.icons.delete,
-    color: undefined,
-    event: "delete",
-    isPublic: false,
-  },
-  download: {
-    title: i18n.t("general.download"),
-    icon: $globals.icons.download,
-    color: undefined,
-    event: "download",
-    isPublic: false,
-  },
-  duplicate: {
-    title: i18n.t("general.duplicate"),
-    icon: $globals.icons.duplicate,
-    color: undefined,
-    event: "duplicate",
-    isPublic: false,
-  },
-  mealplanner: {
-    title: i18n.t("recipe.add-to-plan"),
-    icon: $globals.icons.calendar,
-    color: undefined,
-    event: "mealplanner",
-    isPublic: false,
-  },
-  shoppingList: {
-    title: i18n.t("recipe.add-to-list"),
-    icon: $globals.icons.cartCheck,
-    color: undefined,
-    event: "shoppingList",
-    isPublic: false,
-  },
-  print: {
-    title: i18n.t("general.print"),
-    icon: $globals.icons.printer,
-    color: undefined,
-    event: "print",
-    isPublic: true,
-  },
-  printPreferences: {
-    title: i18n.t("general.print-preferences"),
-    icon: $globals.icons.printerSettings,
-    color: undefined,
-    event: "printPreferences",
-    isPublic: true,
-  },
-  share: {
-    title: i18n.t("general.share"),
-    icon: $globals.icons.shareVariant,
-    color: undefined,
-    event: "share",
-    isPublic: false,
-  },
-};
-
-// Add leading and Appending Items
-menuItems.value = [...menuItems.value, ...props.leadingItems, ...props.appendItems];
-
-// ===========================================================================
-// Context Menu Event Handler
-
-const shoppingLists = ref<ShoppingListSummary[]>();
-const recipeRef = ref<Recipe | undefined>(props.recipe);
-const recipeRefWithScale = computed(() =>
-  recipeRef.value ? { scale: props.recipeScale, ...recipeRef.value } : undefined,
-);
-const isAdminAndNotOwner = computed(() => {
-  return (
-    auth.user.value?.admin
-    && auth.user.value?.id !== recipeRef.value?.userId
-  );
-});
-const canDelete = computed(() => {
-  const user = auth.user.value;
-  const recipe = recipeRef.value;
-  return user && recipe && (user.admin || user.id === recipe.userId);
-});
-
-// Get Default Menu Items Specified in Props
-for (const [key, value] of Object.entries(props.useItems)) {
-  if (!value) continue;
-
-  // Skip delete if not allowed
-  if (key === "delete" && !canDelete.value) continue;
-
-  const item = defaultItems[key];
-  if (item && (item.isPublic || isOwnGroup.value)) {
-    menuItems.value.push(item);
-  }
-}
-
-async function getShoppingLists() {
-  const { data } = await api.shopping.lists.getAll(1, -1, { orderBy: "name", orderDirection: "asc" });
-  if (data) {
-    shoppingLists.value = data.items ?? [];
-  }
-}
-
-async function refreshRecipe() {
-  const { data } = await api.recipes.getOne(props.slug);
-  if (data) {
-    recipeRef.value = data;
-  }
-}
-
-const router = useRouter();
-const groupRecipeActionsStore = useGroupRecipeActions();
-
-async function executeRecipeAction(action: GroupRecipeActionOut) {
-  if (!props.recipe) return;
-  const response = await groupRecipeActionsStore.execute(action, props.recipe, props.recipeScale);
-
-  if (action.actionType === "post") {
-    if (!response?.error) {
-      alert.success(i18n.t("events.message-sent"));
-    }
-    else {
-      alert.error(i18n.t("events.something-went-wrong"));
-    }
-  }
-}
-
-async function deleteRecipe() {
-  const { data } = await api.recipes.deleteOne(props.slug);
-  if (data?.slug) {
-    router.push(`/g/${groupSlug.value}`);
-  }
-  emit("deleted", props.slug);
-}
-
-const download = useDownloader();
-
-async function handleDownloadEvent() {
-  const { data: shareToken } = await api.recipes.share.createOne({ recipeId: props.recipeId });
-  if (!shareToken) {
-    console.error("No share token received");
-    alert.error(i18n.t("events.something-went-wrong"));
-    return;
-  }
-
-  download(api.recipes.share.getZipRedirectUrl(shareToken.id), `${props.slug}.zip`);
-}
-
-async function addRecipeToPlan() {
-  const { response } = await api.mealplans.createOne({
-    date: newMealdateString.value,
-    entryType: newMealType.value,
-    title: "",
-    text: "",
-    recipeId: props.recipeId,
-  });
-
-  if (response?.status === 201) {
-    alert.success(i18n.t("recipe.recipe-added-to-mealplan") as string);
-  }
-  else {
-    alert.error(i18n.t("recipe.failed-to-add-recipe-to-mealplan") as string);
-  }
-}
-
-async function duplicateRecipe() {
-  const { data } = await api.recipes.duplicateOne(props.slug, recipeName.value);
-  if (data && data.slug) {
-    router.push(`/g/${groupSlug.value}/r/${data.slug}`);
-  }
-}
-
-// Note: Print is handled as an event in the parent component
-// eslint-disable-next-line @typescript-eslint/no-invalid-void-type
-const eventHandlers: { [key: string]: () => void | Promise<any> } = {
-  delete: () => {
-    recipeDeleteDialog.value = true;
-  },
-  edit: () => router.push(`/g/${groupSlug.value}/r/${props.slug}` + "?edit=true"),
-  download: handleDownloadEvent,
-  duplicate: () => {
-    recipeDuplicateDialog.value = true;
-  },
-  mealplanner: () => {
-    mealplannerDialog.value = true;
-  },
-  printPreferences: async () => {
-    if (!recipeRef.value) {
-      await refreshRecipe();
-    }
-    printPreferencesDialog.value = true;
-  },
-  shoppingList: () => {
-    const promises: Promise<void>[] = [getShoppingLists()];
-    if (!recipeRef.value) {
-      promises.push(refreshRecipe());
-    }
-
-    Promise.allSettled(promises).then(() => {
-      shoppingListDialog.value = true;
-    });
-  },
-  share: () => {
-    shareDialog.value = true;
-  },
-};
-
-function contextMenuEventHandler(eventKey: string) {
-  const handler = eventHandlers[eventKey];
-
-  if (handler && typeof handler === "function") {
-    handler();
-    loading.value = false;
-    return;
-  }
-
-  emit(eventKey);
-  loading.value = false;
-}
-
-const planTypeOptions = usePlanTypeOptions();
-const recipeActions = groupRecipeActionsStore.recipeActions;
-</script>

frontend/app/components/Domain/Recipe/RecipeDataAliasManagerDialog.vue

@@ -1,117 +0,0 @@
-<template>
-  <div>
-    <BaseDialog
-      v-model="dialog"
-      :title="$t('data-pages.manage-aliases')"
-      :icon="$globals.icons.edit"
-      :submit-icon="$globals.icons.check"
-      :submit-text="$t('general.confirm')"
-      can-submit
-      @submit="saveAliases"
-      @cancel="$emit('cancel')"
-    >
-      <v-card-text>
-        <v-container>
-          <v-row v-for="alias, i in aliases" :key="i">
-            <v-col cols="10">
-              <v-text-field v-model="alias.name" :label="$t('general.name')" :rules="[validators.required]" />
-            </v-col>
-            <v-col cols="2">
-              <BaseButtonGroup
-                :buttons="[
-                  {
-                    icon: $globals.icons.delete,
-                    text: $t('general.delete'),
-                    event: 'delete',
-                  },
-                ]"
-                @delete="deleteAlias(i)"
-              />
-            </v-col>
-          </v-row>
-        </v-container>
-      </v-card-text>
-      <template #custom-card-action>
-        <BaseButton edit @click="createAlias">
-          {{ $t('data-pages.create-alias') }}
-          <template #icon>
-            {{ $globals.icons.create }}
-          </template>
-        </BaseButton>
-      </template>
-    </BaseDialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { whenever } from "@vueuse/core";
-import { validators } from "~/composables/use-validators";
-import type { IngredientFood, IngredientUnit } from "~/lib/api/types/recipe";
-
-export interface GenericAlias {
-  name: string;
-}
-
-interface Props {
-  data: IngredientFood | IngredientUnit;
-}
-
-const props = defineProps<Props>();
-
-const emit = defineEmits<{
-  submit: [aliases: GenericAlias[]];
-  cancel: [];
-}>();
-
-// V-Model Support
-const dialog = defineModel<boolean>({ default: false });
-
-function createAlias() {
-  aliases.value.push({
-    name: "",
-  });
-}
-
-function deleteAlias(index: number) {
-  aliases.value.splice(index, 1);
-}
-
-const aliases = ref<GenericAlias[]>(props.data.aliases || []);
-function initAliases() {
-  aliases.value = [...props.data.aliases || []];
-  if (!aliases.value.length) {
-    createAlias();
-  }
-}
-
-initAliases();
-whenever(
-  () => dialog.value,
-  () => {
-    initAliases();
-  },
-);
-
-function saveAliases() {
-  const seenAliasNames: string[] = [];
-  const keepAliases: GenericAlias[] = [];
-  aliases.value.forEach((alias) => {
-    if (
-      !alias.name
-      || alias.name === props.data.name
-      || alias.name === props.data.pluralName
-      || alias.name === props.data.abbreviation
-      || alias.name === props.data.pluralAbbreviation
-      || seenAliasNames.includes(alias.name)
-    ) {
-      return;
-    }
-
-    keepAliases.push(alias);
-    seenAliasNames.push(alias.name);
-  });
-
-  aliases.value = keepAliases;
-  emit("submit", keepAliases);
-}
-</script>

frontend/app/components/Domain/Recipe/RecipeDataTable.vue

@@ -1,186 +0,0 @@
-<template>
-  <v-data-table
-    v-model="selected"
-    item-key="id"
-    show-select
-    :sort-by="sortBy"
-    :headers="headers"
-    :items="recipes"
-    :items-per-page="15"
-    class="elevation-0"
-    :loading="loading"
-    return-object
-  >
-    <template #[`item.name`]="{ item }">
-      <a
-        :href="`/g/${groupSlug}/r/${item.slug}`"
-        style="color: inherit; text-decoration: inherit; "
-        @click="$emit('click')"
-      >{{ item.name }}</a>
-    </template>
-    <template #[`item.tags`]="{ item }">
-      <RecipeChip
-        small
-        :items="item.tags!"
-        :is-category="false"
-        url-prefix="tags"
-        @item-selected="filterItems"
-      />
-    </template>
-    <template #[`item.recipeCategory`]="{ item }">
-      <RecipeChip
-        small
-        :items="item.recipeCategory!"
-        @item-selected="filterItems"
-      />
-    </template>
-    <template #[`item.tools`]="{ item }">
-      <RecipeChip
-        small
-        :items="item.tools"
-        url-prefix="tools"
-        @item-selected="filterItems"
-      />
-    </template>
-    <template #[`item.userId`]="{ item }">
-      <div class="d-flex align-center">
-        <UserAvatar
-          :user-id="item.userId!"
-          :tooltip="false"
-          size="40"
-        />
-        <div class="pl-2">
-          <span class="text-left">
-            {{ getMember(item.userId!) }}
-          </span>
-        </div>
-      </div>
-    </template>
-    <template #[`item.dateAdded`]="{ item }">
-      {{ item.dateAdded ? $d(new Date(item.dateAdded)) : '' }}
-    </template>
-  </v-data-table>
-</template>
-
-<script setup lang="ts">
-import UserAvatar from "../User/UserAvatar.vue";
-import RecipeChip from "./RecipeChips.vue";
-import type { Recipe, RecipeCategory, RecipeTool } from "~/lib/api/types/recipe";
-import { useUserApi } from "~/composables/api";
-import type { UserSummary } from "~/lib/api/types/user";
-import type { RecipeTag } from "~/lib/api/types/household";
-
-interface ShowHeaders {
-  id: boolean;
-  owner: boolean;
-  tags: boolean;
-  categories: boolean;
-  tools: boolean;
-  recipeServings: boolean;
-  recipeYieldQuantity: boolean;
-  recipeYield: boolean;
-  dateAdded: boolean;
-}
-
-interface Props {
-  loading?: boolean;
-  recipes?: Recipe[];
-  showHeaders?: ShowHeaders;
-}
-const props = withDefaults(defineProps<Props>(), {
-  loading: false,
-  recipes: () => [],
-  showHeaders: () => ({
-    id: true,
-    owner: false,
-    tags: true,
-    categories: true,
-    tools: true,
-    recipeServings: true,
-    recipeYieldQuantity: true,
-    recipeYield: true,
-    dateAdded: true,
-  }),
-});
-
-defineEmits<{
-  click: [];
-}>();
-
-const selected = defineModel<Recipe[]>({ default: () => [] });
-
-const i18n = useI18n();
-const auth = useMealieAuth();
-const groupSlug = auth.user.value?.groupSlug;
-const router = useRouter();
-
-// Initialize sort state with default sorting by dateAdded descending
-const sortBy = ref([{ key: "dateAdded", order: "desc" as const }]);
-
-const headers = computed(() => {
-  const hdrs: Array<{ title: string; value: string; align?: "center" | "start" | "end"; sortable?: boolean }> = [];
-
-  if (props.showHeaders.id) {
-    hdrs.push({ title: i18n.t("general.id"), value: "id" });
-  }
-  if (props.showHeaders.owner) {
-    hdrs.push({ title: i18n.t("general.owner"), value: "userId", align: "center", sortable: true });
-  }
-  hdrs.push({ title: i18n.t("general.name"), value: "name", sortable: true });
-  if (props.showHeaders.categories) {
-    hdrs.push({ title: i18n.t("recipe.categories"), value: "recipeCategory", sortable: true });
-  }
-
-  if (props.showHeaders.tags) {
-    hdrs.push({ title: i18n.t("tag.tags"), value: "tags", sortable: true });
-  }
-  if (props.showHeaders.tools) {
-    hdrs.push({ title: i18n.t("tool.tools"), value: "tools", sortable: true });
-  }
-  if (props.showHeaders.recipeServings) {
-    hdrs.push({ title: i18n.t("recipe.servings"), value: "recipeServings", sortable: true });
-  }
-  if (props.showHeaders.recipeYieldQuantity) {
-    hdrs.push({ title: i18n.t("recipe.yield"), value: "recipeYieldQuantity", sortable: true });
-  }
-  if (props.showHeaders.recipeYield) {
-    hdrs.push({ title: i18n.t("recipe.yield-text"), value: "recipeYield", sortable: true });
-  }
-  if (props.showHeaders.dateAdded) {
-    hdrs.push({ title: i18n.t("general.date-added"), value: "dateAdded", sortable: true });
-  }
-
-  return hdrs;
-});
-
-// ============
-// Group Members
-const api = useUserApi();
-const members = ref<UserSummary[]>([]);
-
-async function refreshMembers() {
-  const { data } = await api.groups.fetchMembers();
-  if (data) {
-    members.value = data.items;
-  }
-}
-
-function filterItems(item: RecipeTag | RecipeCategory | RecipeTool, itemType: string) {
-  if (!groupSlug || !item.id) {
-    return;
-  }
-  router.push(`/g/${groupSlug}?${itemType}=${item.id}`);
-}
-
-onMounted(() => {
-  refreshMembers();
-});
-
-function getMember(id: string) {
-  if (members.value[0]) {
-    return members.value.find(m => m.id === id)?.fullName;
-  }
-
-  return i18n.t("general.none");
-}
-</script>

frontend/app/components/Domain/Recipe/RecipeDialogAddToShoppingList.vue

@@ -1,480 +0,0 @@
-<template>
-  <div v-if="dialog">
-    <BaseDialog
-      v-if="shoppingListDialog && ready"
-      v-model="dialog"
-      :title="$t('recipe.add-to-list')"
-      :icon="$globals.icons.cartCheck"
-    >
-      <v-container v-if="!filteredShoppingLists.length">
-        <BasePageTitle>
-          <template #title>
-            {{ $t('shopping-list.no-shopping-lists-found') }}
-          </template>
-        </BasePageTitle>
-      </v-container>
-      <v-card-text>
-        <v-card
-          v-for="list in filteredShoppingLists"
-          :key="list.id"
-          hover
-          class="my-2 left-border"
-          @click="openShoppingListIngredientDialog(list)"
-        >
-          <v-card-title class="py-2">
-            {{ list.name }}
-          </v-card-title>
-        </v-card>
-      </v-card-text>
-      <template #card-actions>
-        <v-btn
-          variant="text"
-          color="grey"
-          @click="dialog = false"
-        >
-          {{ $t("general.cancel") }}
-        </v-btn>
-        <div
-          class="d-flex justify-end"
-          style="width: 100%;"
-        >
-          <v-checkbox
-            v-model="preferences.viewAllLists"
-            hide-details
-            :label="$t('general.show-all')"
-            class="my-auto mr-4"
-            @click="setShowAllToggled()"
-          />
-        </div>
-      </template>
-    </BaseDialog>
-    <BaseDialog
-      v-if="shoppingListIngredientDialog"
-      v-model="dialog"
-      :title="selectedShoppingList?.name || $t('recipe.add-to-list')"
-      :icon="$globals.icons.cartCheck"
-      width="70%"
-      :submit-text="$t('recipe.add-to-list')"
-      can-submit
-      @submit="addRecipesToList()"
-    >
-      <div style="max-height: 70vh;  overflow-y: auto">
-        <v-card
-          v-for="(recipeSection, recipeSectionIndex) in recipeIngredientSections"
-          :key="recipeSection.recipeId + recipeSectionIndex"
-          elevation="0"
-          height="fit-content"
-          width="100%"
-        >
-          <v-divider
-            v-if="recipeSectionIndex > 0"
-            class="mt-3"
-          />
-          <v-card-title
-            v-if="recipeIngredientSections.length > 1"
-            class="justify-center text-h5"
-            width="100%"
-          >
-            <v-container style="width: 100%;">
-              <v-row
-                no-gutters
-                class="ma-0 pa-0"
-              >
-                <v-col
-                  cols="12"
-                  align-self="center"
-                  class="text-center"
-                >
-                  {{ recipeSection.recipeName }}
-                  <v-tooltip v-if="recipeSection.parentRecipe?.name" location="top">
-                    <template #activator="{ props: tooltipProps }">
-                      <v-icon
-                        v-bind="tooltipProps"
-                        size="tiny"
-                        class="mb-2 ml-2"
-                        style="cursor: pointer"
-                      >
-                        {{ $globals.icons.potSteam }}
-                      </v-icon>
-                    </template>
-                    <span>{{ $t("shopping-list.ingredient-of-recipe", { recipe: recipeSection.parentRecipe.name }) }}</span>
-                  </v-tooltip>
-                </v-col>
-              </v-row>
-              <v-row
-                v-if="recipeSection.recipeScale > 1"
-                no-gutters
-                class="ma-0 pa-0"
-              >
-                <!-- TODO: make this editable in the dialog and visible on single-recipe lists -->
-                <v-col
-                  cols="12"
-                  align-self="center"
-                  class="text-center"
-                >
-                  ({{ $t("recipe.quantity") }}: {{ recipeSection.recipeScale }})
-                </v-col>
-              </v-row>
-            </v-container>
-          </v-card-title>
-          <div>
-            <div
-              v-for="(ingredientSection, ingredientSectionIndex) in recipeSection.ingredientSections"
-              :key="recipeSection.recipeId + recipeSectionIndex + ingredientSectionIndex"
-            >
-              <v-card-title
-                v-if="ingredientSection.sectionName"
-                class="ingredient-title mt-2 pb-0 text-h6"
-              >
-                {{ ingredientSection.sectionName }}
-              </v-card-title>
-              <div
-                :class="$vuetify.display.smAndDown ? '' : 'ingredient-grid'"
-                :style="$vuetify.display.smAndDown ? '' : { gridTemplateRows: `repeat(${Math.ceil(ingredientSection.ingredients.length / 2)}, min-content)` }"
-              >
-                <v-list-item
-                  v-for="(ingredientData, i) in ingredientSection.ingredients"
-                  :key="recipeSection.recipeId + recipeSectionIndex + ingredientSectionIndex + i"
-                  density="compact"
-                  @click="recipeIngredientSections[recipeSectionIndex]
-                    .ingredientSections[ingredientSectionIndex]
-                    .ingredients[i].checked = !recipeIngredientSections[recipeSectionIndex]
-                      .ingredientSections[ingredientSectionIndex]
-                      .ingredients[i]
-                      .checked"
-                >
-                  <v-container class="pa-0 ma-0">
-                    <v-row no-gutters>
-                      <v-checkbox
-                        hide-details
-                        :model-value="ingredientData.checked"
-                        class="pt-0 my-auto py-auto mr-2"
-                        color="secondary"
-                        density="compact"
-                      />
-                      <div :key="`${ingredientData.ingredient?.quantity || 'no-qty'}-${i}`" class="pa-auto my-auto">
-                        <RecipeIngredientListItem
-                          :ingredient="ingredientData.ingredient"
-                          :scale="recipeSection.recipeScale"
-                        />
-                      </div>
-                    </v-row>
-                  </v-container>
-                </v-list-item>
-              </div>
-            </div>
-          </div>
-        </v-card>
-      </div>
-      <div class="d-flex justify-end mb-4 mt-2">
-        <BaseButtonGroup
-          :buttons="[
-            {
-              icon: $globals.icons.checkboxBlankOutline,
-              text: $t('shopping-list.uncheck-all-items'),
-              event: 'uncheck',
-            },
-            {
-              icon: $globals.icons.checkboxOutline,
-              text: $t('shopping-list.check-all-items'),
-              event: 'check',
-            },
-          ]"
-          @uncheck="bulkCheckIngredients(false)"
-          @check="bulkCheckIngredients(true)"
-        />
-      </div>
-    </BaseDialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { toRefs } from "@vueuse/core";
-import RecipeIngredientListItem from "./RecipeIngredientListItem.vue";
-import { useUserApi } from "~/composables/api";
-import { alert } from "~/composables/use-toast";
-import { useShoppingListPreferences } from "~/composables/use-users/preferences";
-import type { RecipeIngredient, ShoppingListAddRecipeParamsBulk, ShoppingListSummary } from "~/lib/api/types/household";
-import type { Recipe } from "~/lib/api/types/recipe";
-
-export interface RecipeWithScale extends Recipe {
-  scale: number;
-}
-
-export interface ShoppingListIngredient {
-  checked: boolean;
-  ingredient: RecipeIngredient;
-}
-
-export interface ShoppingListIngredientSection {
-  sectionName: string;
-  ingredients: ShoppingListIngredient[];
-}
-
-export interface ShoppingListRecipeIngredientSection {
-  recipeId: string;
-  recipeName: string;
-  recipeScale: number;
-  ingredientSections: ShoppingListIngredientSection[];
-  parentRecipe?: Recipe;
-}
-
-interface Props {
-  recipes?: RecipeWithScale[];
-  shoppingLists?: ShoppingListSummary[];
-}
-const props = withDefaults(defineProps<Props>(), {
-  recipes: undefined,
-  shoppingLists: () => [],
-});
-
-const dialog = defineModel<boolean>({ default: false });
-
-const i18n = useI18n();
-const auth = useMealieAuth();
-const api = useUserApi();
-const preferences = useShoppingListPreferences();
-const ready = ref(false);
-
-// Capture values at initialization to avoid reactive updates
-const currentHouseholdSlug = ref("");
-const filteredShoppingLists = ref<ShoppingListSummary[]>([]);
-
-const state = reactive({
-  shoppingListDialog: false,
-  shoppingListIngredientDialog: false,
-  shoppingListShowAllToggled: false,
-});
-
-const { shoppingListDialog, shoppingListIngredientDialog, shoppingListShowAllToggled: _shoppingListShowAllToggled } = toRefs(state);
-
-const recipeIngredientSections = ref<ShoppingListRecipeIngredientSection[]>([]);
-const selectedShoppingList = ref<ShoppingListSummary | null>(null);
-
-watch([dialog, () => preferences.value.viewAllLists], () => {
-  if (dialog.value) {
-    currentHouseholdSlug.value = auth.user.value?.householdSlug || "";
-    filteredShoppingLists.value = props.shoppingLists.filter(
-      list => preferences.value.viewAllLists || list.userId === auth.user.value?.id,
-    );
-
-    if (filteredShoppingLists.value.length === 1 && !state.shoppingListShowAllToggled) {
-      selectedShoppingList.value = filteredShoppingLists.value[0];
-      openShoppingListIngredientDialog(selectedShoppingList.value);
-    }
-    else {
-      state.shoppingListDialog = true;
-      ready.value = true;
-    }
-  }
-  else if (!dialog.value) {
-    initState();
-  }
-});
-
-function buildIngredientSections(ingredients: ShoppingListIngredient[]): ShoppingListIngredientSection[] {
-  let currentTitle = "";
-  const onHandIngs: ShoppingListIngredient[] = [];
-  const sections = ingredients.reduce((acc, ing) => {
-    if (ing.ingredient.title) {
-      currentTitle = ing.ingredient.title;
-    }
-
-    if (!acc.length || currentTitle !== acc[acc.length - 1].sectionName) {
-      if (acc.length) {
-        acc[acc.length - 1].ingredients.push(...onHandIngs);
-        onHandIngs.length = 0;
-      }
-      acc.push({ sectionName: currentTitle, ingredients: [] });
-    }
-
-    const householdsWithFood = ing.ingredient?.food?.householdsWithIngredientFood || [];
-    if (householdsWithFood.includes(currentHouseholdSlug.value)) {
-      onHandIngs.push(ing);
-      return acc;
-    }
-
-    acc[acc.length - 1].ingredients.push(ing);
-    return acc;
-  }, [] as ShoppingListIngredientSection[]);
-
-  if (sections.length) {
-    sections[sections.length - 1].ingredients.push(...onHandIngs);
-  }
-  return sections;
-}
-
-async function consolidateRecipesIntoSections(recipes: RecipeWithScale[]) {
-  const recipeSectionMap = new Map<string, ShoppingListRecipeIngredientSection>();
-
-  function addSubRecipeToMap(ing: RecipeIngredient, parentQuantity: number, parentScale: number, parentRecipe: Recipe) {
-    const ref = ing.referencedRecipe!;
-    const key = ref.id || ref.slug || "";
-    const ownIngs: ShoppingListIngredient[] = [];
-    const subRefIngs: RecipeIngredient[] = [];
-
-    for (const subIng of ref.recipeIngredient ?? []) {
-      if (subIng.referencedRecipe) {
-        subRefIngs.push(subIng);
-      }
-      else {
-        const householdsWithFood = subIng.food?.householdsWithIngredientFood || [];
-        ownIngs.push({
-          checked: !householdsWithFood.includes(currentHouseholdSlug.value),
-          ingredient: { ...subIng, quantity: (ing.quantity || 1) * (subIng.quantity || 1) },
-        });
-      }
-    }
-
-    recipeSectionMap.set(key, {
-      recipeId: ref.id || "",
-      recipeName: ref.name || "",
-      recipeScale: parentQuantity * parentScale,
-      ingredientSections: buildIngredientSections(ownIngs),
-      parentRecipe,
-    });
-
-    subRefIngs.forEach(subIng => addSubRecipeToMap(subIng, (ing.quantity || 1) * (subIng.quantity || 1), parentScale, ref));
-  }
-
-  for (const recipe of recipes) {
-    if (!recipe.slug) {
-      continue;
-    }
-
-    if (recipeSectionMap.has(recipe.slug)) {
-      const existingSection = recipeSectionMap.get(recipe.slug);
-      if (existingSection) {
-        existingSection.recipeScale += recipe.scale;
-      }
-      continue;
-    }
-
-    // Create a local copy to avoid mutating props
-    let recipeData = { ...recipe };
-    if (!(recipeData.id && recipeData.name && recipeData.recipeIngredient)) {
-      const { data } = await api.recipes.getOne(recipeData.slug);
-      if (!data?.recipeIngredient?.length) {
-        continue;
-      }
-      recipeData = {
-        ...recipeData,
-        id: data.id || "",
-        name: data.name || "",
-        recipeIngredient: data.recipeIngredient,
-      };
-    }
-    else if (!recipeData.recipeIngredient.length) {
-      continue;
-    }
-
-    const ownIngs: ShoppingListIngredient[] = [];
-    const subRefIngs: RecipeIngredient[] = [];
-    recipeData.recipeIngredient.forEach((ing) => {
-      if (ing.referencedRecipe) {
-        subRefIngs.push(ing);
-      }
-      else {
-        const householdsWithFood = ing.food?.householdsWithIngredientFood || [];
-        ownIngs.push({
-          checked: !householdsWithFood.includes(currentHouseholdSlug.value),
-          ingredient: ing,
-        });
-      }
-    });
-
-    recipeSectionMap.set(recipe.slug, {
-      recipeId: recipeData.id,
-      recipeName: recipeData.name,
-      recipeScale: recipeData.scale,
-      ingredientSections: buildIngredientSections(ownIngs),
-    });
-
-    subRefIngs.forEach(ing => addSubRecipeToMap(ing, ing.quantity || 1, recipeData.scale, recipeData));
-  }
-
-  recipeIngredientSections.value = Array.from(recipeSectionMap.values());
-}
-
-function initState() {
-  state.shoppingListDialog = false;
-  state.shoppingListIngredientDialog = false;
-  state.shoppingListShowAllToggled = false;
-  recipeIngredientSections.value = [];
-  selectedShoppingList.value = null;
-}
-
-initState();
-
-async function openShoppingListIngredientDialog(list: ShoppingListSummary) {
-  if (!props.recipes?.length) {
-    return;
-  }
-
-  selectedShoppingList.value = list;
-  await consolidateRecipesIntoSections(props.recipes);
-  state.shoppingListDialog = false;
-  state.shoppingListIngredientDialog = true;
-}
-
-function setShowAllToggled() {
-  state.shoppingListShowAllToggled = true;
-}
-
-function bulkCheckIngredients(value = true) {
-  recipeIngredientSections.value.forEach((recipeSection) => {
-    recipeSection.ingredientSections.forEach((ingSection) => {
-      ingSection.ingredients.forEach((ing) => {
-        ing.checked = value;
-      });
-    });
-  });
-}
-
-async function addRecipesToList() {
-  if (!selectedShoppingList.value) {
-    return;
-  }
-
-  const recipeData: ShoppingListAddRecipeParamsBulk[] = [];
-  recipeIngredientSections.value.forEach((section) => {
-    const ingredients: RecipeIngredient[] = [];
-    section.ingredientSections.forEach((ingSection) => {
-      ingSection.ingredients.forEach((ing) => {
-        if (ing.checked) {
-          ingredients.push(ing.ingredient);
-        }
-      });
-    });
-
-    if (!ingredients.length) {
-      return;
-    }
-
-    recipeData.push(
-      {
-        recipeId: section.recipeId,
-        recipeIncrementQuantity: section.recipeScale,
-        recipeIngredients: ingredients,
-      },
-    );
-  });
-
-  const { error } = await api.shopping.lists.addRecipes(selectedShoppingList.value.id, recipeData);
-  // eslint-disable-next-line @typescript-eslint/no-unused-expressions
-  error ? alert.error(i18n.t("recipe.failed-to-add-recipes-to-list")) : alert.success(i18n.t("recipe.successfully-added-to-list"));
-
-  state.shoppingListDialog = false;
-  state.shoppingListIngredientDialog = false;
-  dialog.value = false;
-}
-</script>
-
-<style scoped lang="css">
-.ingredient-grid {
-  display: grid;
-  grid-auto-flow: column;
-  grid-template-columns: 1fr 1fr;
-  grid-gap: 0.5rem;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeDialogBulkAdd.vue

@@ -1,145 +0,0 @@
-<template>
-  <div class="text-center">
-    <BaseButton @click="dialog = true">
-      {{ $t("new-recipe.bulk-add") }}
-    </BaseButton>
-    <BaseDialog
-      v-model="dialog"
-      width="800"
-      :title="$t('new-recipe.bulk-add')"
-      :icon="$globals.icons.createAlt"
-      :submit-text="$t('general.add')"
-      :disable-submit-on-enter="true"
-      can-submit
-      @submit="save"
-    >
-      <v-card-text>
-        <v-textarea
-          v-model="inputText"
-          variant="outlined"
-          rows="12"
-          hide-details
-          autofocus
-          :placeholder="$t('new-recipe.paste-in-your-recipe-data-each-line-will-be-treated-as-an-item-in-a-list')"
-        />
-
-        <v-divider />
-        <v-list lines="two">
-          <template
-            v-for="(util) in utilities"
-            :key="util.id"
-          >
-            <v-list-item
-              class="px-0"
-            >
-              <template #prepend>
-                <v-avatar>
-                  <v-btn
-                    icon
-                    variant="tonal"
-                    base-color="info"
-                    :title="$t('general.run')"
-                    @click="util.action"
-                  >
-                    <v-icon>
-                      {{ $globals.icons.play }}
-                    </v-icon>
-                  </v-btn>
-                </v-avatar>
-              </template>
-              <v-list-item-title class="text-pre-wrap">
-                {{ util.description }}
-              </v-list-item-title>
-            </v-list-item>
-          </template>
-        </v-list>
-      </v-card-text>
-    </BaseDialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-interface Props {
-  inputTextProp?: string;
-}
-const props = withDefaults(defineProps<Props>(), {
-  inputTextProp: "",
-});
-
-const emit = defineEmits<{
-  "bulk-data": [data: string[]];
-}>();
-
-const dialog = ref(false);
-const inputText = ref(props.inputTextProp);
-
-function splitText() {
-  return inputText.value.split("\n").filter(line => !(line === "\n" || !line));
-}
-
-function removeFirstCharacter() {
-  inputText.value = splitText()
-    .map(line => line.substring(1))
-    .join("\n");
-}
-
-const numberedLineRegex = /\d+[.):] /gm;
-
-function splitByNumberedLine() {
-  // Split inputText by numberedLineRegex
-  const matches = inputText.value.match(numberedLineRegex);
-
-  matches?.forEach((match, idx) => {
-    const replaceText = idx === 0 ? "" : "\n";
-    inputText.value = inputText.value.replace(match, replaceText);
-  });
-}
-
-function trimAllLines() {
-  const splitLines = splitText();
-
-  splitLines.forEach((element: string, index: number) => {
-    splitLines[index] = element.trim();
-  });
-
-  inputText.value = splitLines.join("\n");
-}
-
-function save() {
-  emit("bulk-data", splitText());
-  dialog.value = false;
-}
-
-function open() {
-  dialog.value = true;
-}
-function close() {
-  dialog.value = false;
-}
-
-const i18n = useI18n();
-
-const utilities = [
-  {
-    id: "trim-whitespace",
-    description: i18n.t("new-recipe.trim-whitespace-description"),
-    action: trimAllLines,
-  },
-  {
-    id: "trim-prefix",
-    description: i18n.t("new-recipe.trim-prefix-description"),
-    action: removeFirstCharacter,
-  },
-  {
-    id: "split-by-numbered-line",
-    description: i18n.t("new-recipe.split-by-numbered-line-description"),
-    action: splitByNumberedLine,
-  },
-];
-
-// Expose functions to parent components
-defineExpose({
-  open,
-  close,
-});
-</script>

frontend/app/components/Domain/Recipe/RecipeDialogSearch.vue

@@ -1,187 +0,0 @@
-<template>
-  <div>
-    <slot v-bind="{ open, close }" />
-    <v-dialog
-      v-model="dialog"
-      max-width="988px"
-      content-class="top-dialog"
-      :scrollable="false"
-    >
-      <v-card
-        :rounded="!$vuetify.display.xs"
-        :loading="loading"
-      >
-        <v-toolbar
-          dark
-          color="primary-lighten-1"
-        >
-          <v-text-field
-            id="arrow-search"
-            v-model="search.query.value"
-            autofocus
-            variant="solo"
-            flat
-            autocomplete="off"
-            bg-color="primary-lighten-1"
-            color="white"
-            density="compact"
-            class="mx-2 arrow-search"
-            hide-details
-            single-line
-            :placeholder="$t('search.search')"
-            :prepend-inner-icon="$globals.icons.search"
-          />
-
-          <v-btn
-            v-if="$vuetify.display.xs"
-            icon
-            size="x-small"
-            @click="dialog = false"
-          >
-            <v-icon>
-              {{ $globals.icons.close }}
-            </v-icon>
-          </v-btn>
-        </v-toolbar>
-
-        <v-card-actions>
-          <div class="mr-auto">
-            {{ $t("search.results") }}
-          </div>
-        </v-card-actions>
-
-        <div class="scroll pa-1" style="max-height: 700px;">
-          <RecipeCardMobile
-            v-for="(recipe, index) in search.data.value"
-            :key="index"
-            :tabindex="index"
-            class="ma-1 arrow-nav"
-            :name="recipe.name ?? ''"
-            :description="recipe.description ?? ''"
-            :slug="recipe.slug ?? ''"
-            :rating="recipe.rating ?? 0"
-            :image="recipe.image"
-            :recipe-id="recipe.id ?? ''"
-            v-bind="$attrs.selected ? { selected: () => handleSelect(recipe) } : {}"
-          />
-        </div>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-import RecipeCardMobile from "./RecipeCardMobile.vue";
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-import type { RecipeSummary } from "~/lib/api/types/recipe";
-import { useUserApi } from "~/composables/api";
-import { useRecipeSearch } from "~/composables/recipes/use-recipe-search";
-import { usePublicExploreApi } from "~/composables/api/api-client";
-
-const SELECTED_EVENT = "selected";
-
-// Define emits
-const emit = defineEmits<{
-  selected: [recipe: RecipeSummary];
-}>();
-
-const auth = useMealieAuth();
-const loading = ref(false);
-const selectedIndex = ref(-1);
-
-// ===========================================================================
-// Dialog State Management
-const dialog = ref(false);
-
-// Reset or Grab Recipes on Change
-watch(dialog, (val) => {
-  if (!val) {
-    search.query.value = "";
-    selectedIndex.value = -1;
-    search.data.value = [];
-  }
-});
-
-// ===========================================================================
-// Event Handlers
-
-function selectRecipe() {
-  const recipeCards = document.getElementsByClassName("arrow-nav");
-  if (recipeCards) {
-    if (selectedIndex.value < 0) {
-      selectedIndex.value = -1;
-      document.getElementById("arrow-search")?.focus();
-      return;
-    }
-
-    if (selectedIndex.value >= recipeCards.length) {
-      selectedIndex.value = recipeCards.length - 1;
-    }
-
-    (recipeCards[selectedIndex.value] as HTMLElement).focus();
-  }
-}
-
-function onUpDown(e: KeyboardEvent) {
-  if (e.key === "Enter") {
-    console.log(document.activeElement);
-    // (document.activeElement as HTMLElement).click();
-  }
-  else if (e.key === "ArrowUp") {
-    e.preventDefault();
-    selectedIndex.value--;
-  }
-  else if (e.key === "ArrowDown") {
-    e.preventDefault();
-    selectedIndex.value++;
-  }
-  else {
-    return;
-  }
-  selectRecipe();
-}
-
-watch(dialog, (val) => {
-  if (!val) {
-    document.removeEventListener("keyup", onUpDown);
-  }
-  else {
-    document.addEventListener("keyup", onUpDown);
-  }
-});
-
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
-watch(route, close);
-
-function open() {
-  dialog.value = true;
-}
-function close() {
-  dialog.value = false;
-}
-
-// ===========================================================================
-// Basic Search
-const { isOwnGroup } = useLoggedInState();
-const api = isOwnGroup.value ? useUserApi() : usePublicExploreApi(groupSlug.value).explore;
-const search = useRecipeSearch(api);
-
-// Select Handler
-function handleSelect(recipe: RecipeSummary) {
-  close();
-  emit(SELECTED_EVENT, recipe);
-}
-
-// Expose functions to parent components
-defineExpose({
-  open,
-  close,
-});
-</script>
-
-<style>
-.scroll {
-  overflow-y: auto;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeDialogShare.vue

@@ -1,200 +0,0 @@
-<template>
-  <div>
-    <BaseDialog
-      v-model="dialog"
-      :title="$t('recipe-share.share-recipe')"
-      :icon="$globals.icons.link"
-    >
-      <v-card-text>
-        <v-menu
-          v-model="datePickerMenu"
-          :close-on-content-click="false"
-          transition="scale-transition"
-          offset-y
-          max-width="290px"
-          min-width="auto"
-        >
-          <template #activator="{ props: activatorProps }">
-            <v-text-field
-              :model-value="$d(expirationDate)"
-              :label="$t('recipe-share.expiration-date')"
-              :hint="$t('recipe-share.default-30-days')"
-              persistent-hint
-              :prepend-icon="$globals.icons.calendar"
-              v-bind="activatorProps"
-              readonly
-            />
-          </template>
-          <v-date-picker
-            v-model="expirationDate"
-            hide-header
-            :first-day-of-week="firstDayOfWeek"
-            :local="$i18n.locale"
-            @update:model-value="datePickerMenu = false"
-          />
-        </v-menu>
-      </v-card-text>
-      <v-card-actions class="justify-end">
-        <BaseButton
-          size="small"
-          @click="createNewToken"
-        >
-          {{ $t("general.new") }}
-        </BaseButton>
-      </v-card-actions>
-
-      <v-list-item
-        v-for="token in tokens"
-        :key="token.id"
-        class="px-2"
-        style="padding-top: 8px; padding-bottom: 8px;"
-        @click="shareRecipe(token.id)"
-      >
-        <div class="d-flex align-center" style="width: 100%;">
-          <v-avatar color="grey">
-            <v-icon>
-              {{ $globals.icons.link }}
-            </v-icon>
-          </v-avatar>
-
-          <div class="pl-3 flex-grow-1">
-            <v-list-item-title>
-              {{ $t("recipe-share.expires-at") + ' ' + $d(new Date(token.expiresAt!), "short") }}
-            </v-list-item-title>
-          </div>
-
-          <v-btn
-            icon
-            variant="text"
-            class="ml-2"
-            @click.stop="deleteToken(token.id)"
-          >
-            <v-icon color="error-lighten-1">
-              {{ $globals.icons.delete }}
-            </v-icon>
-          </v-btn>
-          <v-btn
-            icon
-            variant="text"
-            class="ml-2"
-            @click.stop="copyTokenLink(token.id)"
-          >
-            <v-icon color="info-lighten-1">
-              {{ $globals.icons.contentCopy }}
-            </v-icon>
-          </v-btn>
-        </div>
-      </v-list-item>
-    </BaseDialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useClipboard, useShare, whenever } from "@vueuse/core";
-import type { RecipeShareToken } from "~/lib/api/types/recipe";
-import { useUserApi } from "~/composables/api";
-import { useHouseholdSelf } from "~/composables/use-households";
-import { alert } from "~/composables/use-toast";
-
-interface Props {
-  recipeId: string;
-  name: string;
-}
-const props = defineProps<Props>();
-
-const dialog = defineModel<boolean>({ default: false });
-
-const datePickerMenu = ref(false);
-const expirationDate = ref(new Date(Date.now() - new Date().getTimezoneOffset() * 60000));
-const tokens = ref<RecipeShareToken[]>([]);
-
-whenever(
-  () => dialog.value,
-  () => {
-    // Set expiration date to today + 30 Days
-    const today = new Date();
-    expirationDate.value = new Date(today.getTime() + 30 * 24 * 60 * 60 * 1000);
-    refreshTokens();
-  },
-);
-
-const i18n = useI18n();
-const auth = useMealieAuth();
-const { household } = useHouseholdSelf();
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
-
-const firstDayOfWeek = computed(() => {
-  return household.value?.preferences?.firstDayOfWeek || 0;
-});
-
-// ============================================================
-// Token Actions
-
-const userApi = useUserApi();
-
-async function createNewToken() {
-  // Convert expiration date to timestamp
-  const { data } = await userApi.recipes.share.createOne({
-    recipeId: props.recipeId,
-    expiresAt: expirationDate.value.toISOString(),
-  });
-
-  if (data) {
-    tokens.value.push(data);
-  }
-}
-
-async function deleteToken(id: string) {
-  await userApi.recipes.share.deleteOne(id);
-  tokens.value = tokens.value.filter(token => token.id !== id);
-}
-
-async function refreshTokens() {
-  const { data } = await userApi.recipes.share.getAll(1, -1, { recipe_id: props.recipeId });
-
-  if (data) {
-    // @ts-expect-error - TODO: This routes doesn't have pagination, but the type are mismatched.
-    tokens.value = data ?? [];
-  }
-}
-
-const { share, isSupported: shareIsSupported } = useShare();
-const { copy, copied, isSupported } = useClipboard();
-
-function getRecipeText() {
-  return i18n.t("recipe.share-recipe-message", [props.name]);
-}
-
-function getTokenLink(token: string) {
-  return `${window.location.origin}/g/${groupSlug.value}/shared/r/${token}`;
-}
-
-async function copyTokenLink(token: string) {
-  if (isSupported.value) {
-    await copy(getTokenLink(token));
-    if (copied.value) {
-      alert.success(i18n.t("recipe-share.recipe-link-copied-message") as string);
-    }
-    else {
-      alert.error(i18n.t("general.clipboard-copy-failure") as string);
-    }
-  }
-  else {
-    alert.error(i18n.t("general.clipboard-not-supported") as string);
-  }
-}
-
-async function shareRecipe(token: string) {
-  if (shareIsSupported) {
-    share({
-      title: props.name,
-      url: getTokenLink(token),
-      text: getRecipeText() as string,
-    });
-  }
-  else {
-    await copyTokenLink(token);
-  }
-}
-</script>

frontend/app/components/Domain/Recipe/RecipeExplorerPage/RecipeExplorerPage.vue

@@ -1,56 +0,0 @@
-<template>
-  <v-container
-    fluid
-    class="px-0"
-  >
-    <RecipeExplorerPageSearch
-      ref="searchComponent"
-      @ready="onSearchReady"
-    />
-    <v-divider />
-    <v-container class="mt-6 px-md-6">
-      <RecipeCardSection
-        v-if="ready"
-        class="mt-n5"
-        :icon="$globals.icons.silverwareForkKnife"
-        :title="$t('general.recipes')"
-        :recipes="recipes"
-        :query="searchQuery"
-        disable-sort
-        @item-selected="onItemSelected"
-        @replace-recipes="replaceRecipes"
-        @append-recipes="appendRecipes"
-      />
-    </v-container>
-  </v-container>
-</template>
-
-<script setup lang="ts">
-import RecipeExplorerPageSearch from "./RecipeExplorerPageParts/RecipeExplorerPageSearch.vue";
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-import RecipeCardSection from "~/components/Domain/Recipe/RecipeCardSection.vue";
-import { useLazyRecipes } from "~/composables/recipes";
-
-const auth = useMealieAuth();
-const route = useRoute();
-
-const { isOwnGroup } = useLoggedInState();
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
-
-const { recipes, appendRecipes, replaceRecipes } = useLazyRecipes(isOwnGroup.value ? null : groupSlug.value);
-
-const ready = ref(false);
-const searchComponent = ref<InstanceType<typeof RecipeExplorerPageSearch>>();
-
-const searchQuery = computed(() => {
-  return searchComponent.value?.passedQueryWithSeed || {};
-});
-
-function onSearchReady() {
-  ready.value = true;
-}
-
-function onItemSelected(item: any, urlPrefix: string) {
-  searchComponent.value?.filterItems(item, urlPrefix);
-}
-</script>

frontend/app/components/Domain/Recipe/RecipeExplorerPage/RecipeExplorerPageParts/RecipeExplorerPageSearch.vue

@@ -1,255 +0,0 @@
-<template>
-  <div class="search-container pb-8">
-    <form
-      class="search-box pa-2"
-      @submit.prevent="search"
-    >
-      <div class="d-flex justify-center mb-2">
-        <v-text-field
-          ref="input"
-          v-model="state.search"
-          variant="outlined"
-          hide-details
-          clearable
-          color="primary"
-          :placeholder="$t('search.search-placeholder')"
-          :prepend-inner-icon="$globals.icons.search"
-          @keyup.enter="hideKeyboard"
-        />
-      </div>
-      <div class="search-row">
-        <RecipeExplorerPageSearchFilters />
-        <!-- Sort Options -->
-        <v-menu
-          offset-y
-          nudge-bottom="3"
-        >
-          <template #activator="{ props }">
-            <v-btn
-              class="ml-auto"
-              size="small"
-              color="accent"
-              v-bind="props"
-            >
-              <v-icon :start="!$vuetify.display.xs">
-                {{ state.orderDirection === "asc" ? $globals.icons.sortDescending : $globals.icons.sortAscending }}
-              </v-icon>
-              {{ $vuetify.display.xs ? null : sortText }}
-            </v-btn>
-          </template>
-          <v-card>
-            <v-list>
-              <v-list-item
-                slim
-                density="comfortable"
-                :prepend-icon="state.orderDirection === 'asc' ? $globals.icons.sortAscending : $globals.icons.sortDescending"
-                :title="state.orderDirection === 'asc' ? $t('general.sort-descending') : $t('general.sort-ascending')"
-                @click="toggleOrderDirection"
-              />
-              <v-divider />
-              <v-list-item
-                v-for="v in sortable"
-                :key="v.name"
-                :active="state.orderBy === v.value"
-                slim
-                density="comfortable"
-                @click="v.value === 'random' ? setRandomOrderByWrapper() : setOrderBy(v.value)"
-              >
-                <template #prepend>
-                  <v-icon>{{ v.icon }}</v-icon>
-                </template>
-
-                <template #title>
-                  <span>{{ v.name }}</span>
-                  <v-icon
-                    v-if="v.value === 'random' && showRandomLoading"
-                    size="small"
-                    class="ml-3"
-                  >
-                    {{ $globals.icons.refreshCircle }}
-                  </v-icon>
-                </template>
-              </v-list-item>
-            </v-list>
-          </v-card>
-        </v-menu>
-
-        <!-- Settings -->
-        <v-menu
-          offset-y
-          bottom
-          start
-          nudge-bottom="3"
-          :close-on-content-click="false"
-        >
-          <template #activator="{ props }">
-            <v-btn
-              size="small"
-              color="accent"
-              dark
-              v-bind="props"
-            >
-              <v-icon size="small">
-                {{ $globals.icons.cog }}
-              </v-icon>
-            </v-btn>
-          </template>
-          <v-card>
-            <v-card-text>
-              <v-switch
-                v-model="state.auto"
-                :label="$t('search.auto-search')"
-                single-line
-                color="primary"
-              />
-              <v-btn
-                block
-                color="primary"
-                @click="reset"
-              >
-                {{ $t("general.reset") }}
-              </v-btn>
-            </v-card-text>
-          </v-card>
-        </v-menu>
-      </div>
-      <div
-        v-if="!state.auto"
-        class="search-button-container"
-      >
-        <v-btn
-          size="x-large"
-          color="primary"
-          type="submit"
-          block
-        >
-          <v-icon start>
-            {{ $globals.icons.search }}
-          </v-icon>
-          {{ $t("search.search") }}
-        </v-btn>
-      </div>
-    </form>
-  </div>
-</template>
-
-<script setup lang="ts">
-import RecipeExplorerPageSearchFilters from "./RecipeExplorerPageSearchFilters.vue";
-import { useRecipeExplorerSearch, clearRecipeExplorerSearchState } from "~/composables/use-recipe-explorer-search";
-
-const emit = defineEmits<{
-  ready: [];
-}>();
-
-const auth = useMealieAuth();
-const route = useRoute();
-const { $globals } = useNuxtApp();
-const i18n = useI18n();
-const showRandomLoading = ref(false);
-
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
-
-const {
-  state,
-  passedQueryWithSeed,
-  search,
-  reset,
-  toggleOrderDirection,
-  setOrderBy,
-  setRandomOrderBy,
-  filterItems,
-  initialize,
-} = useRecipeExplorerSearch(groupSlug);
-
-defineExpose({
-  passedQueryWithSeed,
-  filterItems,
-});
-
-onMounted(async () => {
-  await initialize();
-  emit("ready");
-});
-
-onUnmounted(() => {
-  // Clear the cache when component unmounts to ensure fresh state on remount
-  clearRecipeExplorerSearchState(groupSlug.value);
-});
-
-const sortText = computed(() => {
-  const sort = sortable.value.find(s => s.value === state.value.orderBy);
-  if (!sort) return "";
-  return `${sort.name}`;
-});
-
-const sortable = computed(() => [
-  {
-    icon: $globals.icons.orderAlphabeticalAscending,
-    name: i18n.t("general.sort-alphabetically"),
-    value: "name",
-  },
-  {
-    icon: $globals.icons.newBox,
-    name: i18n.t("general.created"),
-    value: "created_at",
-  },
-  {
-    icon: $globals.icons.chefHat,
-    name: i18n.t("general.last-made"),
-    value: "last_made",
-  },
-  {
-    icon: $globals.icons.star,
-    name: i18n.t("general.rating"),
-    value: "rating",
-  },
-  {
-    icon: $globals.icons.update,
-    name: i18n.t("general.updated"),
-    value: "updated_at",
-  },
-  {
-    icon: $globals.icons.diceMultiple,
-    name: i18n.t("general.random"),
-    value: "random",
-  },
-]);
-
-// Methods
-const input: Ref<any> = ref(null);
-
-function hideKeyboard() {
-  input.value?.blur();
-}
-
-// function to show refresh icon
-async function setRandomOrderByWrapper() {
-  if (!showRandomLoading.value) {
-    showRandomLoading.value = true;
-  }
-  await setRandomOrderBy();
-}
-</script>
-
-<style scoped>
-.search-row {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.65rem;
-  margin-top: 1rem;
-}
-
-.search-container {
-  display: flex;
-  justify-content: center;
-}
-
-.search-box {
-  width: 950px;
-}
-
-.search-button-container {
-  margin: 3rem auto 0 auto;
-  max-width: 500px;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeExplorerPage/RecipeExplorerPageParts/RecipeExplorerPageSearchFilters.vue

@@ -1,114 +0,0 @@
-<template>
-  <!-- Category Filter -->
-  <SearchFilter
-    v-if="categories"
-    v-model="selectedCategories"
-    v-model:require-all="state.requireAllCategories"
-    :items="categories"
-  >
-    <v-icon start>
-      {{ $globals.icons.categories }}
-    </v-icon>
-    {{ $t("category.categories") }}
-  </SearchFilter>
-
-  <!-- Tag Filter -->
-  <SearchFilter
-    v-if="tags"
-    v-model="selectedTags"
-    v-model:require-all="state.requireAllTags"
-    :items="tags"
-  >
-    <v-icon start>
-      {{ $globals.icons.tags }}
-    </v-icon>
-    {{ $t("tag.tags") }}
-  </SearchFilter>
-
-  <!-- Tool Filter -->
-  <SearchFilter
-    v-if="tools"
-    v-model="selectedTools"
-    v-model:require-all="state.requireAllTools"
-    :items="tools"
-  >
-    <v-icon start>
-      {{ $globals.icons.potSteam }}
-    </v-icon>
-    {{ $t("tool.tools") }}
-  </SearchFilter>
-
-  <!-- Food Filter -->
-  <SearchFilter
-    v-if="foods"
-    v-model="selectedFoods"
-    v-model:require-all="state.requireAllFoods"
-    :items="foods"
-  >
-    <v-icon start>
-      {{ $globals.icons.foods }}
-    </v-icon>
-    {{ $t("general.foods") }}
-  </SearchFilter>
-
-  <!-- Household Filter -->
-  <SearchFilter
-    v-if="households.length > 1"
-    v-model="selectedHouseholds"
-    :items="households"
-    radio
-  >
-    <v-icon start>
-      {{ $globals.icons.household }}
-    </v-icon>
-    {{ $t("household.households") }}
-  </SearchFilter>
-</template>
-
-<script setup lang="ts">
-import { useLoggedInState } from "~/composables/use-logged-in-state";
-import { useRecipeExplorerSearch } from "~/composables/use-recipe-explorer-search";
-import {
-  useCategoryStore,
-  usePublicCategoryStore,
-  useFoodStore,
-  usePublicFoodStore,
-  useHouseholdStore,
-  usePublicHouseholdStore,
-  useTagStore,
-  usePublicTagStore,
-  useToolStore,
-  usePublicToolStore,
-} from "~/composables/store";
-
-const auth = useMealieAuth();
-const route = useRoute();
-
-const { isOwnGroup } = useLoggedInState();
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user.value?.groupSlug || "");
-
-const {
-  state,
-  selectedCategories,
-  selectedFoods,
-  selectedHouseholds,
-  selectedTags,
-  selectedTools,
-} = useRecipeExplorerSearch(groupSlug);
-
-const { store: categories } = isOwnGroup.value ? useCategoryStore() : usePublicCategoryStore(groupSlug.value);
-const { store: tags } = isOwnGroup.value ? useTagStore() : usePublicTagStore(groupSlug.value);
-const { store: tools } = isOwnGroup.value ? useToolStore() : usePublicToolStore(groupSlug.value);
-const { store: foods } = isOwnGroup.value ? useFoodStore() : usePublicFoodStore(groupSlug.value);
-const { store: households } = isOwnGroup.value ? useHouseholdStore() : usePublicHouseholdStore(groupSlug.value);
-
-watch(
-  households,
-  () => {
-    // if exactly one household exists, then we shouldn't be filtering by household
-    if (households.value.length == 1) {
-      selectedHouseholds.value = [];
-    }
-  },
-);
-</script>

frontend/app/components/Domain/Recipe/RecipeFavoriteBadge.vue

@@ -1,66 +0,0 @@
-<template>
-  <v-tooltip
-    location="bottom"
-    nudge-right="50"
-    :color="buttonStyle ? 'info' : 'secondary'"
-  >
-    <template #activator="{ props: tooltipProps }">
-      <v-btn
-        v-if="isFavorite || showAlways"
-        icon
-        :variant="buttonStyle ? 'flat' : undefined"
-        :rounded="buttonStyle ? 'circle' : undefined"
-        size="small"
-        :color="buttonStyle ? 'info' : 'secondary'"
-        :fab="buttonStyle"
-        v-bind="{ ...tooltipProps, ...$attrs }"
-        @click.prevent="toggleFavorite"
-      >
-        <v-icon
-          :size="!buttonStyle ? undefined : 'x-large'"
-          :color="buttonStyle ? 'white' : 'secondary'"
-        >
-          {{ isFavorite ? $globals.icons.heart : $globals.icons.heartOutline }}
-        </v-icon>
-      </v-btn>
-    </template>
-    <span>{{ isFavorite ? $t("recipe.remove-from-favorites") : $t("recipe.add-to-favorites") }}</span>
-  </v-tooltip>
-</template>
-
-<script setup lang="ts">
-import { useUserSelfRatings } from "~/composables/use-users";
-import { useUserApi } from "~/composables/api";
-
-interface Props {
-  recipeId?: string;
-  showAlways?: boolean;
-  buttonStyle?: boolean;
-}
-const props = withDefaults(defineProps<Props>(), {
-  recipeId: "",
-  showAlways: false,
-  buttonStyle: false,
-});
-
-const { userRatings, refreshUserRatings } = useUserSelfRatings();
-
-const isFavorite = computed(() => {
-  const rating = userRatings.value.find(r => r.recipeId === props.recipeId);
-  return rating?.isFavorite || false;
-});
-
-async function toggleFavorite() {
-  const api = useUserApi();
-  const auth = useMealieAuth();
-
-  if (!auth.user.value) return;
-  if (!isFavorite.value) {
-    await api.users.addFavorite(auth.user.value?.id, props.recipeId);
-  }
-  else {
-    await api.users.removeFavorite(auth.user.value?.id, props.recipeId);
-  }
-  await refreshUserRatings();
-}
-</script>

frontend/app/components/Domain/Recipe/RecipeImageUploadBtn.vue

@@ -1,140 +0,0 @@
-<template>
-  <div class="text-center">
-    <v-menu
-      v-model="menu"
-      offset-y
-      top
-      nudge-top="6"
-      :close-on-content-click="false"
-    >
-      <template #activator="{ props: activatorProps }">
-        <v-btn
-          color="accent"
-          dark
-          v-bind="activatorProps"
-        >
-          <v-icon start>
-            {{ $globals.icons.fileImage }}
-          </v-icon>
-          {{ $t("general.image") }}
-        </v-btn>
-      </template>
-      <v-card width="400">
-        <v-card-title class="headline flex-wrap mb-0">
-          <div>
-            {{ $t("recipe.recipe-image") }}
-          </div>
-          <div class="d-flex gap-2">
-            <AppButtonUpload
-              url="none"
-              file-name="image"
-              :text-btn="false"
-              :post="false"
-              @uploaded="uploadImage"
-            />
-            <BaseButton
-              class="ml-2"
-              delete
-              @click="dialogDeleteImage = true"
-            />
-            <BaseDialog
-              v-model="dialogDeleteImage"
-              :title="$t('recipe.delete-image')"
-              :icon="$globals.icons.alertCircle"
-              color="error"
-              can-delete
-              @delete="deleteImage"
-            >
-              <v-card-text>
-                {{ $t("recipe.delete-image-confirmation") }}
-              </v-card-text>
-            </BaseDialog>
-          </div>
-        </v-card-title>
-        <v-card-text class="mt-n5">
-          <div>
-            <v-text-field
-              v-model="url"
-              :label="$t('general.url')"
-              class="pt-5"
-              clearable
-              :messages="messages"
-            >
-              <template #append>
-                <v-btn
-                  class="ml-2"
-                  color="primary"
-                  :loading="loading"
-                  :disabled="!slug"
-                  @click="getImageFromURL"
-                >
-                  {{ $t("general.get") }}
-                </v-btn>
-              </template>
-            </v-text-field>
-          </div>
-        </v-card-text>
-      </v-card>
-    </v-menu>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { alert } from "~/composables/use-toast";
-import { useUserApi } from "~/composables/api";
-
-const UPLOAD_EVENT = "upload";
-const DELETE_EVENT = "delete";
-
-const props = defineProps<{ slug: string }>();
-
-const emit = defineEmits<{
-  refresh: [];
-  upload: [fileObject: File];
-  delete: [];
-}>();
-
-const i18n = useI18n();
-const api = useUserApi();
-
-const url = ref("");
-const loading = ref(false);
-const menu = ref(false);
-const dialogDeleteImage = ref(false);
-
-function uploadImage(fileObject: File) {
-  emit(UPLOAD_EVENT, fileObject);
-  menu.value = false;
-}
-
-async function deleteImage() {
-  loading.value = true;
-  try {
-    await api.recipes.deleteImage(props.slug);
-    emit(DELETE_EVENT);
-    menu.value = false;
-  }
-  catch (e) {
-    alert.error(i18n.t("events.something-went-wrong"));
-    console.error("Failed to delete image", e);
-  }
-  finally {
-    loading.value = false;
-  }
-}
-
-async function getImageFromURL() {
-  loading.value = true;
-  if (await api.recipes.updateImagebyURL(props.slug, url.value)) {
-    emit(DELETE_EVENT);
-  }
-  loading.value = false;
-  menu.value = false;
-}
-
-const messages = computed(() =>
-  props.slug ? [""] : [i18n.t("recipe.save-recipe-before-use")],
-);
-</script>
-
-<style lang="scss" scoped></style>

frontend/app/components/Domain/Recipe/RecipeIngredientHtml.vue

@@ -1,45 +0,0 @@
-<template>
-  <div class="ingredient-link-label links-disabled">
-    <SafeMarkdown v-if="baseText" :source="baseText" />
-    <SafeMarkdown
-      v-if="ingredient?.note"
-      class="d-inline"
-      :source="` ${ingredient.note}`"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { computed } from "vue";
-import type { RecipeIngredient } from "~/lib/api/types/recipe";
-import { useIngredientTextParser } from "~/composables/recipes";
-
-interface Props {
-  ingredient?: RecipeIngredient;
-  scale?: number;
-}
-
-const { ingredient, scale = 1 } = defineProps<Props>();
-const { useParsedIngredientText } = useIngredientTextParser();
-
-const baseText = computed(() => {
-  if (!ingredient) return "";
-  const parsed = useParsedIngredientText(ingredient, scale);
-  return [parsed.quantity, parsed.unit, parsed.name].filter(Boolean).join(" ").trim();
-});
-</script>
-
-<style scoped>
-.ingredient-link-label {
-  display: block;
-  line-height: 1.25;
-  word-break: break-word;
-  font-size: 0.95rem;
-}
-.links-disabled :deep(a) {
-  pointer-events: none;
-  cursor: default;
-  color: var(--v-theme-primary);
-  text-decoration: none;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeIngredients.vue

@@ -1,106 +0,0 @@
-<template>
-  <div v-if="value && value.length > 0">
-    <div
-      v-if="!isCookMode"
-      class="d-flex justify-start"
-    >
-      <h2 class="mt-1 text-h5 font-weight-medium opacity-80">
-        {{ $t("recipe.ingredients") }}
-      </h2>
-      <AppButtonCopy
-        btn-class="ml-auto"
-        :copy-text="ingredientCopyText"
-      />
-    </div>
-    <div>
-      <div
-        v-for="(ingredient, index) in value"
-        :key="'ingredient' + index"
-      >
-        <h3
-          v-if="showTitleEditor[index]"
-          class="mt-2"
-        >
-          {{ ingredient.title }}
-        </h3>
-        <v-divider v-if="showTitleEditor[index]" />
-        <v-list-item
-          density="compact"
-          class="pa-0"
-          @click.stop="toggleChecked(index)"
-        >
-          <template #prepend>
-            <v-checkbox
-              v-model="checked[index]"
-              hide-details
-              class="pt-0 my-auto py-auto"
-              color="secondary"
-              density="comfortable"
-            />
-          </template>
-          <v-list-item-title>
-            <RecipeIngredientListItem
-              :ingredient="ingredient"
-              :scale="scale"
-            />
-          </v-list-item-title>
-        </v-list-item>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import RecipeIngredientListItem from "./RecipeIngredientListItem.vue";
-import { useIngredientTextParser } from "~/composables/recipes";
-import type { RecipeIngredient } from "~/lib/api/types/recipe";
-
-interface Props {
-  value?: RecipeIngredient[];
-  scale?: number;
-  isCookMode?: boolean;
-}
-const props = withDefaults(defineProps<Props>(), {
-  value: () => [],
-  scale: 1,
-  isCookMode: false,
-});
-
-const { parseIngredientText } = useIngredientTextParser();
-
-function validateTitle(title?: string | null) {
-  return !(title === undefined || title === "" || title === null);
-}
-
-const checked = ref(props.value.map(() => false));
-const showTitleEditor = computed(() => props.value.map(x => validateTitle(x.title)));
-
-const ingredientCopyText = computed(() => {
-  const components: string[] = [];
-  props.value.forEach((ingredient) => {
-    if (ingredient.title) {
-      if (components.length) {
-        components.push("");
-      }
-
-      components.push(`[${ingredient.title}]`);
-    }
-
-    components.push(parseIngredientText(ingredient, props.scale, false));
-  });
-
-  return components.join("\n");
-});
-
-function toggleChecked(index: number) {
-  // TODO Find a better way to do this - $set is not available, and
-  // direct array modifications are not propagated for some reason
-  checked.value.splice(index, 1, !checked.value[index]);
-}
-</script>
-
-<style>
-.dense-markdown p {
-  margin: auto !important;
-}
-</style>

frontend/app/components/Domain/Recipe/RecipeLastMade.vue

@@ -1,351 +0,0 @@
-<template>
-  <div>
-    <div>
-      <BaseDialog
-        v-model="madeThisDialog"
-        :loading="madeThisFormLoading"
-        :icon="$globals.icons.chefHat"
-        :title="$t('recipe.made-this')"
-        :submit-text="$t('recipe.add-to-timeline')"
-        can-submit
-        disable-submit-on-enter
-        @submit="createTimelineEvent"
-      >
-        <v-card-text>
-          <v-form ref="domMadeThisForm">
-            <v-textarea
-              v-model="newTimelineEvent.eventMessage"
-              autofocus
-              :label="$t('recipe.comment')"
-              :hint="$t('recipe.how-did-it-turn-out')"
-              persistent-hint
-              rows="4"
-            />
-            <div v-if="childRecipes?.length">
-              <v-card-text class="pt-6 pb-0">
-                {{ $t('recipe.include-linked-recipes') }}
-              </v-card-text>
-              <v-list>
-                <v-list-item
-                  v-for="(childRecipe, i) in childRecipes"
-                  :key="childRecipe.recipeId + i"
-                  density="compact"
-                  class="my-0 py-0"
-                  @click="childRecipe.checked = !childRecipe.checked"
-                >
-                  <v-checkbox
-                    hide-details
-                    density="compact"
-                    :input-value="childRecipe.checked"
-                    :label="childRecipe.name"
-                    class="my-0 py-0"
-                    color="secondary"
-                  />
-                </v-list-item>
-              </v-list>
-            </div>
-            <v-container>
-              <v-row>
-                <v-col cols="6">
-                  <v-menu
-                    v-model="datePickerMenu"
-                    :close-on-content-click="false"
-                    transition="scale-transition"
-                    offset-y
-                    max-width="290px"
-                  >
-                    <template #activator="{ props: activatorProps }">
-                      <v-text-field
-                        :model-value="$d(newTimelineEventTimestamp)"
-                        :prepend-icon="$globals.icons.calendar"
-                        v-bind="activatorProps"
-                        readonly
-                      />
-                    </template>
-                    <v-date-picker
-                      v-model="newTimelineEventTimestamp"
-                      hide-header
-                      :first-day-of-week="firstDayOfWeek"
-                      :local="$i18n.locale"
-                      @update:model-value="datePickerMenu = false"
-                    />
-                  </v-menu>
-                </v-col>
-                <v-spacer />
-                <v-col cols="auto" align-self="center">
-                  <AppButtonUpload
-                    v-if="!newTimelineEventImage"
-                    class="ml-auto"
-                    url="none"
-                    file-name="image"
-                    accept="image/*"
-                    :text="$t('recipe.upload-image')"
-                    :text-btn="false"
-                    :post="false"
-                    @uploaded="uploadImage"
-                  />
-                  <v-btn v-if="!!newTimelineEventImage" color="error" @click="clearImage">
-                    <v-icon start>
-                      {{ $globals.icons.close }}
-                    </v-icon>
-                    {{ $t("recipe.remove-image") }}
-                  </v-btn>
-                </v-col>
-              </v-row>
-              <v-row v-if="newTimelineEventImage && newTimelineEventImagePreviewUrl">
-                <v-col cols="12" align-self="center">
-                  <ImageCropper
-                    :img="newTimelineEventImagePreviewUrl"
-                    cropper-height="20vh"
-                    cropper-width="100%"
-                    @save="updateUploadedImage"
-                  />
-                </v-col>
-              </v-row>
-            </v-container>
-          </v-form>
-        </v-card-text>
-      </BaseDialog>
-    </div>
-    <div>
-      <div v-if="lastMadeReady" class="d-flex justify-center flex-wrap">
-        <v-row no-gutters class="d-flex flex-wrap align-center" style="font-size: larger">
-          <v-tooltip location="bottom">
-            <template #activator="{ props: tooltipProps }">
-              <v-btn
-                rounded
-                variant="outlined"
-                size="x-large"
-                v-bind="tooltipProps"
-                style="border-color: rgb(var(--v-theme-primary));"
-                @click="madeThisDialog = true"
-              >
-                <v-icon start size="large" color="primary">
-                  {{ $globals.icons.calendar }}
-                </v-icon>
-                <span class="text-body-1 opacity-80">
-                  <b>{{ $t("general.last-made") }}</b>
-                  <br>
-                  {{ lastMade ? $d(new Date(lastMade)) : $t("general.never") }}
-                </span>
-                <v-icon end size="large" color="primary">
-                  {{ $globals.icons.createAlt }}
-                </v-icon>
-              </v-btn>
-            </template>
-            <span>{{ $t("recipe.made-this") }}</span>
-          </v-tooltip>
-        </v-row>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { whenever } from "@vueuse/core";
-import { formatISO } from "date-fns";
-import { useUserApi } from "~/composables/api";
-import { alert } from "~/composables/use-toast";
-import { useHouseholdSelf } from "~/composables/use-households";
-import type { Recipe, RecipeTimelineEventIn, RecipeTimelineEventOut } from "~/lib/api/types/recipe";
-import type { VForm } from "~/types/auto-forms";
-
-const props = defineProps<{ recipe: Recipe }>();
-const emit = defineEmits<{
-  eventCreated: [event: RecipeTimelineEventOut];
-}>();
-
-const madeThisDialog = ref(false);
-const userApi = useUserApi();
-const { household } = useHouseholdSelf();
-const i18n = useI18n();
-const auth = useMealieAuth();
-const domMadeThisForm = ref<VForm>();
-const newTimelineEvent = ref<RecipeTimelineEventIn>({
-  subject: "",
-  eventType: "comment",
-  eventMessage: "",
-  timestamp: undefined,
-  recipeId: props.recipe?.id || "",
-});
-const newTimelineEventImage = ref<Blob | File>();
-const newTimelineEventImageName = ref<string>("");
-const newTimelineEventImagePreviewUrl = ref<string>();
-const newTimelineEventTimestamp = ref<Date>(new Date());
-const newTimelineEventTimestampString = computed(() => {
-  return formatISO(newTimelineEventTimestamp.value, { representation: "date" });
-});
-
-const lastMade = ref(props.recipe.lastMade);
-const lastMadeReady = ref(false);
-onMounted(async () => {
-  if (!auth.user?.value?.householdSlug) {
-    lastMade.value = props.recipe.lastMade;
-  }
-  else {
-    const { data } = await userApi.households.getCurrentUserHouseholdRecipe(props.recipe.slug || "");
-    lastMade.value = data?.lastMade;
-  }
-
-  lastMadeReady.value = true;
-});
-
-const childRecipes = computed(() => {
-  return props.recipe.recipeIngredient?.map((ingredient) => {
-    if (ingredient.referencedRecipe) {
-      return {
-        checked: false, // Default value for checked
-        recipeId: ingredient.referencedRecipe.id || "", // Non-nullable recipeId
-        ...ingredient.referencedRecipe, // Spread the rest of the referencedRecipe properties
-      };
-    }
-    else {
-      return undefined;
-    }
-  }).filter(recipe => recipe !== undefined); // Filter out undefined values
-});
-
-whenever(
-  () => madeThisDialog.value,
-  () => {
-    // Set timestamp to now
-    newTimelineEventTimestamp.value = new Date();
-  },
-);
-
-const firstDayOfWeek = computed(() => {
-  return household.value?.preferences?.firstDayOfWeek || 0;
-});
-
-function clearImage() {
-  newTimelineEventImage.value = undefined;
-  newTimelineEventImageName.value = "";
-  newTimelineEventImagePreviewUrl.value = undefined;
-}
-
-function uploadImage(fileObject: File) {
-  newTimelineEventImage.value = fileObject;
-  newTimelineEventImageName.value = fileObject.name;
-  newTimelineEventImagePreviewUrl.value = URL.createObjectURL(fileObject);
-}
-
-function updateUploadedImage(fileObject: Blob) {
-  newTimelineEventImage.value = fileObject;
-  newTimelineEventImagePreviewUrl.value = URL.createObjectURL(fileObject);
-}
-
-const datePickerMenu = ref(false);
-const madeThisFormLoading = ref(false);
-
-function resetMadeThisForm() {
-  madeThisFormLoading.value = false;
-
-  newTimelineEvent.value.eventMessage = "";
-  newTimelineEvent.value.timestamp = undefined;
-  clearImage();
-  madeThisDialog.value = false;
-  domMadeThisForm.value?.reset();
-}
-
-async function createTimelineEvent() {
-  if (!(newTimelineEventTimestampString.value && props.recipe?.id && props.recipe?.slug)) {
-    return;
-  }
-
-  madeThisFormLoading.value = true;
-
-  newTimelineEvent.value.recipeId = props.recipe.id;
-  // Note: auth.user is now a ref
-  newTimelineEvent.value.subject = i18n.t("recipe.user-made-this", { user: auth.user.value?.fullName });
-
-  // the user only selects the date, so we set the time to end of day local time
-  // we choose the end of day so it always comes after "new recipe" events
-  newTimelineEvent.value.timestamp = new Date(newTimelineEventTimestampString.value + "T23:59:59").toISOString();
-
-  let newEvent: RecipeTimelineEventOut | null = null;
-  try {
-    const eventResponse = await userApi.recipes.createTimelineEvent(newTimelineEvent.value);
-    newEvent = eventResponse.data;
-    if (!newEvent) {
-      throw new Error("No event created");
-    }
-  }
-  catch (error) {
-    console.error("Failed to create timeline event:", error);
-    alert.error(i18n.t("recipe.failed-to-add-to-timeline"));
-    resetMadeThisForm();
-    return;
-  }
-
-  // we also update the recipe's last made value
-  if (!lastMade.value || newTimelineEvent.value.timestamp > lastMade.value) {
-    try {
-      lastMade.value = newTimelineEvent.value.timestamp;
-      await userApi.recipes.updateLastMade(props.recipe.slug, newTimelineEvent.value.timestamp);
-    }
-    catch (error) {
-      console.error("Failed to update last made date:", error);
-      alert.error(i18n.t("recipe.failed-to-update-recipe"));
-    }
-  }
-
-  for (const childRecipe of childRecipes.value || []) {
-    if (!childRecipe.checked) {
-      continue;
-    }
-
-    const childTimelineEvent = {
-      ...newTimelineEvent.value,
-      recipeId: childRecipe.recipeId,
-      eventMessage: i18n.t("recipe.made-for-recipe", { recipe: childRecipe.name }),
-      image: undefined,
-    };
-    try {
-      await userApi.recipes.createTimelineEvent(childTimelineEvent);
-    }
-    catch (error) {
-      console.error(`Failed to create timeline event for child recipe ${childRecipe.slug}:`, error);
-    }
-
-    if (
-      newTimelineEvent.value.timestamp
-      && (!childRecipe.lastMade || newTimelineEvent.value.timestamp > childRecipe.lastMade)
-    ) {
-      try {
-        await userApi.recipes.updateLastMade(childRecipe.slug || "", newTimelineEvent.value.timestamp);
-      }
-      catch (error) {
-        console.error(`Failed to update last made date for child recipe ${childRecipe.slug}:`, error);
-      }
-    }
-  }
-
-  // update the image, if provided
-  let imageError = false;
-  if (newTimelineEventImage.value) {
-    try {
-      const imageResponse = await userApi.recipes.updateTimelineEventImage(
-        newEvent.id,
-        newTimelineEventImage.value,
-        newTimelineEventImageName.value,
-      );
-      if (imageResponse.data) {
-        newEvent.image = imageResponse.data.image;
-      }
-    }
-    catch (error) {
-      imageError = true;
-      console.error("Failed to upload image for timeline event:", error);
-    }
-  }
-  if (imageError) {
-    alert.error(i18n.t("recipe.added-to-timeline-but-failed-to-add-image"));
-  }
-  else {
-    alert.success(i18n.t("recipe.added-to-timeline"));
-  }
-
-  resetMadeThisForm();
-  emit("eventCreated", newEvent);
-}
-</script>

frontend/app/components/Domain/Recipe/RecipeList.vue

@@ -1,171 +0,0 @@
-<template>
-  <v-list :class="tile ? 'd-flex flex-wrap background' : 'background'" style="background-color: transparent;">
-    <v-sheet
-      v-for="recipe, index in recipes"
-      :key="recipe.id"
-      :elevation="2"
-      :class="attrs.class.sheet"
-      :style="tile ? 'max-width: 100%; width: fit-content;' : 'width: 100%;'"
-    >
-      <v-list-item
-        :to="disabled ? '' : '/g/' + groupSlug + '/r/' + recipe.slug"
-        :class="attrs.class.listItem"
-      >
-        <template #prepend>
-          <v-avatar color="primary" :class="attrs.class.avatar">
-            <v-icon
-              :class="attrs.class.icon"
-              dark
-              :size="small ? 'small' : 'default'"
-            >
-              {{ $globals.icons.primary }}
-            </v-icon>
-          </v-avatar>
-        </template>
-        <div :class="attrs.class.text">
-          <v-list-item-title
-            :class="listItem && listItemDescriptions[index] ? '' : 'pr-4'"
-            :style="attrs.style.text.title"
-          >
-            {{ recipe.name }}
-          </v-list-item-title>
-          <v-list-item-subtitle v-if="showDescription">
-            {{ recipe.description }}
-          </v-list-item-subtitle>
-          <v-list-item-subtitle
-            v-if="listItem && listItemDescriptions[index]"
-            :style="attrs.style.text.subTitle"
-          >
-            <!-- eslint-disable-next-line vue/no-v-html -->
-            <div v-html="listItemDescriptions[index]" />
-          </v-list-item-subtitle>
-        </div>
-        <template #append>
-          <slot
-            :name="'actions-' + recipe.id"
-            :v-bind="{ item: recipe }"
-          />
-        </template>
-      </v-list-item>
-    </v-sheet>
-  </v-list>
-</template>
-
-<script setup lang="ts">
-import DOMPurify from "dompurify";
-import { useFraction } from "~/composables/recipes/use-fraction";
-import type { ShoppingListItemOut } from "~/lib/api/types/household";
-import type { RecipeSummary } from "~/lib/api/types/recipe";
-
-interface Props {
-  recipes: RecipeSummary[];
-  listItem?: ShoppingListItemOut;
-  small?: boolean;
-  tile?: boolean;
-  showDescription?: boolean;
-  disabled?: boolean;
-}
-const props = withDefaults(defineProps<Props>(), {
-  listItem: undefined,
-  small: false,
-  tile: false,
-  showDescription: false,
-  disabled: false,
-});
-
-const auth = useMealieAuth();
-const { frac } = useFraction();
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug || auth.user?.value?.groupSlug || "");
-
-const attrs = computed(() => {
-  return props.small
-    ? {
-        class: {
-          sheet: props.tile ? "mb-1 me-1 justify-center align-center" : "mb-1 justify-center align-center",
-          listItem: "px-0",
-          avatar: "ma-0",
-          icon: "ma-0 pa-0 primary",
-          text: "pa-0",
-        },
-        style: {
-          text: {
-            title: "font-size: small;",
-            subTitle: "font-size: x-small;",
-          },
-        },
-      }
-    : {
-        class: {
-          sheet: props.tile ? "mx-1 justify-center align-center" : "mb-1 justify-center align-center",
-          listItem: "px-4",
-          avatar: "",
-          icon: "pa-1 primary",
-          text: "",
-        },
-        style: {
-          text: {
-            title: "",
-            subTitle: "",
-          },
-        },
-      };
-});
-
-function sanitizeHTML(rawHtml: string) {
-  return DOMPurify.sanitize(rawHtml, {
-    USE_PROFILES: { html: true },
-    ALLOWED_TAGS: ["strong", "sup"],
-  });
-}
-
-const listItemDescriptions = computed<string[]>(() => {
-  if (
-    props.recipes.length === 1 // we don't need to specify details if there's only one recipe ref
-    || !props.listItem?.recipeReferences
-    || props.listItem.recipeReferences.length !== props.recipes.length
-  ) {
-    return props.recipes.map(_ => "");
-  }
-
-  const listItemDescriptions: string[] = [];
-  for (let i = 0; i < props.recipes.length; i++) {
-    const itemRef = props.listItem?.recipeReferences[i];
-    const quantity = (itemRef.recipeQuantity || 1) * (itemRef.recipeScale || 1);
-
-    let listItemDescription = "";
-    if (props.listItem.unit?.fraction) {
-      const fraction = frac(quantity, 10, true);
-      if (fraction[0] !== undefined && fraction[0] > 0) {
-        listItemDescription += fraction[0];
-      }
-
-      if (fraction[1] > 0) {
-        listItemDescription += ` <sup>${fraction[1]}</sup>&frasl;<sub>${fraction[2]}</sub>`;
-      }
-      else {
-        listItemDescription = (quantity).toString();
-      }
-    }
-    else {
-      listItemDescription = (Math.round(quantity * 100) / 100).toString();
-    }
-
-    if (props.listItem.unit) {
-      const unitDisplay = props.listItem.unit.useAbbreviation && props.listItem.unit.abbreviation
-        ? props.listItem.unit.abbreviation
-        : props.listItem.unit.name;
-
-      listItemDescription += ` ${unitDisplay}`;
-    }
-
-    if (itemRef.recipeNote) {
-      listItemDescription += `, ${itemRef.recipeNote}`;
-    }
-
-    listItemDescriptions.push(sanitizeHTML(listItemDescription));
-  }
-
-  return listItemDescriptions;
-});
-</script>

frontend/app/components/Domain/Recipe/RecipeOrganizerDialog.vue

@@ -1,122 +0,0 @@
-<template>
-  <div>
-    <BaseDialog
-      v-model="dialog"
-      width="500"
-      :title="properties.title"
-      :icon="properties.icon"
-      can-submit
-      :submit-disabled="!name"
-      @submit="select"
-    >
-      <v-form>
-        <v-card-text>
-          <v-text-field
-            v-model="name"
-            :label="properties.label"
-            :rules="[rules.required]"
-            autofocus
-          />
-          <v-checkbox
-            v-if="itemType === Organizer.Tool"
-            v-model="onHand"
-            :label="$t('tool.on-hand')"
-          />
-        </v-card-text>
-      </v-form>
-    </BaseDialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useUserApi } from "~/composables/api";
-import { useCategoryStore, useTagStore, useToolStore } from "~/composables/store";
-import { type RecipeOrganizer, Organizer } from "~/lib/api/types/non-generated";
-
-const { $globals } = useNuxtApp();
-
-const CREATED_ITEM_EVENT = "created-item";
-
-interface Props {
-  color?: string | null;
-  tagDialog?: boolean;
-  itemType?: RecipeOrganizer;
-}
-const props = withDefaults(defineProps<Props>(), {
-  color: null,
-  tagDialog: true,
-  itemType: "category" as RecipeOrganizer,
-});
-
-const emit = defineEmits<{
-  "created-item": [item: any];
-}>();
-
-const dialog = defineModel<boolean>({ default: false });
-
-const i18n = useI18n();
-
-const name = ref("");
-const onHand = ref(false);
-
-watch(
-  dialog,
-  (val: boolean) => {
-    if (!val) name.value = "";
-  },
-);
-
-const userApi = useUserApi();
-
-const store = (() => {
-  switch (props.itemType) {
-    case Organizer.Tag:
-      return useTagStore();
-    case Organizer.Tool:
-      return useToolStore();
-    default:
-      return useCategoryStore();
-  }
-})();
-
-const properties = computed(() => {
-  switch (props.itemType) {
-    case Organizer.Tag:
-      return {
-        title: i18n.t("tag.create-a-tag"),
-        label: i18n.t("tag.tag-name"),
-        icon: $globals.icons.tags,
-        api: userApi.tags,
-      };
-    case Organizer.Tool:
-      return {
-        title: i18n.t("tool.create-a-tool"),
-        label: i18n.t("tool.tool-name"),
-        icon: $globals.icons.potSteam,
-        api: userApi.tools,
-      };
-    default:
-      return {
-        title: i18n.t("category.create-a-category"),
-        label: i18n.t("category.category-name"),
-        icon: $globals.icons.categories,
-        api: userApi.categories,
-      };
-  }
-});
-
-const rules = {
-  required: (val: string) => !!val || (i18n.t("general.a-name-is-required") as string),
-};
-
-async function select() {
-  if (store) {
-    // @ts-expect-error the same state is used for different organizer types, which have different requirements
-    const newItem = await store.actions.createOne({ name: name.value, onHand: onHand.value });
-    emit(CREATED_ITEM_EVENT, newItem);
-  }
-  dialog.value = false;
-}
-</script>
-
-<style></style>

frontend/app/components/Domain/Recipe/RecipeOrganizerPage.vue

@@ -1,264 +0,0 @@
-<template>
-  <div v-if="items">
-    <RecipeOrganizerDialog
-      v-model="dialogs.organizer"
-      :item-type="itemType"
-    />
-
-    <BaseDialog
-      v-if="deleteTarget"
-      v-model="dialogs.delete"
-      :title="$t('general.delete-with-name', { name: $t(translationKey) })"
-      color="error"
-      :icon="$globals.icons.alertCircle"
-      can-confirm
-      @confirm="deleteOne()"
-    >
-      <v-card-text>
-        <p>{{ $t("general.confirm-delete-generic-with-name", { name: $t(translationKey) }) }}</p>
-        <p class="mt-4 mb-0 ml-4">
-          {{ deleteTarget.name }}
-        </p>
-      </v-card-text>
-    </BaseDialog>
-
-    <BaseDialog
-      v-if="updateTarget"
-      v-model="dialogs.update"
-      :title="$t('general.update')"
-      :icon="$globals.icons.edit"
-      can-confirm
-      @confirm="updateOne()"
-    >
-      <v-card-text>
-        <v-text-field
-          v-model="updateTarget.name"
-          :label="$t('general.name')"
-        />
-        <v-checkbox
-          v-if="itemType === Organizer.Tool"
-          v-model="updateTarget.onHand"
-          :label="$t('tool.on-hand')"
-        />
-      </v-card-text>
-    </BaseDialog>
-
-    <v-row density="comfortable">
-      <v-col>
-        <v-text-field
-          v-model="searchString"
-          variant="outlined"
-          autofocus
-          color="primary accent-3"
-          :placeholder="$t('search.search-placeholder')"
-          :prepend-inner-icon="$globals.icons.search"
-          clearable
-        />
-      </v-col>
-    </v-row>
-
-    <v-row
-      color="transparent"
-      flat
-      class="mt-n1 rounded align-center position-relative w-100 left-0 top-0"
-    >
-      <v-icon
-        size="large"
-        start
-      >
-        {{ icon }}
-      </v-icon>
-      <v-toolbar-title class="headline">
-        <slot name="title" />
-      </v-toolbar-title>
-      <v-spacer />
-      <BaseButton
-        create
-        @click="dialogs.organizer = true"
-      />
-    </v-row>
-    <section
-      v-for="(itms, key, idx) in itemsSorted"
-      :key="'header' + idx"
-      :class="idx === 1 ? null : 'my-4'"
-    >
-      <BaseCardSectionTitle
-        v-if="isTitle(key)"
-        :title="key"
-      />
-      <v-row>
-        <v-col
-          v-for="(item, index) in itms"
-          :key="'cat' + index"
-          cols="12"
-          :sm="12"
-          :md="6"
-          :lg="4"
-          :xl="3"
-        >
-          <v-card
-            v-if="item"
-            class="left-border"
-            hover
-            :to="`/g/${groupSlug}?${itemType}=${item.id}`"
-          >
-            <v-card-actions>
-              <v-icon>
-                {{ icon }}
-              </v-icon>
-              <v-card-title class="py-1 text-truncate flex-shrink-1 flex-grow-1">
-                {{ item.name }}
-              </v-card-title>
-              <ContextMenu
-                :items="[presets.delete, presets.edit]"
-                @delete="confirmDelete(item)"
-                @edit="openUpdateDialog(item)"
-              />
-            </v-card-actions>
-          </v-card>
-        </v-col>
-      </v-row>
-    </section>
-  </div>
-</template>
-
-<script setup lang="ts">
-import Fuse from "fuse.js";
-import { useContextPresets } from "~/composables/use-context-presents";
-import RecipeOrganizerDialog from "~/components/Domain/Recipe/RecipeOrganizerDialog.vue";
-import { Organizer, type RecipeOrganizer } from "~/lib/api/types/non-generated";
-import { useRouteQuery } from "~/composables/use-router";
-import { deepCopy } from "~/composables/use-utils";
-
-interface GenericItem {
-  id: string;
-  name: string;
-  slug: string;
-  onHand: boolean;
-}
-
-const props = defineProps<{
-  items: GenericItem[];
-  icon: string;
-  itemType: RecipeOrganizer;
-}>();
-
-const emit = defineEmits<{
-  update: [item: GenericItem];
-  delete: [id: string];
-}>();
-
-const state = reactive({
-  // Search Options
-  options: {
-    ignoreLocation: true,
-    shouldSort: true,
-    threshold: 0.2,
-    location: 0,
-    distance: 20,
-    findAllMatches: true,
-    maxPatternLength: 32,
-    minMatchCharLength: 1,
-    keys: ["name"],
-  },
-});
-
-const auth = useMealieAuth();
-const route = useRoute();
-const groupSlug = computed(() => route.params.groupSlug as string || auth.user?.value?.groupSlug || "");
-
-// =================================================================
-// Context Menu
-
-const dialogs = ref({
-  organizer: false,
-  update: false,
-  delete: false,
-});
-
-const presets = useContextPresets();
-
-const translationKey = computed<string>(() => {
-  const typeMap = {
-    categories: "category.category",
-    tags: "tag.tag",
-    tools: "tool.tool",
-    foods: "shopping-list.food",
-    households: "household.household",
-  };
-  return typeMap[props.itemType] || "";
-});
-
-const deleteTarget = ref<GenericItem | null>(null);
-const updateTarget = ref<GenericItem | null>(null);
-
-function confirmDelete(item: GenericItem) {
-  deleteTarget.value = item;
-  dialogs.value.delete = true;
-}
-
-function deleteOne() {
-  if (!deleteTarget.value) {
-    return;
-  }
-
-  emit("delete", deleteTarget.value.id);
-}
-
-function openUpdateDialog(item: GenericItem) {
-  updateTarget.value = deepCopy(item);
-  dialogs.value.update = true;
-}
-
-function updateOne() {
-  if (!updateTarget.value) {
-    return;
-  }
-
-  emit("update", updateTarget.value);
-}
-
-// ================================================================
-// Search Functions
-
-const searchString = useRouteQuery("q", "");
-
-const fuse = computed(() => {
-  return new Fuse(props.items, state.options);
-});
-
-const fuzzyItems = computed<GenericItem[]>(() => {
-  if (searchString.value.trim() === "") {
-    return props.items;
-  }
-  const result = fuse.value.search(searchString.value.trim() as string);
-  return result.map(x => x.item);
-});
-
-// =================================================================
-// Sorted Items
-
-const itemsSorted = computed(() => {
-  const byLetter: { [key: string]: Array<GenericItem> } = {};
-
-  if (!fuzzyItems.value) {
-    return byLetter;
-  }
-
-  [...fuzzyItems.value]
-    .sort((a, b) => a.name.localeCompare(b.name))
-    .forEach((item) => {
-      const letter = item.name[0].toUpperCase();
-      if (!byLetter[letter]) {
-        byLetter[letter] = [];
-      }
-      byLetter[letter].push(item);
-    });
-
-  return byLetter;
-});
-
-function isTitle(str: number | string) {
-  return typeof str === "string" && str.length === 1;
-}
-</script>