Ignore codewhale

Remove Stripe/Cashier subscription billing, demo mode, and APP_MODE enum/helpers. Delete frontend-old/ and stale bin scripts. Adopt AGPL-3.0 (LICENSE.md, README, composer.json). Point Docker image, prod scripts, and README at forge.lvl0.xyz/lvl0/dishplanner.

.dockerignore

@@ -47,9 +47,6 @@ Dockerfile*
 docker-compose*.yml
 .dockerignore
 
-# Frontend old
-frontend-old/
-
 # Build artifacts
 public/build/
 public/hot

.gitignore

@@ -24,3 +24,4 @@ yarn-error.log
 /.vscode
 /.zed
 /.vite
+/.codewhale

LICENSE.md

@@ -1,5 +1,5 @@
-                    GNU GENERAL PUBLIC LICENSE
-                       Version 3, 29 June 2007
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
 
  Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
  Everyone is permitted to copy and distribute verbatim copies
@@ -7,17 +7,15 @@
 
                             Preamble
 
-The GNU General Public License is a free, copyleft license for
-software and other kinds of works.
+  The GNU Affero General Public License is a free, copyleft license for
+software and other kinds of works, specifically designed to ensure
+cooperation with the community in the case of network server software.
 
   The licenses for most software and other practical works are designed
 to take away your freedom to share and change the works.  By contrast,
-the GNU General Public License is intended to guarantee your freedom to
+our General Public Licenses are intended to guarantee your freedom to
 share and change all versions of a program--to make sure it remains free
-software for all its users.  We, the Free Software Foundation, use the
-GNU General Public License for most of our software; it applies also to
-any other work released this way by its authors.  You can apply it to
-your programs, too.
+software for all its users.
 
   When we speak of free software, we are referring to freedom, not
 price.  Our General Public Licenses are designed to make sure that you
@@ -26,44 +24,34 @@
 want it, that you can change the software or use pieces of it in new
 free programs, and that you know you can do these things.
 
-To protect your rights, we need to prevent others from denying you
-these rights or asking you to surrender the rights.  Therefore, you have
-certain responsibilities if you distribute copies of the software, or if
-you modify it: responsibilities to respect the freedom of others.
+  Developers that use our General Public Licenses protect your rights
+with two steps: (1) assert copyright on the software, and (2) offer
+you this License which gives you legal permission to copy, distribute
+and/or modify the software.
 
-For example, if you distribute copies of such a program, whether
-gratis or for a fee, you must pass on to the recipients the same
-freedoms that you received.  You must make sure that they, too, receive
-or can get the source code.  And you must show them these terms so they
-know their rights.
+  A secondary benefit of defending all users' freedom is that
+improvements made in alternate versions of the program, if they
+receive widespread use, become available for other developers to
+incorporate.  Many developers of free software are heartened and
+encouraged by the resulting cooperation.  However, in the case of
+software used on network servers, this result may fail to come about.
+The GNU General Public License permits making a modified version and
+letting the public access it on a server without ever releasing its
+source code to the public.
 
-Developers that use the GNU GPL protect your rights with two steps:
-(1) assert copyright on the software, and (2) offer you this License
-giving you legal permission to copy, distribute and/or modify it.
+  The GNU Affero General Public License is designed specifically to
+ensure that, in such cases, the modified source code becomes available
+to the community.  It requires the operator of a network server to
+provide the source code of the modified version running there to the
+users of that server.  Therefore, public use of a modified version, on
+a publicly accessible server, gives the public access to the source
+code of the modified version.
 
-For the developers' and authors' protection, the GPL clearly explains
-that there is no warranty for this free software.  For both users' and
-authors' sake, the GPL requires that modified versions be marked as
-changed, so that their problems will not be attributed erroneously to
-authors of previous versions.
-
-Some devices are designed to deny users access to install or run
-modified versions of the software inside them, although the manufacturer
-can do so.  This is fundamentally incompatible with the aim of
-protecting users' freedom to change the software.  The systematic
-pattern of such abuse occurs in the area of products for individuals to
-use, which is precisely where it is most unacceptable.  Therefore, we
-have designed this version of the GPL to prohibit the practice for those
-products.  If such problems arise substantially in other domains, we
-stand ready to extend this provision to those domains in future versions
-of the GPL, as needed to protect the freedom of users.
-
-Finally, every program is threatened constantly by software patents.
-States should not allow patents to restrict development and use of
-software on general-purpose computers, but in those that do, we wish to
-avoid the special danger that patents applied to a free program could
-make it effectively proprietary.  To prevent this, the GPL assures that
-patents cannot be used to render the program non-free.
+  An older license, called the Affero General Public License and
+published by Affero, was designed to accomplish similar goals.  This is
+a different license, not a version of the Affero GPL, but Affero has
+released a new version of the Affero GPL which permits relicensing under
+this license.
 
   The precise terms and conditions for copying, distribution and
 modification follow.
@@ -72,7 +60,7 @@
 
   0. Definitions.
 
-"This License" refers to version 3 of the GNU General Public License.
+  "This License" refers to version 3 of the GNU Affero General Public License.
 
   "Copyright" also means copyright-like laws that apply to other kinds of
 works, such as semiconductor masks.
@@ -549,35 +537,45 @@
 the Program, the only way you could satisfy both those terms and this
 License would be to refrain entirely from conveying the Program.
 
-13. Use with the GNU Affero General Public License.
+  13. Remote Network Interaction; Use with the GNU General Public License.
+
+  Notwithstanding any other provision of this License, if you modify the
+Program, your modified version must prominently offer all users
+interacting with it remotely through a computer network (if your version
+supports such interaction) an opportunity to receive the Corresponding
+Source of your version by providing access to the Corresponding Source
+from a network server at no charge, through some standard or customary
+means of facilitating copying of software.  This Corresponding Source
+shall include the Corresponding Source for any work covered by version 3
+of the GNU General Public License that is incorporated pursuant to the
+following paragraph.
 
   Notwithstanding any other provision of this License, you have
 permission to link or combine any covered work with a work licensed
-under version 3 of the GNU Affero General Public License into a single
+under version 3 of the GNU General Public License into a single
 combined work, and to convey the resulting work.  The terms of this
 License will continue to apply to the part which is the covered work,
-but the special requirements of the GNU Affero General Public License,
-section 13, concerning interaction through a network will apply to the
-combination as such.
+but the work with which it is combined will remain governed by version
+3 of the GNU General Public License.
 
   14. Revised Versions of this License.
 
   The Free Software Foundation may publish revised and/or new versions of
-the GNU General Public License from time to time.  Such new versions will
-be similar in spirit to the present version, but may differ in detail to
+the GNU Affero General Public License from time to time.  Such new versions
+will be similar in spirit to the present version, but may differ in detail to
 address new problems or concerns.
 
   Each version is given a distinguishing version number.  If the
-Program specifies that a certain numbered version of the GNU General
+Program specifies that a certain numbered version of the GNU Affero General
 Public License "or any later version" applies to it, you have the
 option of following the terms and conditions either of that numbered
 version or of any later version published by the Free Software
 Foundation.  If the Program does not specify a version number of the
-GNU General Public License, you may choose any version ever published
+GNU Affero General Public License, you may choose any version ever published
 by the Free Software Foundation.
 
   If the Program specifies that a proxy can decide which future
-versions of the GNU General Public License can be used, that proxy's
+versions of the GNU Affero General Public License can be used, that proxy's
 public statement of acceptance of a version permanently authorizes you
 to choose that version for the Program.
 
@@ -635,40 +633,29 @@
     Copyright (C) <year>  <name of author>
 
     This program is free software: you can redistribute it and/or modify
-    it under the terms of the GNU General Public License as published by
+    it under the terms of the GNU Affero General Public License as published by
     the Free Software Foundation, either version 3 of the License, or
     (at your option) any later version.
 
     This program is distributed in the hope that it will be useful,
     but WITHOUT ANY WARRANTY; without even the implied warranty of
     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU General Public License for more details.
+    GNU Affero General Public License for more details.
 
-    You should have received a copy of the GNU General Public License
+    You should have received a copy of the GNU Affero General Public License
     along with this program.  If not, see <https://www.gnu.org/licenses/>.
 
 Also add information on how to contact you by electronic and paper mail.
 
-If the program does terminal interaction, make it output a short
-notice like this when it starts in an interactive mode:
-
-    <program>  Copyright (C) <year>  <name of author>
-    This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
-    This is free software, and you are welcome to redistribute it
-    under certain conditions; type `show c' for details.
-
-The hypothetical commands `show w' and `show c' should show the appropriate
-parts of the General Public License.  Of course, your program's commands
-might be different; for a GUI interface, you would use an "about box".
+  If your software can interact with users remotely through a computer
+network, you should also make sure that it provides a way for users to
+get its source.  For example, if your program is a web application, its
+interface could display a "Source" link that leads users to an archive
+of the code.  There are many ways you could offer source, and different
+solutions will be better for different programs; see section 13 for the
+specific requirements.
 
   You should also get your employer (if you work as a programmer) or school,
 if any, to sign a "copyright disclaimer" for the program, if necessary.
-For more information on this, and how to apply and follow the GNU GPL, see
+For more information on this, and how to apply and follow the GNU AGPL, see
 <https://www.gnu.org/licenses/>.
-
-The GNU General Public License does not permit incorporating your program
-into proprietary programs.  If your program is a subroutine library, you
-may consider it more useful to permit linking proprietary applications with
-the library.  If this is what you want to do, use the GNU Lesser General
-Public License instead of this License.  But first, please read
-<https://www.gnu.org/licenses/why-not-lgpl.html>.

README.md

@@ -13,14 +13,14 @@ ## ✨ Features
 
 ## 🚀 Self-hosting
 
-The production image is available at `codeberg.org/dish-planner/app:latest`.
+The production image is available at `forge.lvl0.xyz/lvl0/dishplanner:latest`.
 
 ### docker-compose.yml
 
 ```yaml
 services:
   app:
-    image: codeberg.org/dish-planner/app:latest
+    image: forge.lvl0.xyz/lvl0/dishplanner:latest
     container_name: dishplanner_app
     restart: always
     ports:
@@ -85,8 +85,8 @@ ## 🔧 Development
 ### NixOS / Nix
 
 ```bash
-git clone https://codeberg.org/dish-planner/app.git
-cd dish-planner
+git clone https://forge.lvl0.xyz/lvl0/dishplanner.git
+cd dishplanner
 nix-shell
 ```
 
@@ -121,8 +121,8 @@ ### Other Platforms
 
 ## 📄 License
 
-This project is open-source software licensed under the [MIT license](LICENSE.md).
+This project is open-source software licensed under the [AGPL-3.0 license](LICENSE.md).
 
 ## 📞 Support
 
-For issues and questions, please use [Codeberg Issues](https://codeberg.org/dish-planner/app/issues).
+For issues and questions, please use [Forgejo Issues](https://forge.lvl0.xyz/lvl0/dishplanner/issues).

app/Console/Commands/PurgeDemoAccountsCommand.php

@@ -1,28 +0,0 @@
-<?php
-
-namespace App\Console\Commands;
-
-use App\Models\Planner;
-use Illuminate\Console\Command;
-
-class PurgeDemoAccountsCommand extends Command
-{
-    protected $signature = 'demo:purge';
-
-    protected $description = 'Purge demo accounts older than 24 hours';
-
-    public function handle(): int
-    {
-        if (! is_mode_demo()) {
-            $this->error('This command can only run in demo mode.');
-
-            return self::FAILURE;
-        }
-
-        $count = Planner::where('created_at', '<', now()->subHours(24))->delete();
-
-        $this->info("Purged {$count} demo accounts.");
-
-        return self::SUCCESS;
-    }
-}

app/Enums/AppModeEnum.php

@@ -1,40 +0,0 @@
-<?php
-
-namespace App\Enums;
-
-enum AppModeEnum: string
-{
-    case APP = 'app';
-    case SAAS = 'saas';
-    case DEMO = 'demo';
-
-    public static function current(): self
-    {
-        return self::from(config('app.mode', 'app'));
-    }
-
-    public function isApp(): bool
-    {
-        return $this === self::APP;
-    }
-
-    public function isSaas(): bool
-    {
-        return $this === self::SAAS;
-    }
-
-    public function isDemo(): bool
-    {
-        return $this === self::DEMO;
-    }
-
-    public function requiresSubscription(): bool
-    {
-        return $this === self::SAAS;
-    }
-
-    public function allowsLogout(): bool
-    {
-        return $this !== self::DEMO;
-    }
-}

app/Http/Controllers/Auth/LoginController.php

@@ -34,10 +34,6 @@ public function login(Request $request)
 
     public function logout(Request $request)
     {
-        if (is_mode_demo()) {
-            return redirect()->route('dashboard');
-        }
-
         Auth::logout();
 
         $request->session()->invalidate();

app/Http/Controllers/SubscriptionController.php

@@ -1,112 +0,0 @@
-<?php
-
-namespace App\Http\Controllers;
-
-use Illuminate\Http\RedirectResponse;
-use Illuminate\Http\Request;
-use Laravel\Cashier\Cashier;
-use Symfony\Component\HttpFoundation\Response;
-
-class SubscriptionController extends Controller
-{
-    public function checkout(Request $request)
-    {
-        $planner = $request->user();
-
-        if ($planner->subscribed()) {
-            return redirect()->route('dashboard');
-        }
-
-        $plan = $request->input('plan', 'monthly');
-        $priceId = $plan === 'yearly'
-            ? config('services.stripe.price_yearly')
-            : config('services.stripe.price_monthly');
-
-        return $planner->newSubscription('default', $priceId)
-            ->checkout([
-                'success_url' => route('subscription.success') . '?session_id={CHECKOUT_SESSION_ID}',
-                'cancel_url' => route('subscription.index'),
-            ]);
-    }
-
-    public function success(Request $request): RedirectResponse
-    {
-        $sessionId = $request->query('session_id');
-
-        if ($sessionId) {
-            $planner = $request->user();
-            $session = Cashier::stripe()->checkout->sessions->retrieve($sessionId, [
-                'expand' => ['subscription'],
-            ]);
-
-            if ($session->subscription && ! $planner->subscribed()) {
-                $subscription = $session->subscription;
-
-                $planner->subscriptions()->create([
-                    'type' => 'default',
-                    'stripe_id' => $subscription->id,
-                    'stripe_status' => $subscription->status,
-                    'stripe_price' => $subscription->items->data[0]->price->id ?? null,
-                    'quantity' => $subscription->items->data[0]->quantity ?? 1,
-                    'trial_ends_at' => $subscription->trial_end ? now()->setTimestamp($subscription->trial_end) : null,
-                    'ends_at' => null,
-                ]);
-            }
-        }
-
-        return redirect()->route('dashboard')->with('success', 'Subscription activated!');
-    }
-
-    public function billing(Request $request)
-    {
-        $planner = $request->user();
-        $subscription = $planner->subscription();
-
-        if (! $subscription) {
-            return redirect()->route('subscription.index');
-        }
-
-        $planType = match ($subscription->stripe_price) {
-            config('services.stripe.price_yearly') => 'Yearly',
-            config('services.stripe.price_monthly') => 'Monthly',
-            default => 'Unknown',
-        };
-
-        $nextBillingDate = null;
-        if ($subscription->stripe_status === 'active') {
-            try {
-                $stripeSubscription = Cashier::stripe()->subscriptions->retrieve($subscription->stripe_id);
-                $nextBillingDate = $stripeSubscription->current_period_end
-                    ? now()->setTimestamp($stripeSubscription->current_period_end)
-                    : null;
-            } catch (\Exception $e) {
-                // Stripe API error - continue without next billing date
-            }
-        }
-
-        return view('billing.index', [
-            'subscription' => $subscription,
-            'planner' => $planner,
-            'planType' => $planType,
-            'nextBillingDate' => $nextBillingDate,
-        ]);
-    }
-
-    public function cancel(Request $request): RedirectResponse
-    {
-        $planner = $request->user();
-
-        if (! $planner->subscribed()) {
-            return back()->with('error', 'No active subscription found.');
-        }
-
-        $planner->subscription()->cancel();
-
-        return back()->with('success', 'Subscription canceled. Access will continue until the end of your billing period.');
-    }
-
-    public function billingPortal(Request $request)
-    {
-        return $request->user()->redirectToBillingPortal(route('billing'));
-    }
-}

app/Http/Middleware/DemoMiddleware.php

@@ -1,43 +0,0 @@
-<?php
-
-namespace App\Http\Middleware;
-
-use App\Models\Planner;
-use Closure;
-use DishPlanner\Planner\Actions\SeedDemoPlannerAction;
-use Illuminate\Http\Request;
-use Illuminate\Support\Facades\Auth;
-use Illuminate\Support\Facades\DB;
-use Illuminate\Support\Facades\Hash;
-use Illuminate\Support\Str;
-use Symfony\Component\HttpFoundation\Response;
-
-class DemoMiddleware
-{
-    public function handle(Request $request, Closure $next): Response
-    {
-        if (! is_mode_demo()) {
-            return $next($request);
-        }
-
-        if (Auth::check()) {
-            return $next($request);
-        }
-
-        $planner = DB::transaction(function () {
-            $planner = Planner::create([
-                'name' => 'Demo User',
-                'email' => 'demo-' . Str::uuid() . '@demo.local',
-                'password' => Hash::make(Str::random(32)),
-            ]);
-
-            resolve(SeedDemoPlannerAction::class)->execute($planner);
-
-            return $planner;
-        });
-
-        Auth::login($planner);
-
-        return $next($request);
-    }
-}

app/Http/Middleware/RequireSaasMode.php

@@ -1,19 +0,0 @@
-<?php
-
-namespace App\Http\Middleware;
-
-use Closure;
-use Illuminate\Http\Request;
-use Symfony\Component\HttpFoundation\Response;
-
-class RequireSaasMode
-{
-    public function handle(Request $request, Closure $next): Response
-    {
-        if (! is_mode_saas()) {
-            abort(404);
-        }
-
-        return $next($request);
-    }
-}

app/Http/Middleware/RequireSubscription.php

@@ -1,26 +0,0 @@
-<?php
-
-namespace App\Http\Middleware;
-
-use App\Enums\AppModeEnum;
-use Closure;
-use Illuminate\Http\Request;
-use Symfony\Component\HttpFoundation\Response;
-
-class RequireSubscription
-{
-    public function handle(Request $request, Closure $next): Response
-    {
-        if (! AppModeEnum::current()->requiresSubscription()) {
-            return $next($request);
-        }
-
-        $planner = $request->user();
-
-        if (! $planner?->subscribed()) {
-            return redirect()->route('subscription.index');
-        }
-
-        return $next($request);
-    }
-}

app/Models/Planner.php

@@ -7,7 +7,6 @@
 use Illuminate\Database\Eloquent\Relations\HasMany;
 use Illuminate\Foundation\Auth\User as Authenticatable;
 use Illuminate\Notifications\Notifiable;
-use Laravel\Cashier\Billable;
 use Laravel\Sanctum\HasApiTokens;
 
 /**
@@ -19,7 +18,7 @@
  */
 class Planner extends Authenticatable
 {
-    use Billable, HasApiTokens, HasFactory, Notifiable;
+    use HasApiTokens, HasFactory, Notifiable;
 
     protected $fillable = [
         'name', 'email', 'password',

app/Providers/AppServiceProvider.php

@@ -4,12 +4,10 @@
 
 use App\Exceptions\CustomException;
 use App\Models\Dish;
-use App\Models\Planner;
 use App\Models\Schedule;
 use App\Models\ScheduledUserDish;
 use App\Models\User;
 use App\Models\UserDish;
-use Laravel\Cashier\Cashier;
 use DishPlanner\Dish\Policies\DishPolicy;
 use DishPlanner\Schedule\Policies\SchedulePolicy;
 use DishPlanner\ScheduledUserDish\Policies\ScheduledUserDishPolicy;
@@ -47,8 +45,6 @@ public function render($request, Throwable $e)
 
     public function boot(): void
     {
-        Cashier::useCustomerModel(Planner::class);
-
         Gate::policy(Dish::class, DishPolicy::class);
         Gate::policy(Schedule::class, SchedulePolicy::class);
         Gate::policy(ScheduledUserDish::class, ScheduledUserDishPolicy::class);

app/helpers.php

@@ -1,31 +0,0 @@
-<?php
-
-use App\Enums\AppModeEnum;
-
-if (! function_exists('is_mode_app')) {
-    function is_mode_app(): bool
-    {
-        return AppModeEnum::current()->isApp();
-    }
-}
-
-if (! function_exists('is_mode_saas')) {
-    function is_mode_saas(): bool
-    {
-        return AppModeEnum::current()->isSaas();
-    }
-}
-
-if (! function_exists('is_mode_demo')) {
-    function is_mode_demo(): bool
-    {
-        return AppModeEnum::current()->isDemo();
-    }
-}
-
-if (! function_exists('allows_logout')) {
-    function allows_logout(): bool
-    {
-        return AppModeEnum::current()->allowsLogout();
-    }
-}

bin/build_and_push.sh

@@ -1,3 +1,3 @@
 #!/bin/bash
-docker build -t 192.168.178.152:50114/dishplanner-backend .
-docker push 192.168.178.152:50114/dishplanner-backend
+docker build -t forge.lvl0.xyz/lvl0/dishplanner:latest .
+docker push forge.lvl0.xyz/lvl0/dishplanner:latest

bin/start-dev

@@ -1,159 +0,0 @@
-#!/usr/bin/env bash
-set -e
-
-# Colors for output
-RED='\033[0;31m'
-GREEN='\033[0;32m'
-YELLOW='\033[1;33m'
-NC='\033[0m' # No Color
-
-# Get script directory and project root
-SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
-PROJECT_ROOT="$(cd "$SCRIPT_DIR/.." && pwd)"
-
-# Detect Docker or Podman
-CONTAINER_CLI=""
-# Check if docker is actually podman in disguise
-if command -v docker &> /dev/null && docker --version 2>&1 | grep -q "podman"; then
-    CONTAINER_CLI="podman"
-    echo -e "${GREEN}Using Podman (via docker alias)${NC}"
-elif command -v docker &> /dev/null && docker info &> /dev/null; then
-    CONTAINER_CLI="docker"
-    echo -e "${GREEN}Using Docker${NC}"
-elif command -v podman &> /dev/null; then
-    CONTAINER_CLI="podman"
-    echo -e "${GREEN}Using Podman${NC}"
-else
-    echo -e "${RED}✗ Neither Docker nor Podman found. Please install one of them first.${NC}"
-    echo -e "${YELLOW}Install Docker: https://docs.docker.com/get-docker/${NC}"
-    echo -e "${YELLOW}Install Podman: https://podman.io/getting-started/installation${NC}"
-    exit 1
-fi
-
-echo -e "${GREEN}=== Dish Planner Development Setup ===${NC}\n"
-
-# Check if .env exists in backend
-if [ ! -f "$PROJECT_ROOT/backend/.env" ]; then
-    echo -e "${YELLOW}Creating backend/.env from .env.example...${NC}"
-    cp "$PROJECT_ROOT/backend/.env.example" "$PROJECT_ROOT/backend/.env"
-    echo -e "${GREEN}✓ Created backend/.env${NC}\n"
-fi
-
-# Ensure APP_PORT is set for Podman (can't use privileged port 80)
-if [ "$CONTAINER_CLI" = "podman" ] && ! grep -q "^APP_PORT=" "$PROJECT_ROOT/backend/.env"; then
-    echo -e "${YELLOW}Setting APP_PORT=8000 for Podman (non-privileged port)...${NC}"
-    echo "APP_PORT=8000" >> "$PROJECT_ROOT/backend/.env"
-fi
-
-# Backend setup
-echo -e "${GREEN}=== Backend Setup ===${NC}"
-cd "$PROJECT_ROOT/backend"
-
-# Install dependencies if vendor doesn't exist
-if [ ! -d "vendor" ]; then
-    echo -e "${YELLOW}No vendor directory found. Installing dependencies with Docker...${NC}"
-    # Use a standalone PHP/Composer Docker image to install dependencies
-    # This is the recommended Laravel approach for first-time setup
-    # Configure for Docker or Podman
-    VOLUME_OPTS="$PROJECT_ROOT/backend:/var/www/html"
-    USER_OPTS="-u $(id -u):$(id -g)"
-    EXTRA_OPTS=""
-
-    if [ "$CONTAINER_CLI" = "podman" ]; then
-        # Podman on SELinux systems needs :Z and --userns=keep-id to maintain user ID
-        VOLUME_OPTS="$VOLUME_OPTS:Z"
-        USER_OPTS=""
-        EXTRA_OPTS="--userns=keep-id"
-    fi
-
-    $CONTAINER_CLI run --rm \
-        $USER_OPTS \
-        $EXTRA_OPTS \
-        -v "$VOLUME_OPTS" \
-        -w /var/www/html \
-        docker.io/laravelsail/php84-composer:latest \
-        composer install --ignore-platform-reqs
-
-    echo -e "${GREEN}✓ Backend dependencies installed${NC}\n"
-else
-    echo -e "${GREEN}✓ Backend dependencies already installed${NC}\n"
-fi
-
-# Check if database volume exists - if not, we're doing fresh initialization
-FRESH_DB=false
-if ! $CONTAINER_CLI volume inspect sail-mysql &>/dev/null && ! $CONTAINER_CLI volume inspect backend_sail-mysql &>/dev/null; then
-    FRESH_DB=true
-    echo -e "${YELLOW}Fresh database initialization detected${NC}"
-fi
-
-# Start containers using compose directly (docker-compose.override.yml is automatically used)
-echo -e "${YELLOW}Starting backend containers...${NC}"
-if $CONTAINER_CLI compose up -d 2>&1 | tee /tmp/compose-up.log; then
-    echo -e "${GREEN}✓ Containers started${NC}\n"
-else
-    echo -e "${RED}✗ Failed to start containers. Check /tmp/compose-up.log for details${NC}"
-    exit 1
-fi
-
-# Wait for database to be ready
-echo -e "${YELLOW}Waiting for database to be ready...${NC}"
-MAX_ATTEMPTS=30
-ATTEMPT=0
-while [ $ATTEMPT -lt $MAX_ATTEMPTS ]; do
-    if $CONTAINER_CLI compose exec mysql mysqladmin ping -h localhost --silent 2>/dev/null; then
-        echo -e "${GREEN}✓ Database is ready${NC}"
-        break
-    fi
-    ATTEMPT=$((ATTEMPT + 1))
-    echo -e "${YELLOW}Waiting for database... (attempt $ATTEMPT/$MAX_ATTEMPTS)${NC}"
-    sleep 2
-done
-
-if [ $ATTEMPT -eq $MAX_ATTEMPTS ]; then
-    echo -e "${RED}✗ Database failed to become ready${NC}"
-    exit 1
-fi
-
-# Give MySQL extra time on fresh initialization to create users
-if [ "$FRESH_DB" = true ]; then
-    echo -e "${YELLOW}Waiting for fresh database to complete initialization...${NC}"
-    sleep 10
-else
-    sleep 3
-fi
-
-# Run migrations
-echo -e "${YELLOW}Running database migrations...${NC}"
-$CONTAINER_CLI compose exec backend php artisan migrate --force
-
-# Check if database has data
-echo -e "${YELLOW}Checking if database needs seeding...${NC}"
-TABLE_COUNT=$($CONTAINER_CLI compose exec backend php artisan tinker --execute="echo \DB::table('users')->count();" 2>/dev/null | tail -1 | tr -d '[:space:]' || echo "0")
-# Default to 0 if not a number
-if ! [[ "$TABLE_COUNT" =~ ^[0-9]+$ ]]; then
-    TABLE_COUNT=0
-fi
-if [ "$TABLE_COUNT" -eq "0" ]; then
-    echo -e "${YELLOW}Database is empty. Run seeders? (y/n)${NC}"
-    read -r response
-    if [[ "$response" =~ ^([yY][eE][sS]|[yY])$ ]]; then
-        $CONTAINER_CLI compose exec backend php artisan db:seed
-        echo -e "${GREEN}✓ Database seeded${NC}\n"
-    fi
-fi
-
-echo -e "${GREEN}✓ Backend setup complete${NC}"
-echo -e "${GREEN}Backend API running at: http://localhost:8000${NC}\n"
-
-# Display summary
-echo -e "${GREEN}=== Development Environment Ready ===${NC}"
-echo -e "${GREEN}Backend API:${NC} http://localhost:8000"
-echo -e "${GREEN}Frontend:${NC} http://localhost:5173"
-echo -e "${GREEN}Database:${NC} MySQL on localhost:3306"
-echo -e ""
-echo -e "${YELLOW}Note:${NC} Frontend container will install dependencies and start automatically."
-echo -e "${YELLOW}To view frontend logs:${NC}"
-echo -e "  cd backend && $CONTAINER_CLI compose logs -f frontend"
-echo -e ""
-echo -e "${YELLOW}To stop all services:${NC}"
-echo -e "  cd backend && $CONTAINER_CLI compose down"

bin/update.sh

@@ -1,7 +1,7 @@
 #!/bin/bash
 set -e
 
-echo "🔄 Pulling latest backend changes..."
+echo "🔄 Pulling latest changes..."
 git pull origin main
 
 echo "📦 Installing PHP dependencies..."
@@ -15,4 +15,4 @@ php artisan config:cache
 php artisan route:cache
 php artisan view:cache
 
-echo "✅ Backend update complete!"
+echo "✅ Update complete!"

bootstrap/app.php

@@ -1,15 +1,11 @@
 <?php
 
-use App\Http\Middleware\DemoMiddleware;
 use App\Http\Middleware\ForceJsonResponse;
-use App\Http\Middleware\RequireSaasMode;
-use App\Http\Middleware\RequireSubscription;
 use App\Services\OutputService;
 use Illuminate\Foundation\Application;
 use Illuminate\Foundation\Configuration\Exceptions;
 use Illuminate\Foundation\Configuration\Middleware;
 use Illuminate\Http\Request;
-use Illuminate\Support\Facades\Route;
 use Illuminate\Validation\ValidationException;
 use Symfony\Component\HttpKernel\Exception\AccessDeniedHttpException;
 use Symfony\Component\HttpKernel\Exception\NotFoundHttpException;
@@ -20,24 +16,10 @@
         api: __DIR__.'/../routes/api.php',
         commands: __DIR__.'/../routes/console.php',
         health: '/up',
-        then: function () {
-            Route::middleware('web')
-                ->group(base_path('routes/web/subscription.php'));
-        },
     )
     ->withMiddleware(function (Middleware $middleware) {
         // Apply ForceJsonResponse only to API routes
         $middleware->api(ForceJsonResponse::class);
-        $middleware->web(DemoMiddleware::class);
-        $middleware->alias([
-            'subscription' => RequireSubscription::class,
-            'saas' => RequireSaasMode::class,
-        ]);
-
-        // Exclude Stripe webhook from CSRF verification
-        $middleware->validateCsrfTokens(except: [
-            'stripe/webhook',
-        ]);
     })
     ->withExceptions(function (Exceptions $exceptions) {
         $exceptions->shouldRenderJsonWhen(function (Request $request, Throwable $e) {

build_and_push.sh

@@ -1,3 +0,0 @@
-#!/bin/bash
-docker build -t 192.168.178.152:50114/dishplanner-backend .
-docker push 192.168.178.152:50114/dishplanner-backend

composer.json

@@ -7,10 +7,9 @@
         "laravel",
         "framework"
     ],
-    "license": "MIT",
+    "license": "AGPL-3.0-only",
     "require": {
         "php": "^8.2",
-        "laravel/cashier": "^16.1",
         "laravel/framework": "^12.9.2",
         "laravel/sanctum": "^4.0",
         "laravel/tinker": "^2.9",
@@ -27,9 +26,6 @@
         "phpunit/phpunit": "^11.0.1"
     },
     "autoload": {
-        "files": [
-            "app/helpers.php"
-        ],
         "psr-4": {
             "App\\": "app/",
             "DishPlanner\\": "src/DishPlanner/",

config/app.php

@@ -28,19 +28,6 @@
 
     'env' => env('APP_ENV', 'production'),
 
-    /*
-    |--------------------------------------------------------------------------
-    | Application Mode
-    |--------------------------------------------------------------------------
-    |
-    | Determines the application deployment mode: 'app' for self-hosted,
-    | 'saas' for multi-tenant SaaS, 'demo' for demonstration instances.
-    |
-    */
-
-    'mode' => env('APP_MODE', 'app'),
-    'demo_subscribe_url' => env('APP_DEMO_SUBSCRIBE_URL', 'https://dishplanner.app'),
-
     /*
     |--------------------------------------------------------------------------
     | Application Debug Mode

config/services.php

@@ -35,14 +35,4 @@
         ],
     ],
 
-    'stripe' => [
-        'key' => env('STRIPE_KEY'),
-        'secret' => env('STRIPE_SECRET'),
-        'webhook' => [
-            'secret' => env('STRIPE_WEBHOOK_SECRET'),
-        ],
-        'price_monthly' => env('STRIPE_PRICE_MONTHLY'),
-        'price_yearly' => env('STRIPE_PRICE_YEARLY'),
-    ],
-
 ];

database/migrations/2026_01_06_000525_create_customer_columns.php

@@ -1,34 +0,0 @@
-<?php
-
-use Illuminate\Database\Migrations\Migration;
-use Illuminate\Database\Schema\Blueprint;
-use Illuminate\Support\Facades\Schema;
-
-return new class extends Migration
-{
-    public function up(): void
-    {
-        Schema::table('planners', function (Blueprint $table) {
-            $table->string('stripe_id')->nullable()->index();
-            $table->string('pm_type')->nullable();
-            $table->string('pm_last_four', 4)->nullable();
-            $table->timestamp('trial_ends_at')->nullable();
-        });
-    }
-
-    public function down(): void
-    {
-        Schema::table('planners', function (Blueprint $table) {
-            $table->dropIndex([
-                'stripe_id',
-            ]);
-
-            $table->dropColumn([
-                'stripe_id',
-                'pm_type',
-                'pm_last_four',
-                'trial_ends_at',
-            ]);
-        });
-    }
-};

database/migrations/2026_01_06_000526_create_subscriptions_table.php

@@ -1,37 +0,0 @@
-<?php
-
-use Illuminate\Database\Migrations\Migration;
-use Illuminate\Database\Schema\Blueprint;
-use Illuminate\Support\Facades\Schema;
-
-return new class extends Migration
-{
-    /**
-     * Run the migrations.
-     */
-    public function up(): void
-    {
-        Schema::create('subscriptions', function (Blueprint $table) {
-            $table->id();
-            $table->foreignId('planner_id');
-            $table->string('type');
-            $table->string('stripe_id')->unique();
-            $table->string('stripe_status');
-            $table->string('stripe_price')->nullable();
-            $table->integer('quantity')->nullable();
-            $table->timestamp('trial_ends_at')->nullable();
-            $table->timestamp('ends_at')->nullable();
-            $table->timestamps();
-
-            $table->index(['planner_id', 'stripe_status']);
-        });
-    }
-
-    /**
-     * Reverse the migrations.
-     */
-    public function down(): void
-    {
-        Schema::dropIfExists('subscriptions');
-    }
-};

database/migrations/2026_01_06_000527_create_subscription_items_table.php

@@ -1,34 +0,0 @@
-<?php
-
-use Illuminate\Database\Migrations\Migration;
-use Illuminate\Database\Schema\Blueprint;
-use Illuminate\Support\Facades\Schema;
-
-return new class extends Migration
-{
-    /**
-     * Run the migrations.
-     */
-    public function up(): void
-    {
-        Schema::create('subscription_items', function (Blueprint $table) {
-            $table->id();
-            $table->foreignId('subscription_id');
-            $table->string('stripe_id')->unique();
-            $table->string('stripe_product');
-            $table->string('stripe_price');
-            $table->integer('quantity')->nullable();
-            $table->timestamps();
-
-            $table->index(['subscription_id', 'stripe_price']);
-        });
-    }
-
-    /**
-     * Reverse the migrations.
-     */
-    public function down(): void
-    {
-        Schema::dropIfExists('subscription_items');
-    }
-};

database/migrations/2026_01_06_000528_add_meter_id_to_subscription_items_table.php

@@ -1,28 +0,0 @@
-<?php
-
-use Illuminate\Database\Migrations\Migration;
-use Illuminate\Database\Schema\Blueprint;
-use Illuminate\Support\Facades\Schema;
-
-return new class extends Migration
-{
-    /**
-     * Run the migrations.
-     */
-    public function up(): void
-    {
-        Schema::table('subscription_items', function (Blueprint $table) {
-            $table->string('meter_id')->nullable()->after('stripe_price');
-        });
-    }
-
-    /**
-     * Reverse the migrations.
-     */
-    public function down(): void
-    {
-        Schema::table('subscription_items', function (Blueprint $table) {
-            $table->dropColumn('meter_id');
-        });
-    }
-};

database/migrations/2026_01_06_000529_add_meter_event_name_to_subscription_items_table.php

@@ -1,28 +0,0 @@
-<?php
-
-use Illuminate\Database\Migrations\Migration;
-use Illuminate\Database\Schema\Blueprint;
-use Illuminate\Support\Facades\Schema;
-
-return new class extends Migration
-{
-    /**
-     * Run the migrations.
-     */
-    public function up(): void
-    {
-        Schema::table('subscription_items', function (Blueprint $table) {
-            $table->string('meter_event_name')->nullable()->after('quantity');
-        });
-    }
-
-    /**
-     * Reverse the migrations.
-     */
-    public function down(): void
-    {
-        Schema::table('subscription_items', function (Blueprint $table) {
-            $table->dropColumn('meter_event_name');
-        });
-    }
-};

docker-compose.prod.yml

@@ -1,7 +1,7 @@
 # Production Docker Compose
 services:
   app:
-    image: codeberg.org/dish-planner/app:latest
+    image: forge.lvl0.xyz/lvl0/dishplanner:latest
     container_name: dishplanner_app
     restart: always
     ports:

frontend-old/.dockerignore

@@ -1,4 +0,0 @@
-.react-router
-build
-node_modules
-README.md

frontend-old/.gitignore

@@ -1,6 +0,0 @@
-.DS_Store
-/node_modules/
-
-# React Router
-/.react-router/
-/build/

frontend-old/Dockerfile

@@ -1,22 +0,0 @@
-FROM node:20-alpine AS development-dependencies-env
-COPY . /app
-WORKDIR /app
-RUN npm ci
-
-FROM node:20-alpine AS production-dependencies-env
-COPY ./package.json package-lock.json /app/
-WORKDIR /app
-RUN npm ci --omit=dev
-
-FROM node:20-alpine AS build-env
-COPY . /app/
-COPY --from=development-dependencies-env /app/node_modules /app/node_modules
-WORKDIR /app
-RUN npm run build
-
-FROM node:20-alpine
-COPY ./package.json package-lock.json /app/
-COPY --from=production-dependencies-env /app/node_modules /app/node_modules
-COPY --from=build-env /app/build /app/build
-WORKDIR /app
-CMD ["npm", "run", "start"]

frontend-old/README.md

@@ -1,87 +0,0 @@
-# Welcome to React Router!
-
-A modern, production-ready template for building full-stack React applications using React Router.
-
-[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/remix-run/react-router-templates/tree/main/default)
-
-## Features
-
-- 🚀 Server-side rendering
-- ⚡️ Hot Module Replacement (HMR)
-- 📦 Asset bundling and optimization
-- 🔄 Data loading and mutations
-- 🔒 TypeScript by default
-- 🎉 TailwindCSS for styling
-- 📖 [React Router docs](https://reactrouter.com/)
-
-## Getting Started
-
-### Installation
-
-Install the dependencies:
-
-```bash
-npm install
-```
-
-### Development
-
-Start the development server with HMR:
-
-```bash
-npm run dev
-```
-
-Your application will be available at `http://localhost:5173`.
-
-## Building for Production
-
-Create a production build:
-
-```bash
-npm run build
-```
-
-## Deployment
-
-### Docker Deployment
-
-To build and run using Docker:
-
-```bash
-docker build -t my-app .
-
-# Run the container
-docker run -p 3000:3000 my-app
-```
-
-The containerized application can be deployed to any platform that supports Docker, including:
-
-- AWS ECS
-- Google Cloud Run
-- Azure Container Apps
-- Digital Ocean App Platform
-- Fly.io
-- Railway
-
-### DIY Deployment
-
-If you're familiar with deploying Node applications, the built-in app server is production-ready.
-
-Make sure to deploy the output of `npm run build`
-
-```
-├── package.json
-├── package-lock.json (or pnpm-lock.yaml, or bun.lockb)
-├── build/
-│   ├── client/    # Static assets
-│   └── server/    # Server-side code
-```
-
-## Styling
-
-This template comes with [Tailwind CSS](https://tailwindcss.com/) already configured for a simple default starting experience. You can use whatever CSS framework you prefer.
-
----
-
-Built with ❤️ using React Router.

frontend-old/app/app.css

@@ -1,18 +0,0 @@
-@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&family=Syncopate:wght@400;700&display=swap');
-@import "tailwindcss";
-
-@import "./styles/main.css";
-
-@theme {
-  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif,
-    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-}
-
-html,
-body {
-  @apply bg-white dark:bg-gray-950;
-
-  @media (prefers-color-scheme: dark) {
-    color-scheme: dark;
-  }
-}

frontend-old/app/components/Spinner.tsx

@@ -1,15 +0,0 @@
-const Spinner = () => {
-
-    return (
-        <div className="flex justify-center items-center">
-            <svg className="animate-spin h-5 w-5 text-gray-600" xmlns="http://www.w3.org/2000/svg" fill="none"
-                 viewBox="0 0 24 24">
-                <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
-                <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"></path>
-            </svg>
-        </div>
-    )
-
-}
-
-export default Spinner

frontend-old/app/components/features/OnboardingBanner.tsx

@@ -1,48 +0,0 @@
-import { Link } from "react-router"
-import useRoutes from "@/hooks/useRoutes"
-import { UserType } from "@/types/UserType"
-import { DishType } from "@/types/DishType"
-
-interface Props {
-    dishes: DishType[],
-    users: UserType[]
-}
-
-const OnboardingBanner = ({ dishes, users }: Props) => {
-    const routes = useRoutes();
-
-    const steps = [
-        {
-            label: "Create a user",
-            href: routes.user.create(),
-            count: users.length
-        }, {
-            label: "Create a dish",
-            href: routes.dish.create(),
-            count: dishes.length
-        }
-    ]
-
-    return (
-        <div className="border-2 border-secondary p-6 text-lg">
-            <div className="text-xl">Welcome to DishPlanner</div>
-            <div className="my-5">To get you started, please follow these steps to set up your account. This will ensure a better
-                experience.
-            </div>
-
-            {
-                steps.map((step, index) => (
-                    <div className="w-full text-center text-2xl my-5" key={index}>
-                        {
-                            step.count === 0
-                                ? <Link to={ step.href } className="underline">{ step.label }</Link>
-                                : <div className="line-through">{ step.label }</div>
-                        }
-                    </div>
-                ))
-            }
-        </div>
-    )
-}
-
-export default OnboardingBanner;

frontend-old/app/components/features/auth/LoginForm.tsx

@@ -1,98 +0,0 @@
-
-import React, { useEffect, useState } from 'react';
-import { Link, useLocation, useNavigate } from 'react-router';
-import { useAuth } from '@/context/AuthContext';
-import { login } from "@/utils/api/auth";
-import useRoutes from "@/hooks/useRoutes";
-import SolidButton from "@/components/ui/Buttons/SolidButton";
-import Alert from "@/components/ui/Alert";
-
-const LoginForm = () => {
-    const { login: authLogin } = useAuth();
-    const routes = useRoutes();
-    const [email, setEmail] = useState('');
-    const [password, setPassword] = useState('');
-    const [error, setError] = useState('');
-    const [alertSuccess, setAlertSuccess] = useState<string[]>([])
-    const navigate = useNavigate();
-    const location = useLocation();
-    const searchParams = new URLSearchParams(location.search);
-    const isRegistered = searchParams.get('registered') === 'true';
-
-    useEffect(() => {
-        if (isRegistered) {
-            setAlertSuccess(['Registration successful!',' You can now log in.']);
-
-            const timer = setTimeout(() => {
-                const params = new URLSearchParams(searchParams.toString());
-                params.delete('registered');
-                const newUrl = `${window.location.pathname}?${params.toString()}`;
-
-                navigate(newUrl, { replace: true });
-            }, 3000);
-
-            return () => clearTimeout(timer)
-        }
-    }, [isRegistered, navigate, searchParams])
-
-    const handleSubmit = async (e: React.FormEvent) => {
-        e.preventDefault();
-
-        try {
-            await login(email, password);
-            authLogin();
-            navigate('/', { replace: true });
-        } catch (err) {
-            const errorMessage =
-                err instanceof Error
-                    ? err.message
-                    : 'Login failed';
-            setError(errorMessage);
-        }
-    };
-
-    return (
-        <div style={{ marginTop: '15vh' }} className="lg:w-1/3 lg:mx-auto">
-            <div className="pt-2 text-2xl font-syncopate text-primary">
-                DISH PLANNER
-            </div>
-            <div className="border-2 border-secondary rounded-lg px-5 pt-5 pb-3 lg:pt-10 lg:pb-7">
-                { alertSuccess.length > 0 &&
-                    <Alert type="success" className="mb-4 px-5 py-2 capitalize text-center">
-                        {alertSuccess.map((msg, index) => (
-                            <React.Fragment key={index}>
-                                {msg}
-                                <br />
-                            </React.Fragment>
-                        ))}
-                    </Alert>
-                }
-                <form onSubmit={handleSubmit} className="max-w-sm mx-auto flex flex-col">
-                    {error && <p className="text-red-600 mb-4">{error}</p>}
-                    <input
-                        type="email"
-                        placeholder="Email"
-                        value={email}
-                        onChange={e => setEmail(e.target.value)}
-                        required
-                        className="w-full p-2 mb-4 border rounded border-secondary bg-gray-600 text-secondary"
-                    />
-                    <input
-                        type="password"
-                        placeholder="Password"
-                        value={password}
-                        onChange={e => setPassword(e.target.value)}
-                        required
-                        className="w-full p-2 mb-4 border rounded text-secondary border-secondary bg-gray-600"
-                    />
-                    <SolidButton type="submit">Login</SolidButton>
-                    <Link to={routes.auth.register()} className="lowercase hover:underline text-center mt-1 text-secondary underline">
-                        Create an account
-                    </Link>
-                </form>
-            </div>
-        </div>
-    )
-}
-
-export default LoginForm

frontend-old/app/components/features/auth/RegisterForm.tsx

@@ -1,107 +0,0 @@
-import React, { useState } from 'react';
-import { register } from "@/utils/api/auth";
-import useRoutes from "@/hooks/useRoutes";
-import SectionTitle from "@/components/ui/SectionTitle";
-import SolidButton from "@/components/ui/Buttons/SolidButton";
-import { Link, useNavigate } from "react-router"
-
-const RegisterForm = () => {
-    const routes = useRoutes();
-    const [name, setName] = useState('');
-    const [email, setEmail] = useState('');
-    const [password, setPassword] = useState('');
-    const [passwordAgain, setPasswordAgain] = useState('');
-    const [error, setError] = useState('');
-    const [isLoading, setIsLoading] = useState(false);
-    const [isRegistered, setIsRegistered] = useState(false);
-    const navigate = useNavigate();
-
-    const handleSubmit = async (e: React.FormEvent) => {
-        e.preventDefault();
-
-        if (password !== passwordAgain) {
-            setError("Passwords do not match.");
-            return;
-        }
-
-        try {
-            setIsLoading(true);
-
-            await register(name, email, password, passwordAgain);
-            // navigate('/login?registered=true', { replace: true });
-        } catch (err) {
-            const errorMessage =
-                err instanceof Error
-                    ? err.message
-                    : 'Registration\n failed';
-            setError(errorMessage);
-        } finally {
-            setIsRegistered(true);
-            setIsLoading(false);
-        }
-    };
-
-    if (isRegistered) {
-        return <div className="border-2 border-secondary rounded-lg p-5 mt-0">
-            <SectionTitle>Registration successful!</SectionTitle>
-            Please continue to the <Link to={ routes.auth.login() }>login page</Link>.
-        </div>
-    }
-
-    return (
-        <div style={{ marginTop: '15vh' }} className="lg:w-1/3 lg:mx-auto">
-            <div className="pt-2 text-2xl font-syncopate text-primary">
-                DISH PLANNER
-            </div>
-            <div className="border-2 border-secondary rounded-lg p-5 mt-0 lg:pt-10 lg:pb-7">
-                <form onSubmit={ handleSubmit } className="max-w-sm mx-auto space-y-4 flex flex-col">
-                    <h2 className="text-xl font-bold text-secondary text-right">Register</h2>
-                    { error && <p className="text-red-600">{ error }</p> }
-                    <input
-                        type="text"
-                        placeholder="Name"
-                        value={ name }
-                        onChange={ e => setName(e.target.value) }
-                        required
-                        className="w-full p-2 border rounded border-secondary bg-gray-600 text-secondary"
-                    />
-                    <input
-                        type="email"
-                        placeholder="Email"
-                        value={ email }
-                        onChange={ e => setEmail(e.target.value) }
-                        required
-                        className="w-full p-2 border rounded border-secondary bg-gray-600 text-secondary"
-                    />
-                    <input
-                        type="password"
-                        placeholder="Password"
-                        value={ password }
-                        onChange={ e => setPassword(e.target.value) }
-                        required
-                        className="w-full p-2 border rounded border-secondary bg-gray-600 text-secondary"
-                    />
-                    <input
-                        type="password"
-                        placeholder="Password Again"
-                        value={ passwordAgain }
-                        onChange={ e => setPasswordAgain(e.target.value) }
-                        required
-                        className="w-full p-2 border rounded border-secondary bg-gray-600 text-secondary"
-                    />
-                    <SolidButton
-                        type="submit"
-                        className={ isLoading ? "opacity-50 cursor-not-allowed" : "background-red" }
-                    >
-                        Create Account
-                    </SolidButton>
-                    <Link to={routes.auth.login()} className="lowercase mt-2 hover:underline text-center text-secondary underline">
-                        Back to Login
-                    </Link>
-                </form>
-            </div>
-        </div>
-    )
-}
-
-export default RegisterForm

frontend-old/app/components/features/dishes/AddUserToDishForm.tsx

@@ -1,101 +0,0 @@
-import React, { useState } from "react";
-import { DishType } from "@/types/DishType";
-import { UserType } from "@/types/UserType";
-import { useFetchUsers } from "@/hooks/useFetchUsers";
-import Spinner from "@/components/Spinner";
-import {addUserToDish} from "@/utils/api/dishApi";
-import OutlineButton from "@/components/ui/Buttons/OutlineButton";
-import SolidButton from "@/components/ui/Buttons/SolidButton";
-
-interface Props {
-    dish: DishType;
-    reloadDish: () => void;
-}
-
-const AddUserToDishForm = ({ dish, reloadDish }: Props) => {
-    const [showAdd, setShowAdd] = useState<boolean>(false);
-    const [selectedUser, setSelectedUser] = useState<string>("-1");
-    const { users, isLoading: isUsersLoading } = useFetchUsers();
-
-    const handleSubmit = (e: React.FormEvent) => {
-        e.preventDefault();
-
-        if (selectedUser === "-1") {
-            alert("Please select a valid user.");
-            return;
-        }
-
-        const userToAdd = users.find((user: UserType) => user.id === parseInt(selectedUser));
-
-        if (!userToAdd) {
-            alert("User not found.");
-            return;
-        }
-
-        addUserToDish(dish.id, userToAdd.id)
-            .then(() => {
-                setShowAdd(false);
-                setSelectedUser("-1");
-                reloadDish();
-            })
-            .catch(() => {
-                alert("Failed to add user, please try again.");
-            });
-    };
-
-    if (isUsersLoading) {
-        return <Spinner />;
-    }
-
-    const remainingUsers = users.filter(
-        (user: UserType) =>
-            !dish.users.find((dishUser: UserType) => dishUser.id === user.id)
-    );
-
-    return (
-        <>
-            <OutlineButton
-                className="mb-2 flex-none w-fit ml-auto"
-                onClick={() => setShowAdd(!showAdd)}
-                disabled={remainingUsers.length === 0}
-                type="button"
-            >
-                Add User
-            </OutlineButton>
-
-            { showAdd && (
-                <div className="mt-2 mb-5 w-full">
-                <form onSubmit={handleSubmit}>
-                    <div className="flex">
-                        <div className="flex-grow pt-2">
-                            <select
-                                value={selectedUser}
-                                onChange={(e) => setSelectedUser(e.target.value)}
-                                className="p-2 border rounded w-full background-secondary border-secondary"
-                            >
-                                <option value="-1">Select user</option>
-                                {remainingUsers.map((user: UserType) => (
-                                    <option key={user.id} value={user.id}>
-                                        {user.name}
-                                    </option>
-                                ))}
-                            </select>
-                        </div>
-
-                        <div className="flex-none py-2 pr-2 pl-4">
-                            <SolidButton type="submit"
-                                         size="small"
-                                         className="mt-1"
-                            >
-                                Add User
-                            </SolidButton>
-                        </div>
-                    </div>
-                </form>
-                </div>
-            )}
-        </>
-    );
-};
-
-export default AddUserToDishForm;

frontend-old/app/components/features/dishes/CreateDishForm.tsx

@@ -1,95 +0,0 @@
-import React, { useState } from "react";
-import { useNavigate } from "react-router";
-import { createDish } from "~/utils/api/dishApi";
-import PageTitle from "~/components/ui/PageTitle";
-import Alert from "~/components/ui/Alert";
-import SolidButton from "~/components/ui/Buttons/SolidButton";
-import OutlineLinkButton from "~/components/ui/Buttons/OutlineLinkButton";
-import { ChevronLeftIcon } from "@heroicons/react/16/solid";
-import Hr from "~/components/ui/Hr"
-
-const CreateDishForm = () => {
-    const navigate = useNavigate()
-    const [name, setName] = useState<string>("");
-    const [error, setError] = useState<string>("");
-    const [loading, setLoading] = useState(false);
-
-    const validateForm = () => {
-        if (!name.trim()) {
-            setError("Dish name cannot be empty.");
-            return false;
-        }
-
-        return true;
-    };
-
-    const submitForm = async (e: React.FormEvent<HTMLFormElement>) => {
-        e.preventDefault()
-
-        // Validate client-side input
-        if (!validateForm()) return;
-
-        setError("");
-        setLoading(true);
-
-        try {
-            const result = await createDish(name);
-            if (result) {
-                navigate('/dishes')
-            }
-        } catch (error: unknown) {
-            setError(error instanceof Error ? error.message : "An unexpected error occurred.");
-        } finally {
-            setLoading(false);
-        }
-    }
-
-    return (
-        <div className="px-5">
-            <div className="flex mb-3">
-                <PageTitle>Create Dish</PageTitle>
-            </div>
-
-            <form className="space-y-4" onSubmit={ submitForm }>
-                { error && (
-                    <Alert type="error">{ error }</Alert>
-                ) }
-
-                <div>
-                    <label htmlFor="name" className="block text-sm font-medium">Dish Name</label>
-                    <input
-                        type="text"
-                        id="name"
-                        name="name"
-                        value={ name }
-                        onChange={ (e) => setName(e.target.value) } // Update the name state on change
-                        className="w-full p-2 mb-4 border rounded bg-gray-600 border-secondary text-secondary focus:bg-gray-900"
-                        placeholder="Enter dish name"
-                    />
-                </div>
-
-                <SolidButton
-                    type="submit"
-                    disabled={ loading }
-                    className={ loading ? "bg-gray-400" : '' }
-                >
-                    { loading ? "Saving..." : "Save Changes" }
-                </SolidButton>
-            </form>
-
-            <Hr />
-
-            <OutlineLinkButton
-                href="/dishes"
-                className="mt-4 pl-0 mr-0"
-                icon={ <ChevronLeftIcon/> }
-            >
-                Back to dishes
-            </OutlineLinkButton>
-        </div>
-    );
-
-
-};
-
-export default CreateDishForm;

frontend-old/app/components/features/dishes/Dish.tsx

@@ -1,39 +0,0 @@
-import {DishType} from "~/types/DishType";
-
-import {PencilIcon, TrashIcon} from '@heroicons/react/24/solid'
-import { Link } from "react-router";
-import useRoutes from "~/hooks/useRoutes";
-import {UserType} from "~/types/UserType";
-import Card from "~/components/layout/Card";
-
-const Dish = ({ dish }: { dish: DishType}) => {
-    const routes = useRoutes();
-
-    return (
-        <Card>
-            <div className="flex-1 flex items-center">
-                <p className="text-bold text-xl font-bold">{ dish.name }</p>
-                <span className="mx-2"></span>
-                {
-                    dish.users.map((user: UserType) => (
-                        <div key={user.id} className="text-accent-yellow mx-1">{user.name.slice(0, 1)}</div>
-                    ))
-                }
-            </div>
-            <div className="flex-none flex gap-2">
-                <Link to={routes.dish.edit(dish)}>
-                    <div className="border border-foreground p-2 rounded">
-                        <PencilIcon width="14" />
-                    </div>
-                </Link>
-                <Link to={routes.dish.delete(dish)}>
-                    <div className="border border-red-500 p-2 rounded">
-                        <TrashIcon width="14" className="text-red-500" />
-                    </div>
-                </Link>
-            </div>
-        </Card>
-    )
-}
-
-export default Dish

frontend-old/app/components/features/dishes/DishCard.tsx

@@ -1,22 +0,0 @@
-import {UserType} from "@/types/UserType";
-import {DishType} from "@/types/DishType";
-
-interface Props {
-    user: UserType,
-    dish: DishType,
-}
-
-const DishCard = ({ user, dish }: Props) => {
-    return (
-        <div className="w-full flex py-2 text-xl font-bold text-primary">
-            <div className="user-badge flex-none w-16 text-center pr-5">
-                { user.name.slice(0, 1) }
-            </div>
-            <div className="dish-name flex-1">
-                { dish ? dish.name : '-' }
-            </div>
-        </div>
-    )
-}
-
-export default DishCard

frontend-old/app/components/features/dishes/EditDishForm.tsx

@@ -1,87 +0,0 @@
-import React, {useState} from "react";
-import { useNavigate } from "react-router";
-import Alert from "~/components/ui/Alert";
-import {updateDish} from "~/utils/api/dishApi";
-import {DishType} from "~/types/DishType";
-import useRoutes from "~/hooks/useRoutes";
-import Spinner from "~/components/Spinner";
-import Button from "~/components/ui/Button"
-
-interface Props {
-    dish: DishType
-}
-
-const EditDishForm = ({ dish }: Props) => {
-    const [name, setName] = useState<string>(dish.name);
-    const [error, setError] = useState<string>("");
-    const navigate = useNavigate()
-    const [loading, setLoading] = useState(false);
-    const routes = useRoutes();
-
-    const validateForm = () => {
-        if (!name.trim()) {
-            setError("Dish name cannot be empty.");
-            return false;
-        }
-
-        return true;
-    };
-
-    const submitForm = async (e: React.FormEvent<HTMLFormElement>) => {
-        e.preventDefault()
-
-        if (!validateForm()) return;
-
-        setError("");
-        setLoading(true);
-
-        try {
-            const result = await updateDish(dish.id, name);
-            if (result) {
-                navigate(routes.dish.index())
-            }
-        } catch (error: unknown) {
-            setError(error instanceof Error ? error.message : "An unexpected error occurred");
-        } finally {
-            setLoading(false); // Reset loading state
-        }
-    }
-
-    if (loading) {
-        return <Spinner />;
-    }
-
-    return (
-        <form className="space-y-4" onSubmit={submitForm}>
-            {
-                error != '' && <Alert type="error" >{ error }</Alert>
-            }
-
-            {/* Dish name input */}
-            <div>
-                <label htmlFor="name" className="block text-sm font-medium">Dish Name</label>
-                <input
-                    type="text"
-                    id="name"
-                    name="name"
-                    value={name}
-                    onChange={(e) => setName(e.target.value)} // Update the name state on change
-                    className="p-2 border rounded w-full bg-gray-500 border-secondary background-secondary"
-                />
-            </div>
-
-            {/* Save button */}
-            <Button
-                type="submit"
-                disabled={loading}
-                className={loading ? "bg-gray-400" : ''}
-                variant="primary"
-                appearance="solid"
-            >
-                {loading ? "Saving..." : "Save"}
-            </Button>
-        </form>
-    );
-}
-
-export default EditDishForm;

frontend-old/app/components/features/dishes/EditDishUserCardEditForm.tsx

@@ -1,119 +0,0 @@
-import React from "react";
-import SectionTitle from "@/components/ui/SectionTitle";
-import {syncUserDishRecurrences} from "@/utils/api/usersApi";
-import Spinner from "@/components/Spinner";
-import {UserDishType} from "@/types/ScheduledUserDishType";
-import {RecurrenceType} from "@/types/RecurrenceType";
-import SolidButton from "@/components/ui/Buttons/SolidButton";
-
-interface Props {
-    userDish: UserDishType
-    onSubmit: () => void
-}
-
-const EditDishUserCardEditForm = ({ userDish, onSubmit}: Props) => {
-    const weeklyRecurrence = userDish.recurrences.find((recurrence) => recurrence.type === 'App\\Models\\WeeklyRecurrence')
-    const minimumRecurrence = userDish.recurrences.find((recurrence) => recurrence.type === 'App\\Models\\MinimumRecurrence')
-
-    const wv = weeklyRecurrence ? weeklyRecurrence.value : undefined
-    const mv = minimumRecurrence ? minimumRecurrence.value : undefined
-
-    const [isWeeklyOn, setIsWeeklyOn] = React.useState(weeklyRecurrence !== undefined);
-    const [isMinimumOn, setIsMinimumOn] = React.useState(minimumRecurrence !== undefined);
-    const [weekday, setWeekday] = React.useState<number>(wv ?? 0);
-    const [minimumValue, setMinimumValue] = React.useState<number>(mv ?? 7);
-    const [loading, setLoading] = React.useState(false);
-
-    const handleSubmit = () => {
-        const recurrences = []
-
-        if (isWeeklyOn) {
-            recurrences.push({
-                type: 'App\\Models\\WeeklyRecurrence',
-                value: weekday,
-            });
-        }
-
-        if (isMinimumOn) {
-            recurrences.push({
-                type: 'App\\Models\\MinimumRecurrence',
-                value: minimumValue,
-            });
-        }
-
-        setLoading(true)
-        syncUserDishRecurrences(userDish.dish.id, userDish.user.id, recurrences as RecurrenceType[])
-            .then((data) => console.log('request data', data))
-            .finally(() => {
-                setLoading(false)
-                onSubmit()
-            })
-    }
-
-    if (loading) {
-        return <Spinner />;
-    }
-
-    return (
-        <form action={handleSubmit}>
-            <SectionTitle>Recurrences</SectionTitle>
-
-            <div className="flex">
-                <div className="flex-none">
-                    <input type="checkbox"
-                           id="weekly"
-                           name="weekly"
-                           value="weekly"
-                           checked={isWeeklyOn}
-                           onChange={() => setIsWeeklyOn(!isWeeklyOn)}
-                           className="w-4 h-4 border border-gray-300 rounded-sm bg-gray-50 focus:ring-3 focus:ring-blue-300 dark:bg-gray-700 dark:border-gray-600 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800"
-                    />
-                    <label htmlFor="weekly" className="ml-2">Weekly</label>
-                </div>
-                {
-                    isWeeklyOn && (
-                        <div className="flex-grow ml-2">
-                            <label htmlFor="weekday" className="mr-2">on</label>
-                            <select value={weekday} onChange={(e) => setWeekday(parseInt(e.currentTarget.value))} className="background-secondary border-secondary border-2">
-                                <option value="0">Sunday</option>
-                                <option value="1">Monday</option>
-                                <option value="2">Tuesday</option>
-                                <option value="3">Wednesday</option>
-                                <option value="4">Thursday</option>
-                                <option value="5">Friday</option>
-                                <option value="6">Saturday</option>
-                            </select>
-                        </div>
-                    )
-                }
-            </div>
-
-            <div className="flex mt-2">
-                <div className="flex-none">
-                    <input type="checkbox"
-                           id="minimum"
-                           name="minimum"
-                           value="minimum"
-                           checked={isMinimumOn}
-                           onChange={() => setIsMinimumOn(!isMinimumOn)}
-                           className="w-4 h-4 border border-gray-300 rounded-sm bg-gray-500 focus:ring-3 focus:ring-blue-300 dark:bg-gray-700 dark:border-gray-600 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800"
-                    />
-                    <label htmlFor="minimum" className="ml-2">Minimum</label>
-                </div>
-
-                {
-                    isMinimumOn && (
-                        <div className="flex-grow ml-2">
-                            <input type="number" value={minimumValue} onChange={(e) => setMinimumValue(parseInt(e.currentTarget.value))} min="0" max="365" className="background-secondary border-secondary border-2 w-12 px-2" />
-                            <label htmlFor="minimum">Days</label>
-                        </div>
-                    )
-                }
-            </div>
-
-            <SolidButton type="submit">Save</SolidButton>
-        </form>
-    );
-}
-
-export default EditDishUserCardEditForm;

frontend-old/app/components/features/dishes/RecurrenceLabels.tsx

@@ -1,53 +0,0 @@
-import {RecurrenceType} from "@/types/RecurrenceType";
-
-interface Props {
-    recurrences: RecurrenceType[];
-}
-
-const RecurrenceLabels = ({recurrences}: Props) => {
-    const weeklyRecurrences = recurrences.filter(recurrence => recurrence.type === 'App\\Models\\WeeklyRecurrence');
-    const minimumRecurrences = recurrences.filter(recurrence => recurrence.type === 'App\\Models\\MinimumRecurrence');
-
-    const renderWeeklyRecurrence = () => {
-        if (weeklyRecurrences == undefined || weeklyRecurrences.length == 0) {
-            return '';
-        }
-
-        const weekdayString = (() => {
-            switch (weeklyRecurrences[0].value) {
-                case 0: return "Sunday"
-                case 1: return "Monday"
-                case 2: return "Tuesday";
-                case 3: return "Wednesday";
-                case 4: return "Thursday";
-                case 5: return "Friday";
-                case 6: return "Saturday";
-                default: return "Invalid day";
-            }
-        })
-
-        return (
-            <div className="text-xs p-1 inline mx-1 text-accent-yellow">
-                { weekdayString() }
-            </div>
-        )
-    }
-    const renderMinimumRecurrence = () => {
-        if (minimumRecurrences == undefined || minimumRecurrences.length == 0) {
-            return '';
-        }
-
-        return (
-            <div className="text-xs p-1 inline mx-1 text-accent-yellow">
-                min: { minimumRecurrences[0].value }
-            </div>
-        )
-    }
-
-    return <>
-        { renderWeeklyRecurrence() }
-        { renderMinimumRecurrence() }
-    </>;
-};
-
-export default RecurrenceLabels;

frontend-old/app/components/features/dishes/SyncUsersForm.tsx

@@ -1,32 +0,0 @@
-import React from "react";
-import { DishType } from "@/types/DishType";
-import { UserType } from "@/types/UserType";
-import UserDishCard from "@/components/features/dishes/UserDishCard";
-import SectionTitle from "@/components/ui/SectionTitle";
-import AddUserToDishForm from "@/components/features/dishes/AddUserToDishForm";
-
-interface Props {
-    dish: DishType;
-    reloadDish: () => void;
-}
-
-const SyncUsersForm = ({ dish, reloadDish }: Props) => {
-    return (
-        <div className="my-2 w-full flex flex-col">
-            <SectionTitle className="mt-2">Users</SectionTitle>
-
-            <AddUserToDishForm dish={dish} reloadDish={reloadDish} />
-
-            {dish.users.map((user: UserType) => (
-                <UserDishCard
-                    key={user.id}
-                    user={user}
-                    dish={dish}
-                    reloadDish={reloadDish}
-                />
-            ))}
-        </div>
-    );
-};
-
-export default SyncUsersForm;

frontend-old/app/components/features/dishes/UserDishCard.tsx

@@ -1,83 +0,0 @@
-import React, {useEffect} from "react";
-import {DishType} from "~/types/DishType";
-import {UserType} from "~/types/UserType";
-import { Link } from "react-router";
-import {PencilIcon, TrashIcon} from "@heroicons/react/24/solid";
-import {removeUserFromDish} from "~/utils/api/dishApi";
-import EditDishUserCardEditForm from "~/components/features/dishes/EditDishUserCardEditForm";
-import {getUserDishForUserAndDish} from "~/utils/api/usersApi";
-import Spinner from "~/components/Spinner";
-import RecurrenceLabels from "~/components/features/dishes/RecurrenceLabels";
-import {UserDishType} from "~/types/ScheduledUserDishType";
-
-interface Props {
-    dish: DishType
-    user: UserType
-    reloadDish: () => void
-}
-
-const UserDishCard = ({dish, user, reloadDish}: Props) => {
-    const [userDish, setUserDish] = React.useState<UserDishType|null>(null);
-    const [userDishLoading, setUserDishLoading] = React.useState(true);
-    const [isEditMode, setIsEditMode] = React.useState(false);
-
-    useEffect(() => {
-        getUserDishForUserAndDish(user.id, dish.id)
-            .then((userDish) => setUserDish(userDish))
-            .finally(() => setUserDishLoading(false))
-    }, [dish, user]);
-
-    const handleRemove = () => {
-        removeUserFromDish(dish.id, user.id)
-            .then(() => reloadDish())
-            .catch(() => {
-                alert("Failed to remove user, please try again.");
-            });
-    };
-
-    if (userDishLoading || !userDish) {
-        return <Spinner />
-    }
-
-    const onUserCardSubmit = () => {
-        setIsEditMode(false);
-        reloadDish()
-    }
-
-    return (
-        <div className="my-2 w-full px-3 py-2 text-xl font-bold border border-secondary rounded">
-            <div className="flex gap-2">
-                <div className="flex-none pt-1">
-                    {user.name}
-                </div>
-
-                <div className="flex-grow pt-1">
-                    <RecurrenceLabels recurrences={userDish.recurrences} />
-                </div>
-
-                <div className="flex-none w-8">
-                    <Link onClick={() => setIsEditMode(!isEditMode)} to="#">
-                        <div className="border border-foreground p-2 rounded">
-                            <PencilIcon width="14"/>
-                        </div>
-                    </Link>
-                </div>
-                <div className="flex-none w-8">
-                    <Link onClick={handleRemove} to="#">
-                        <div className="border border-red-500 p-2 rounded">
-                            <TrashIcon width="14" className="text-red-500"/>
-                        </div>
-                    </Link>
-                </div>
-            </div>
-
-            {isEditMode && (
-                <div className="flex gap-2">
-                    <EditDishUserCardEditForm userDish={userDish} onSubmit={onUserCardSubmit} />
-                </div>
-            )}
-        </div>
-    );
-}
-
-export default UserDishCard;

frontend-old/app/components/features/navbar/MobileDropdownMenu.tsx

@@ -1,69 +0,0 @@
-import { Link } from "react-router";
-import React from "react";
-import useRoutes from "~/hooks/useRoutes";
-import classNames from "classnames";
-
-interface Props {
-    isOpen: boolean;
-    setIsOpen: (isOpen: boolean) => void;
-    handleLogout: (e: React.MouseEvent) => void;
-}
-
-const divStyles = classNames(
-    'absolute', 'text-xxl', 'rounded-b', 'top-full mt-1', 'left-0', 'right-0', '', 'py-2',
-    'bg-gray-600', 'border-secondary', 'shadow-md', 'flex', 'flex-col', 'space-y-3',
-    'md:hidden'
-)
-
-const linkStyles = classNames(
-    'border-b-2', 'border-secondary', 'uppercase',
-    'text-primary', 'hover:background-secondary', 'pb-2', 'pl-5',
-    'space-grotesk', 'text-xl'
-)
-
-const MobileDropdownMenu = ({ isOpen, setIsOpen, handleLogout }: Props) => {
-    const routes = useRoutes();
-
-    if (!isOpen) return null;
-
-    return (
-        <div className={divStyles}>
-            <Link
-                to={routes.home()}
-                className={linkStyles}
-                onClick={() => setIsOpen(false)}
-            >
-                Home
-            </Link>
-            <Link
-                to={routes.dish.index()}
-                className={linkStyles}
-                onClick={() => setIsOpen(false)}
-            >
-                Dishes
-            </Link>
-            <Link
-                to={routes.user.index()}
-                className={linkStyles}
-                onClick={() => setIsOpen(false)}
-            >
-                Users
-            </Link>
-            <Link
-                to={routes.schedule.history()}
-                className={linkStyles}
-                onClick={() => setIsOpen(false)}
-            >
-                History
-            </Link>
-            <Link
-                to={routes.auth.login()}
-                onClick={handleLogout}
-                className={linkStyles}>
-                Logout
-            </Link>
-        </div>
-    )
-}
-
-export default MobileDropdownMenu

frontend-old/app/components/features/schedule/HistoricalDishes.tsx

@@ -1,44 +0,0 @@
-"use client"
-
-import {useEffect, useState} from "react";
-import {DateTime} from "luxon";
-import ScheduleCalendar from "@/components/features/schedule/ScheduleCalendar";
-import PageTitle from "@/components/ui/PageTitle";
-import {ScheduleType} from "@/types/ScheduleType";
-import Spinner from "@/components/Spinner";
-import {listSchedule} from "@/utils/api/scheduleApi";
-
-const HistoricalDishes = () => {
-    const [schedule, setSchedule] = useState<ScheduleType[]>([]);
-    const [isLoading, setIsLoading] = useState(true);
-
-    const yesterday = DateTime.now().minus({ days: 1 }).toFormat('yyyy-LL-dd');
-
-    useEffect(() => {
-        listSchedule(undefined, yesterday)
-            .then((dishes: ScheduleType[]) => dishes
-                .sort((a: ScheduleType, b: ScheduleType) => new Date(b.date).getTime() - new Date(a.date).getTime())
-            )
-            .then((dishes) => setSchedule(dishes))
-            .finally(() => setIsLoading(false))
-    }, [yesterday]);
-
-    if (isLoading) {
-        return <Spinner />;
-    }
-
-    if (!schedule || Object.keys(schedule).length === 0) {
-        return (
-            <div className="w-full text-center text-2xl border-white border-2 rounded-xl mt-4">
-                No dishes scheduled
-            </div>
-        );
-    }
-
-    return <div className="justify-items-center">
-        <PageTitle>History</PageTitle>
-        <ScheduleCalendar schedule={schedule as ScheduleType[]} />
-    </div>
-}
-
-export default HistoricalDishes

frontend-old/app/components/features/schedule/ScheduleCalendar.tsx

@@ -1,72 +0,0 @@
-import ScheduleDayCard from "@/components/features/schedule/dayCard/ScheduleDayCard";
-import { FilledScheduleType, ScheduleType } from "@/types/ScheduleType";
-import {useFetchUsers} from "@/hooks/useFetchUsers";
-import Spinner from "@/components/Spinner";
-
-const generateDates = (startDate: string, days: number): string[] => {
-    const dates = [];
-    const start = new Date(startDate);
-
-    for (let i = 0; i < days; i++) {
-        const currentDate = new Date(start);
-        currentDate.setDate(start.getDate() + i);
-        dates.push(currentDate.toISOString().split('T')[0]);
-    }
-
-    return dates;
-};
-
-
-const fillCalendar = (schedules: ScheduleType[]): FilledScheduleType[] => {
-    /*
-Array(14)
-    0:
-        date: "2025-05-05"
-        id: 2
-        is_skipped: false
-        scheduled_user_dishes: []
-     */
-
-    const dates = generateDates((new Date()).toISOString().split('T')[0], 31)
-
-    return dates.map((date): FilledScheduleType => {
-        console.log(date)
-
-        const schedule = schedules.find((schedule: ScheduleType) => schedule.date == date)
-
-        if (schedule) {
-            return schedule
-        }
-
-        return {
-            date,
-            scheduled_user_dishes: []
-        }
-    })
-}
-
-interface Props {
-    schedule: ScheduleType[];
-}
-
-const ScheduleCalendar = ({ schedule }: Props) => {
-    const {users, isLoading: areUsersLoading} = useFetchUsers();
-
-    if (areUsersLoading) return <Spinner />
-
-    const fullCalendar = fillCalendar(schedule)
-
-    return (
-        <div className="w-full flex flex-col items-start">
-            { fullCalendar.map((schedule, index) => (
-                <ScheduleDayCard
-                    key={index}
-                    schedule={schedule}
-                    users={users}
-                />
-            ))}
-        </div>
-    )
-}
-
-export default ScheduleCalendar

frontend-old/app/components/features/schedule/ScheduleEditForm.tsx

@@ -1,142 +0,0 @@
-"use client";
-
-import React, { useEffect, useState } from "react";
-import { ScheduleType } from "@/types/ScheduleType";
-import Spinner from "@/components/Spinner";
-import PageTitle from "@/components/ui/PageTitle";
-import { getScheduleForDate, scheduleUserDish, updateScheduleForDate } from "@/utils/api/scheduleApi";
-import { UserDishType } from "@/types/ScheduledUserDishType";
-import Label from "@/components/ui/Label";
-import SectionTitle from "@/components/ui/SectionTitle";
-import { useFetchUsers } from "@/hooks/useFetchUsers";
-import { listUserDishes } from "@/utils/api/userDishApi";
-import scheduleBuilder from "@/utils/scheduleBuilder";
-import transformDate from "@/utils/dateBuilder";
-import { ChevronLeftIcon } from "@heroicons/react/16/solid";
-import Hr from "@/components/ui/Hr"
-import Button from "@/components/ui/Button"
-
-interface Props {
-    date: string;
-}
-
-const ScheduleEditForm = ({ date }: Props) => {
-    const [schedule, setSchedule] = useState<ScheduleType>()
-    const [userDishes, setUserDishes] = useState<UserDishType[]>([])
-    const [isScheduleLoading, setIsScheduleLoading] = useState(true);
-    const [areUserDishesLoading, setAreUserDishesLoading] = useState(true);
-    const { users } = useFetchUsers();
-
-    useEffect(() => {
-        getScheduleForDate(date)
-            .then((sched: ScheduleType) => setSchedule(sched))
-            .finally(() => setIsScheduleLoading(false))
-    }, [date]);
-
-
-    useEffect(() => {
-        listUserDishes()
-            .then((user_dishes: UserDishType[]) => setUserDishes(user_dishes))
-            .finally(() => setAreUserDishesLoading(false))
-    }, []);
-
-    const handleSkipDay = () => {
-        updateScheduleForDate(date, true)
-            .then((schedule: ScheduleType) => {
-                setSchedule(schedule)
-            })
-    }
-
-    const handleUnskipDay = () => {
-        updateScheduleForDate(date, false)
-            .then((schedule: ScheduleType) => {
-                setSchedule(schedule)
-            })
-    }
-
-    const handleChange = (e: React.ChangeEvent<HTMLSelectElement>, userId: number) => {
-        const userDishId = parseInt(e.currentTarget.value);
-
-        if (userDishId === 0) {
-            scheduleUserDish(date, userId, null, true).then(() => window.location.reload());
-            return;
-        }
-
-        scheduleUserDish(date, userId, userDishId).then(() => window.location.reload());
-    }
-
-    if (isScheduleLoading || areUserDishesLoading || !schedule) {
-        return <Spinner/>
-    }
-
-    const scheduleData = scheduleBuilder(schedule, users, userDishes)
-
-    return <div>
-        <div className="flex">
-            <div className="flex-none">
-                <PageTitle>Edit Day</PageTitle>
-            </div>
-            <div className="flex-grow">
-                <SectionTitle className="text-right font-size-24 capitalize font-default">{ transformDate(schedule.date) }</SectionTitle>
-            </div>
-        </div>
-
-        <Hr className="mb-8" />
-
-        {
-            userDishes.length === 0 && <div className="my-2">
-                <div className="text-center w-full text-xl">No dishes found assigned to this user.</div>
-                <div className="text-center w-full mt-2">Go ahead and add some first, or choose to skip the day.</div>
-                <div className="text-center w-full">(dishes ={`>`} edit ={`>`} add user)</div>
-            </div>
-        }
-
-        { schedule.is_skipped
-            ? <Label>Skipped</Label>
-            : (
-                <>
-                    {
-                        scheduleData
-                            .map((scheduleData) => <div className="flex w-full py-2" key={ scheduleData.user.id }>
-                                <div className="flex-none px-2 font-size-18 pt-2">{ scheduleData.user.name }</div>
-                                <div className="flex-grow px-2">
-                                    <select
-                                        className="w-full bg-gray-500 border-2 border-secondary p-2 rounded"
-                                        onChange={ (e) => handleChange(e, scheduleData.user.id) }
-                                        defaultValue={ scheduleData.scheduled_user_dish?.id || 0 }
-                                    >
-                                        <option value="0">Skip day</option>
-                                        {
-                                            userDishes.map((userDish: UserDishType) => <option
-                                                key={ userDish.id }
-                                                value={ userDish.id }
-                                            >
-                                                { userDish.dish.name }
-                                            </option>)
-                                        }
-                                    </select>
-                                </div>
-                            </div>)
-                    }
-                </>
-            )
-        }
-
-        <div className="text-right w-full text-accent-yellow pr-3">Changes are saved automatically</div>
-
-        <Hr className="mt-8" />
-
-        <div className="pt-3 flex gap-4">
-            <Button variant="secondary" appearance="outline" className="flex-grow" href="/" icon={<ChevronLeftIcon />}>
-                Back to schedule
-            </Button>
-            <div className="flex-none w-1/3">{
-                schedule.is_skipped
-                    ? <Button onClick={ handleUnskipDay } variant="accent" appearance="outline" type="button">Unskip Day</Button>
-                    : <Button onClick={ handleSkipDay } variant="accent" appearance="outline" type="button" className="w-full">Skip Day</Button>
-            }</div>
-        </div>
-    </div>
-}
-
-export default ScheduleEditForm

frontend-old/app/components/features/schedule/ScheduleRegenerateButton.tsx

@@ -1,35 +0,0 @@
-import { useState} from "react";
-import Modal from "@/components/ui/Modal";
-import ScheduleRegenerateForm from "@/components/features/schedule/ScheduleRegenerateForm";
-import {ArrowPathIcon} from "@heroicons/react/16/solid";
-
-interface ScheduleRegenerateButtonProps {
-    onModalClose?: () => void;
-}
-
-const ScheduleRegenerateButton = ({ onModalClose }: ScheduleRegenerateButtonProps) => {
-    const [open, setOpen] = useState(false);
-
-    const handleCloseModal = () => {
-        setOpen(false)
-        if (onModalClose) {
-            onModalClose()
-        }
-    }
-
-    const modalChildren = <ScheduleRegenerateForm closeModal={() => handleCloseModal()}/>
-    const buttonChild = <div className="p-0 flex">
-            <ArrowPathIcon fontSize={24} className="h-5 w-5 mt-1 mr-2" color="gray-500" aria-hidden="true" onClick={() => setOpen(true)} />
-            <p>Regenerate</p>
-        </div>
-
-    return <Modal
-        buttonClassName="ml-auto mr-2 py-1"
-        buttonChildren={buttonChild}
-        modalChildren={modalChildren}
-        modalOpen={open}
-        setModalOpen={setOpen}
-    />
-};
-
-export default ScheduleRegenerateButton;

frontend-old/app/components/features/schedule/ScheduleRegenerateForm.tsx

@@ -1,78 +0,0 @@
-import {DialogTitle} from "@headlessui/react";
-import Toggle from "@/components/ui/Toggle";
-import {useEffect, useState} from "react";
-import {generateSchedule} from "@/utils/api/scheduleApi";
-import Alert from "@/components/ui/Alert";
-import SolidButton from "@/components/ui/Buttons/SolidButton";
-
-interface ScheduleRegenerateFormProps {
-    closeModal: () => void;
-}
-
-const ScheduleRegenerateForm = ({closeModal}: ScheduleRegenerateFormProps) => {
-    const [overwrite, setOverwrite] = useState(false);
-    const [error, setError] = useState("");
-
-    useEffect(() => {
-    }, [overwrite]);
-
-    const close = () => {
-        closeModal();
-    }
-
-    const handleToggle = () => {
-        setOverwrite(!overwrite)
-    }
-
-    const handleSubmit = () => {
-        generateSchedule(overwrite)
-            .then(() => close())
-            .catch((err) => setError(err))
-    }
-
-    return <>
-        <div className="bg-gray-500 px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
-            <div className="sm:flex sm:items-start w-full">
-                <div className="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left ">
-                    <DialogTitle as="h3" className="text-base font-semibold text-accent-blue">
-                        Regenerate Schedule
-                    </DialogTitle>
-                    <div className="mt-5">
-                        <div className="flex">
-                            {
-                                error && <Alert type="error">{ error }</Alert>
-                            }
-                            <div className="flex-1/2 pr-5">
-                                <label htmlFor="overwrite" className="text-accent-blue">Overwrite current schedule</label>
-                            </div>
-                            <div className="flex-1/2">
-                                <Toggle onChange={handleToggle} checked={overwrite} />
-                            </div>
-                        </div>
-                    </div>
-
-
-                </div>
-            </div>
-        </div>
-        <div className="bg-gray-500 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6">
-            <SolidButton
-                type="button"
-                onClick={() => handleSubmit()}
-                className="inline-flex w-full justify-center rounded-md px-3 py-2 text-sm font-semibold shadow-xs sm:ml-3 sm:w-auto"
-            >
-                Regenerate
-            </SolidButton>
-            <SolidButton
-                type="button"
-                data-autofocus
-                onClick={() => close()}
-                className="mt-3 inline-flex w-full justify-center rounded-md bg-gray-500 px-3 py-2 text-sm font-semibold text-gray-900 ring-1 shadow-xs border-secondary ring-inset  sm:mt-0 sm:w-auto"
-            >
-                Cancel
-            </SolidButton>
-        </div>
-    </>;
-};
-
-export default ScheduleRegenerateForm;

frontend-old/app/components/features/schedule/UpcomingDishes.tsx

@@ -1,60 +0,0 @@
-import { useCallback, useEffect, useState } from "react";
-import { DateTime } from "luxon";
-import ScheduleCalendar from "@/components/features/schedule/ScheduleCalendar";
-import PageTitle from "@/components/ui/PageTitle";
-import Spinner from "@/components/Spinner";
-import { ScheduleType } from "@/types/ScheduleType";
-import { listSchedule } from "@/utils/api/scheduleApi";
-import OnboardingBanner from "@/components/features/OnboardingBanner"
-import { useFetchUsers } from "@/hooks/useFetchUsers"
-import { useFetchDishes } from "@/hooks/useFetchDishes"
-import ScheduleRegenerateButton from "@/components/features/schedule/ScheduleRegenerateButton";
-
-const UpcomingDishes = () => {
-    const [schedule, setSchedule] = useState<ScheduleType[]>([]);
-    const [isLoading, setIsLoading] = useState(true);
-
-    const today = DateTime.now().toFormat("yyyy-LL-dd");
-
-    const fetchSchedule = useCallback(() => {
-        setIsLoading(true);
-        listSchedule(today)
-            .then((dishes) => setSchedule(dishes))
-            .finally(() => setIsLoading(false));
-    }, [today]);
-
-    useEffect(() => {
-        fetchSchedule();
-    }, [fetchSchedule]);
-
-    const { users, isLoading: areUsersLoading } = useFetchUsers();
-    const { dishes, isLoading: areDishesLoading } = useFetchDishes();
-
-    if (isLoading || areUsersLoading || areDishesLoading) {
-        return <Spinner />;
-    }
-
-    if (users.length === 0 || dishes.length === 0) {
-        return <OnboardingBanner dishes={dishes} users={users} />
-    }
-
-    return (
-        <div className="justify-items-center">
-            <div className="flex w-full py-2">
-                <div className="flex-none w-1/2 text-left pt-1">
-                    <PageTitle>Schedule</PageTitle>
-                </div>
-                <div className="flex-none w-1/2 text-right">
-                    <ScheduleRegenerateButton onModalClose={fetchSchedule} />
-                </div>
-            </div>
-            {
-                !schedule || Object.keys(schedule).length === 0
-                    ? <div className="w-full text-center text-2xl border-white border-2 rounded-xl mt-4">No dishes scheduled</div>
-                    : <ScheduleCalendar schedule={schedule as ScheduleType[]} />
-            }
-        </div>
-    );
-};
-
-export default UpcomingDishes;

frontend-old/app/components/features/schedule/UserDishEditCard.tsx

@@ -1,79 +0,0 @@
-import {FormEvent, useMemo, useState} from "react";
-import {DishType} from "@/types/DishType";
-import {ScheduledUserDishType} from "@/types/ScheduledUserDishType";
-import {updateScheduledUserDish} from "@/utils/api/scheduledUserDishesApi";
-import Alert from "@/components/ui/Alert";
-import classNames from "classnames";
-
-interface Props {
-    scheduledUserDish: ScheduledUserDishType
-    allDishes: DishType[]
-}
-
-const UserDishEditCard = ({ scheduledUserDish, allDishes }: Props) => {
-    const [selectedUserDishId, setSelectedUserDishId] = useState<number>(scheduledUserDish.user_dish ? scheduledUserDish.user_dish.id : 0)
-    const [errorMessage, setErrorMessage] = useState<string>("")
-    const [isSuccess, setIsSuccess] = useState(false);
-
-    const selectStyle = classNames(
-        'p-2', 'rounded', 'w-full', 'background-secondary',
-        'focus:outline-none',
-        'transition-[border-color] ease-out duration-1000', 'border-2', // Keep consistent base styles
-        {
-            'border-green-500': isSuccess,                      // Green border when successful
-            'border-red-500': !isSuccess && errorMessage !== "", // Red border when there's an error
-            'border-secondary': !isSuccess && errorMessage === "", // Default border for neutral state
-        }
-    )
-
-    const handleOnChange = (e: FormEvent<HTMLSelectElement>) => {
-        const userDishId = parseInt(e.currentTarget.value);
-        setSelectedUserDishId(userDishId);
-
-        updateScheduledUserDish(scheduledUserDish.id, userDishId)
-            .then(() => {
-                setIsSuccess(false);
-                setTimeout(() => {
-                    setIsSuccess(true);
-                    setTimeout(() => setIsSuccess(false), 1000);
-                }, 0);
-            })
-            .catch((error) => {
-                setErrorMessage(error); // Log API errors
-            });
-    };
-
-    const filteredDishes = useMemo(() =>
-        allDishes.filter((dish: DishType) =>
-            dish.users.some((user) => user.id === scheduledUserDish.user_dish.user.id)
-        ),
-        [allDishes, scheduledUserDish.user_dish.user.id]
-    )
-
-    return (
-        <div className="m-5 mb-10">
-            <div className="text-2xl">{scheduledUserDish.user_dish.user.name}</div>
-
-            { errorMessage !== "" && <Alert type="error">{ errorMessage }</Alert> }
-
-            <label htmlFor="name" className="block text-sm font-medium mt-2">Dish</label>
-            <select
-                value={selectedUserDishId}
-                onChange={(e) => handleOnChange(e)}
-                className={selectStyle}
-            >
-                <option key={0} value={0}>Skip Dish</option>
-                {
-                    filteredDishes
-                        .map((dish: DishType) =>
-                            <option key={dish.id} value={dish.id}>
-                                {dish.name}
-                            </option>
-                        )
-                }
-            </select>
-        </div>
-    );
-};
-
-export default UserDishEditCard;

frontend-old/app/components/features/schedule/dayCard/DateBadge.tsx

@@ -1,27 +0,0 @@
-import {DateTime} from "luxon";
-import React from "react";
-import classNames from "classnames";
-
-interface Props {
-    date: string
-    className?: string;
-}
-
-const DateBadge = ({ className, date }: Props) => {
-    const isToday = DateTime.fromISO(date).toFormat("yyyy-LL-dd") == DateTime.now().toFormat("yyyy-LL-dd")
-
-    const textStyle = classNames("inline font-bold", {
-        'text-accent-blue': isToday,
-        'text-secondary': !isToday,
-    }, className)
-
-    return (
-        <div className="flex-none w-20 text-center my-auto pb-3 px-3">
-            <div className={classNames(textStyle, 'text-3xl')}>{DateTime.fromISO(date).toFormat("dd")}</div>
-            <br/>
-            <div className={classNames(textStyle, 'text-xl uppercase')}>{DateTime.fromISO(date).toFormat("LLL")}</div>
-        </div>
-    )
-}
-
-export default DateBadge

frontend-old/app/components/features/schedule/dayCard/ScheduleDayCard.tsx

@@ -1,50 +0,0 @@
-import React from "react";
-import {UserType} from "~/types/UserType";
-import ScheduleDayCardUserDish from "~/components/features/schedule/dayCard/ScheduleDayCardUserDish";
-import { FilledScheduleType, ScheduleType } from "~/types/ScheduleType";
-import { Link } from "react-router";
-import {PencilSquareIcon} from "@heroicons/react/24/outline";
-import useRoutes from "~/hooks/useRoutes";
-import DateBadge from "~/components/features/schedule/dayCard/DateBadge";
-import { DateTime } from "luxon"
-import classNames from "classnames"
-
-interface Props {
-    schedule: ScheduleType|FilledScheduleType;
-    users: UserType[];
-}
-
-const ScheduleDayCard = ({schedule, users}: Props) => {
-    const routes = useRoutes()
-    const isToday = DateTime.fromISO(schedule.date).toFormat("yyyy-LL-dd") == DateTime.now().toFormat("yyyy-LL-dd")
-
-    const containerStyles = classNames(
-        'w-full bg-gray-500 pt-5 pb-2 rounded-2xl text-xl', {
-            'border-2 text-accent-blue border-accent-blue': isToday,
-        }
-    )
-
-    return (
-        <div className="relative flex pt-3 pr-2 w-full border-1 border-accent">
-            <DateBadge date={schedule.date} />
-
-            <div className={containerStyles}>
-                {
-                    users.map((user) => <ScheduleDayCardUserDish key={user.id} user={user} schedule={schedule}/>)
-                }
-
-                <div className="w-full mt-2 border-t-2 border-background">
-                    <Link
-                        className="w-full flex text-sm pr-3 pt-2"
-                        aria-label="Edit dish"
-                        to={routes.schedule.date.edit(schedule.date)}
-                    >
-                        <PencilSquareIcon className="h-5 w-5 mr-2 ml-auto" /> Edit
-                    </Link>
-                </div>
-            </div>
-        </div>
-    );
-};
-
-export default ScheduleDayCard;

frontend-old/app/components/features/schedule/dayCard/ScheduleDayCardUserDish.tsx

@@ -1,32 +0,0 @@
-import React from "react";
-import { ScheduledUserDishType } from "@/types/ScheduledUserDishType";
-import { UserType } from "@/types/UserType";
-import { FilledScheduleType, ScheduleType } from "@/types/ScheduleType";
-
-interface Props {
-    schedule: ScheduleType|FilledScheduleType;
-    user: UserType;
-}
-
-const ScheduleDayCardUserDish = ({ schedule, user }: Props) => {
-    const getDish = (user: UserType) => {
-        const scheduled_dishes = schedule.scheduled_user_dishes.filter((scheduled_user_dish: ScheduledUserDishType) => (
-            scheduled_user_dish.user_dish?.user.id == user.id
-        ))
-
-        if (scheduled_dishes.length > 0) {
-            return scheduled_dishes[0].user_dish.dish.name
-        }
-
-        return '/'
-    }
-
-    return (
-        <div className="w-full flex background-secondary pb-1 rounded-2xl text-xl" key={ `user-${ user.id }` }>
-            <div className="w-1/3 font-size-16 text-right pr-3">{ user.name } : </div>
-            <div className="w-2/3 font-size-16">{ getDish(user) }</div>
-        </div>
-    );
-};
-
-export default ScheduleDayCardUserDish;

frontend-old/app/components/features/users/EditUserForm.tsx

@@ -1,63 +0,0 @@
-import React, {useState} from "react";
-import { useNavigate } from "react-router";
-import useRoutes from "~/hooks/useRoutes";
-import {updateUser} from "~/utils/api/usersApi";
-import PageTitle from "~/components/ui/PageTitle";
-import { Link } from "react-router";
-import Alert from "~/components/ui/Alert";
-import {UserType} from "~/types/UserType";
-import SolidButton from "~/components/ui/Buttons/SolidButton";
-
-interface Props {
-    user: UserType;
-}
-
-const EditUserForm = ({ user }: Props) => {
-
-    const [name, setName] = useState<string>(user.name);
-    const [error, setError] = useState<string>('');
-    const navigate = useNavigate();
-    const routes = useRoutes();
-
-    const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
-        e.preventDefault();
-
-        // validateName
-        if (!name.trim()) {
-            setError('Name cannot be empty.');
-            return;
-        }
-
-        updateUser(user, name)
-            .then(() => {
-                navigate(routes.user.index())
-            })
-    }
-
-    return (
-        <div className="w-full flex flex-col items-center">
-            <PageTitle>Create User</PageTitle>
-            <Link to={routes.user.index()} className="mr-auto">Back to users</Link>
-
-            <form onSubmit={handleSubmit} className="w-full max-w-sm mt-4 border-secondary border-2 rounded p-4">
-                {
-                    error != '' && <Alert type="error" className="mt-4">{ error }</Alert>
-                }
-
-                <label htmlFor="name">Name</label>
-                <input type="text"
-                       placeholder=""
-                       name="name"
-                       id="name"
-                       value={name}
-                       onChange={(e) => setName(e.target.value)}
-                       className="w-full p-2 border rounded bg-primary border-secondary bg-gray-600 text-secondary"
-                />
-
-                <SolidButton type="submit" className="mt-4">Update</SolidButton>
-            </form>
-        </div>
-    );
-}
-
-export default EditUserForm;

frontend-old/app/components/layout/AuthGuard.tsx

@@ -1,26 +0,0 @@
-import { useAuth } from '@/context/AuthContext';
-import React, { useEffect } from 'react';
-import { useLocation, useNavigate } from "react-router"
-
-export default function AuthGuard({ children }: { children: React.ReactNode }) {
-    const { isAuthenticated } = useAuth();
-    const navigate = useNavigate();
-    const location = useLocation();
-
-    const publicRoutes = ['/login', '/register'];
-    const isPublic = publicRoutes.includes(location.pathname);
-
-    useEffect(() => {
-        // Handle redirects based on auth state
-        if (isAuthenticated && isPublic) {
-            // Redirect authenticated users away from public pages
-            navigate('/', { replace: true });
-        } else if (!isAuthenticated && !isPublic) {
-            // Redirect unauthenticated users trying to access protected pages
-            navigate('/login', { replace: true });
-        }
-    }, [isAuthenticated, location.pathname, isPublic, navigate]);
-
-    // Render children for all routes - redirects will happen via useEffect
-    return <>{children}</>;
-}

frontend-old/app/components/layout/Card.tsx

@@ -1,15 +0,0 @@
-import React from "react";
-
-interface Props {
-    children: React.ReactNode;
-}
-
-const Card = ({ children }: Props) => {
-    return (
-        <div className="w-full border-2 border-secondary p-2 pl-4 my-2 rounded flex">
-            { children }
-        </div>
-    )
-}
-
-export default Card

frontend-old/app/components/layout/NavBar.tsx

@@ -1,80 +0,0 @@
-import React, { useState } from "react";
-import { Link, useNavigate } from "react-router";
-import useRoutes from "~/hooks/useRoutes";
-import MobileDropdownMenu from "~/components/features/navbar/MobileDropdownMenu";
-import { useAuth } from "~/context/AuthContext";
-
-const NavBar = () => {
-    const [isOpen, setIsOpen] = useState(false);
-    const routes = useRoutes();
-    const navigate = useNavigate();
-    const {isAuthenticated, logout} = useAuth();
-
-    const handleLogout = (e: React.MouseEvent) => {
-        e.preventDefault();
-        logout();
-        navigate('/login', { replace: true });
-    };
-
-    return (
-        <nav className="border-b-2 border-secondary shadow-sm z-50 mb-8">
-            <div className="relative flex justify-between items-center px-4 lg:px-8 py-2 lg:container lg:mx-auto">
-            {/* Logo */}
-            <Link to={routes.home()} className="pt-2 text-2xl font-syncopate text-primary">
-                DISH PLANNER
-            </Link>
-
-            {/* Hamburger Menu - For Mobile View */}
-            { isAuthenticated && (
-                <>
-                    <button
-                        className="text-primary w-8 h-8 md:hidden flex items-center justify-center"
-                        onClick={() => setIsOpen(!isOpen)} // Toggle menu visibility
-                        aria-label="Toggle menu"
-                    >
-                        <svg
-                            xmlns="http://www.w3.org/2000/svg"
-                            className="h-6 w-6"
-                            fill="none"
-                            viewBox="0 0 24 24"
-                            stroke="currentColor"
-                        >
-                            <path
-                                strokeLinecap="round"
-                                strokeLinejoin="round"
-                                strokeWidth={2}
-                                d={isOpen ? "M6 18L18 6M6 6l12 12" : "M4 6h16M4 12h16M4 18h16"}
-                            />
-                        </svg>
-                    </button>
-
-                    {/* Desktop Menu */}
-                    <div className="hidden md:flex space-x-6">
-                        <Link to={routes.home()} className="text-accent-blue hover:background-secondary">
-                            Home
-                        </Link>
-                        <Link to={routes.dish.index()} className="text-accent-blue hover:background-secondary">
-                            Dishes
-                        </Link>
-                        <Link to={routes.user.index()} className="text-accent-blue hover:background-secondary">
-                            Users
-                        </Link>
-                        <Link to={routes.schedule.history()} className="text-accent-blue hover:background-secondary">
-                            History
-                        </Link>
-                        <Link to={routes.auth.login()}
-                              onClick={handleLogout}
-                              className="text-primary text-right hover:background-secondary">
-                            Logout
-                        </Link>
-                    </div>
-
-                    <MobileDropdownMenu isOpen={isOpen} setIsOpen={setIsOpen} handleLogout={handleLogout} />
-                </>
-            )}
-            </div>
-        </nav>
-    );
-};
-
-export default NavBar;

frontend-old/app/components/pages/PrivatePage.tsx

@@ -1,9 +0,0 @@
-const PrivatePage = () => {
-    return (
-        <div>
-            private
-        </div>
-    )
-}
-
-export default PrivatePage

frontend-old/app/components/pages/PublicPage.tsx

@@ -1,11 +0,0 @@
-import { Outlet } from "react-router"
-
-const PublicPage = () => {
-    return (
-        <div>
-            <Outlet />
-        </div>
-    )
-}
-
-export default PublicPage

frontend-old/app/components/ui/Alert.tsx

@@ -1,34 +0,0 @@
-import React from "react"
-import classNames from "classnames";
-
-interface Props {
-    children: React.ReactNode;
-    className?: string;
-    type: 'error' | 'warning' | 'info' | 'success';
-}
-
-const Alert = ({ children, className, type }: Props) => {
-    let bgColor = 'bg-blue-200'
-    let fgColor = 'bg-blue-800'
-
-    if (type == 'error') {
-        bgColor = 'bg-red-200'
-        fgColor = 'bg-red-800'
-    } else if (type == 'warning') {
-        bgColor = 'bg-orange-200'
-        fgColor = 'bg-orange-800'
-    } else if (type == 'success') {
-        bgColor = 'border-2 border-green-500'
-        fgColor = 'text-green-500'
-    }
-
-    const styles = classNames(fgColor, bgColor, className, 'rounded')
-
-    return (
-        <div className={styles}>
-            { children}
-        </div>
-    )
-}
-
-export default Alert

frontend-old/app/components/ui/Button.tsx

@@ -1,62 +0,0 @@
-import { Link } from "react-router";
-import React from "react";
-import classNames from "classnames";
-
-interface ButtonProps {
-    appearance?: 'solid' | 'outline' | 'text';
-    children: React.ReactNode;
-    className?: string;
-    href?: string;
-    icon?: React.ReactNode;
-    onClick?: () => void;
-    disabled?: boolean;
-    size?: 'small' | 'medium' | 'large';
-    type?: 'button' | 'submit' | 'reset';
-    variant?: 'primary' | 'secondary' | 'accent';
-}
-
-const Button = ({ appearance, children, className, disabled, href, icon, onClick,
-    size = 'medium', type,
-    variant = 'primary'
-}: ButtonProps) => {
-    const styles = classNames(
-        "flex items-center space-x-1",
-        "justify-center font-size-18 py-2 px-4 rounded flex",
-        {
-            'border-2 border-primary background-red text-white': variant === 'primary' && appearance === 'solid',
-            'border-2 border-primary text-primary': variant === 'primary' && appearance === 'outline',
-            'text-primary': variant === 'primary' && appearance === 'text',
-            'border-2 border-secondary text-secondary': variant === 'secondary' && appearance === 'outline',
-            'border-2 border-accent-blue text-accent-blue': variant === 'accent' && appearance === 'outline',
-        },
-        className
-    )
-
-    const iconClassNames = classNames({
-        "h-4 w-4 mr-1": size === "small",
-        "h-5 w-5 mr-1": size === "medium",
-        "h-7 w-7 mr-2": size === "large",
-    });
-
-    const iconElement =
-        React.isValidElement(icon) &&
-        React.cloneElement(icon as React.ReactElement<{ className?: string }>, {
-            className: iconClassNames,
-        });
-
-    if (href !== undefined) {
-        return (
-            <Link to={href} className={styles}>
-                { icon && iconElement}
-                { children}
-            </Link>
-        )
-    }
-
-    return <button onClick={onClick} className={styles} disabled={disabled} type={ type ?? 'button'}>
-        { icon && iconElement}
-        { children }
-    </button>
-}
-
-export default Button

frontend-old/app/components/ui/Buttons/OutlineButton.tsx

@@ -1,37 +0,0 @@
-import React from "react";
-import classNames from "classnames";
-
-interface Props {
-    children: React.ReactNode;
-    className?: string;
-    disabled?: boolean;
-    onClick?: () => void;
-    size?: "small" | "medium" | "large";
-    type: 'submit' | 'button';
-}
-
-const OutlineButton = ({ children, className, disabled = false, onClick, size, type }: Props) => {
-    const style = classNames(
-        "justify-center border-2 border-accent font-size-18 text-accent-blue py-2 px-4 rounded flex",
-        { 'text-xs': size === "small" },
-        className
-    )
-
-    if (onClick === undefined) {
-        onClick = () => {
-        }
-    }
-
-    return (
-        <button
-            type={ type }
-            className={ style }
-            disabled={ disabled }
-            onClick={ onClick }
-        >
-            { children }
-        </button>
-    )
-}
-
-export default OutlineButton

frontend-old/app/components/ui/Buttons/OutlineLinkButton.tsx

@@ -1,49 +0,0 @@
-import React from "react";
-import classNames from "classnames";
-import { Link } from "react-router"
-
-interface Props {
-    children: React.ReactNode;
-    className?: string;
-    href: string;
-    icon?: React.ReactNode;
-    size?: "small" | "medium" | "large";
-    variant?: "primary" | "secondary";
-}
-
-const OutlineLinkButton = ({ children, className, href, icon, size = "medium", variant }: Props) => {
-    const linkClassNames = classNames(
-        "underline font-default pt-3 pb-3 px-4 rounded mb-0 flex",
-        {
-            'text-primary border-primary': variant === "primary",
-            'text-secondary border-secondary': variant === "secondary",
-            'text-accent-blue border-accent': !variant || !["primary", "secondary"].includes(variant),
-        }, {
-            'text-size-14': size === "small",
-            'font-size-18': !size || size === "medium",
-            'text-2xl': size === "large",
-        },
-        className,
-    )
-
-    const iconClassNames = classNames("mt-0.5", {
-        "h-4 w-4 mr-1": size === "small",
-        "h-5 w-5 mr-1": size === "medium", // Default size
-        "h-7 w-7 mr-2": size === "large",
-    });
-
-    const iconElement =
-        React.isValidElement(icon) &&
-        React.cloneElement(icon as React.ReactElement<{ className?: string }>, {
-            className: iconClassNames,
-        });
-
-    return (
-        <Link className={linkClassNames} to={href}>
-            {iconElement}
-            {children}
-        </Link>
-    )
-}
-
-export default OutlineLinkButton

frontend-old/app/components/ui/Buttons/SolidButton.tsx

@@ -1,40 +0,0 @@
-import React from "react";
-import classNames from "classnames";
-
-interface Props {
-    children: React.ReactNode;
-    className?: string;
-    disabled?: boolean;
-    onClick?: () => void;
-    size?: "small" | "medium" | "large";
-    type: 'submit' | 'button';
-}
-
-const SolidButton = ({ children, className, disabled = false, onClick, size, type }: Props) => {
-    const style = classNames(
-        "py-2 px-4 bg-primary text-white text-xl p-2 rounded hover:bg-secondary mb-0",
-        {
-            'text-xs': size === "small",
-            'font-size-18': !size || size === "medium",
-        },
-        className
-    )
-
-    if (onClick === undefined) {
-        onClick = () => {
-        }
-    }
-
-    return (
-        <button
-            className={ style }
-            disabled={ disabled }
-            onClick={ onClick }
-            type={ type }
-        >
-            { children }
-        </button>
-    )
-}
-
-export default SolidButton

frontend-old/app/components/ui/Buttons/SolidLinkButton.tsx

@@ -1,46 +0,0 @@
-import React from "react";
-import classNames from "classnames";
-import { Link } from "react-router"
-
-interface Props {
-    children: React.ReactNode;
-    className?: string;
-    href: string;
-    icon?: React.ReactNode;
-    size?: "small" | "medium" | "large";
-    variant?: "primary" | "secondary";
-}
-
-const SolidLinkButton = ({ children, className, href, icon, size = "medium", variant }: Props) => {
-    const style = classNames(
-        "py-2 px-4 text-xl p-2 rounded hover:bg-secondary mb-0 text-center flex",
-        {
-            'background-red text-white': variant === "primary",
-            'background-secondary border-2 border-secondary': variant === "secondary",
-        },
-        className
-    )
-
-    const iconClassNames = classNames("mt-1", {
-        "h-4 w-4 mr-1": size === "small",
-        "h-5 w-5 mr-1": size === "medium", // Default size
-        "h-7 w-7 mr-2": size === "large",
-    });
-
-    const iconElement =
-        React.isValidElement(icon) &&
-        React.cloneElement(icon as React.ReactElement<{ className?: string }>, {
-            className: iconClassNames,
-        });
-
-    return (
-        <Link className={style} to={href}>
-            <div className="flex-grow"></div>
-            {iconElement}
-            {children}
-            <div className="flex-grow"></div>
-        </Link>
-    )
-}
-
-export default SolidLinkButton

frontend-old/app/components/ui/Description.tsx

@@ -1,17 +0,0 @@
-import classNames from "classnames";
-import React from "react";
-
-interface Props {
-    children: React.ReactNode;
-    className?: string;
-}
-
-const Description = ({ children, className }: Props) => {
-    const style = classNames("italic font-size-16",
-        className
-    )
-
-    return <p className={style}>{ children }</p>
-}
-
-export default Description

frontend-old/app/components/ui/Hr.tsx

@@ -1,13 +0,0 @@
-import classNames from "classnames"
-
-interface HrProps {
-    className?: string;
-}
-
-const Hr = ({ className }: HrProps) => {
-    const styles = classNames("my-4 border-secondary", className)
-
-    return <hr className={styles}/>
-}
-
-export default Hr

frontend-old/app/components/ui/Label.tsx

@@ -1,25 +0,0 @@
-import React from "react";
-
-interface LabelProps {
-    href?: string;
-    children: React.ReactNode;
-    onClick?: () => void;
-}
-
-const Label = ({ href, children, onClick }: LabelProps) => {
-    const styles = "items-center space-x-1 background-accent p-2 rounded"
-
-    if (href !== undefined) {
-        return (
-            <div className={styles}>
-                { children}
-            </div>
-        )
-    }
-
-    return <button className={styles} onClick={onClick}>
-        { children }
-    </button>
-}
-
-export default Label

frontend-old/app/components/ui/Modal.tsx

@@ -1,60 +0,0 @@
-import { type JSX } from "react";
-import classNames from "classnames";
-import Button from "@/components/ui/Button"
-
-interface ModalProps {
-    buttonChildren?: JSX.Element;
-    buttonClassName?: string;
-    buttonLabel?: string;
-    modalChildren: JSX.Element;
-    modalOpen?: boolean;
-    setModalOpen: (open: boolean) => void;
-}
-
-const Modal = ({
-    buttonLabel,
-    buttonClassName,
-    modalChildren,
-    modalOpen,
-    buttonChildren,
-    setModalOpen,
-}: ModalProps) => {
-    const buttonStyles = classNames(buttonClassName, 'anta-regular');
-
-    const closeModal = () => {
-        setModalOpen(false)
-    }
-
-    return (
-        <>
-            <Button variant="primary" appearance="outline" type="button" onClick={() => setModalOpen(true)} className={buttonStyles}>
-                {buttonChildren
-                    ? buttonChildren
-                    : buttonLabel ?? 'button'
-                }
-            </Button>
-
-            {/*<Dialog open={modalOpen} onClose={setModalOpen} className="relative z-10">*/}
-            {/*    <DialogBackdrop*/}
-            {/*        transition*/}
-            {/*        className="fixed inset-0 bg-gray-500/75 transition-opacity data-closed:opacity-0 data-enter:duration-300 data-enter:ease-out data-leave:duration-200 data-leave:ease-in"*/}
-            {/*    />*/}
-            {/*    <div className="fixed inset-0 z-10 w-screen overflow-y-auto">*/}
-            {/*        <div*/}
-            {/*            className="flex min-h-full items-start mt-5 justify-center p-4 text-center sm:items-center sm:p-0">*/}
-            {/*            <DialogPanel*/}
-            {/*                transition*/}
-            {/*                className="relative transform overflow-hidden rounded-lg bg-primary text-left shadow-xl transition-all data-closed:translate-y-4 data-closed:opacity-0 data-enter:duration-300 data-enter:ease-out data-leave:duration-200 data-leave:ease-in sm:my-8 sm:w-full sm:max-w-lg data-closed:sm:translate-y-0 data-closed:sm:scale-95"*/}
-            {/*            >*/}
-            {/*                <XMarkIcon width={24} className="absolute top-4 right-4 cursor-pointer"*/}
-            {/*                           onClick={() => closeModal()}/>*/}
-            {/*                {modalChildren}*/}
-            {/*            </DialogPanel>*/}
-            {/*        </div>*/}
-            {/*    </div>*/}
-            {/*</Dialog>*/}
-        </>
-    )
-}
-
-export default Modal;

frontend-old/app/components/ui/PageTitle.tsx

@@ -1,17 +0,0 @@
-import classNames from "classnames";
-
-interface Props {
-    children: string,
-    className?: string,
-}
-
-const PageTitle = ({ children, className }: Props) => {
-    const styles = classNames(
-        'ml-4 text-2xl font-default uppercase w-full text-accent-blue font-bold',
-        className,
-    )
-
-    return <h1 className={styles}>{ children }</h1>
-}
-
-export default PageTitle

frontend-old/app/components/ui/RecurrenceInput.tsx

@@ -1,65 +0,0 @@
-import React, {useState} from "react";
-
-interface Props {
-    value: number;
-    setValue: (value: number) => void;
-}
-
-const RecurrenceInput = ({ value, setValue}: Props) => {
-    const [openInput, setOpenInput] = useState<'category' | 'number'>([7, 365].includes(value) ? 'category' : 'number')
-
-    const toggleInput = (e: React.MouseEvent<HTMLButtonElement>) => {
-        e.preventDefault()
-        setOpenInput(openInput == 'category' ? 'number' : 'category')
-    }
-
-    const toggleButton = () => {
-        return (
-            <button onClick={toggleInput} className={'mt-2'}>
-                {
-                    openInput === 'number'
-                        ? 'or select from presets'
-                        : 'or choose amount of days...'
-                }
-            </button>
-        )
-    }
-
-    const prepareValue = (v: string) => {
-        setValue(parseInt(v))
-    }
-
-    return (
-        <div>
-        <div className={openInput === 'number' ? 'hidden' : ''}>
-                <label htmlFor="recurrence-category" className="block text-sm font-medium">Recurrence</label>
-                <select
-                    id="recurrence-category"
-                    name="recurrence-category"
-                    value={value}
-                    onChange={(e) => prepareValue(e.target.value)}
-                    className="w-full p-2 mb-4 border rounded bg-primary border-secondary bg-gray-600 text-secondary"
-                >
-                    <option value="7">Weekly</option>
-                    <option value="365">Yearly</option>
-                </select>
-                { toggleButton() }
-            </div>
-
-            <div className={openInput === 'number' ? '' : 'hidden'}>
-                <label htmlFor="recurrence-number" className="block text-sm font-medium">Recurrence</label>
-                <input
-                    type="number"
-                    id="recurrence-number"
-                    name="recurrence-number"
-                    value={value}
-                    onChange={(e) => prepareValue(e.target.value)}
-                    className="p-2 border rounded w-full bg-gray-500 border-secondary"
-                />
-                { toggleButton() }
-            </div>
-        </div>
-    )
-}
-
-export default RecurrenceInput

frontend-old/app/components/ui/SectionTitle.tsx

@@ -1,16 +0,0 @@
-import classNames from "classnames";
-
-interface Props {
-    children: string;
-    className?: string;
-}
-
-const SectionTitle = ({ children, className }: Props) => {
-    const style = classNames("block font-size-18 uppercase w-full pl-2 text-accent-blue",
-        className
-    )
-
-    return <h2 className={style}>{ children }</h2>
-}
-
-export default SectionTitle

frontend-old/app/components/ui/Toggle.tsx

@@ -1,41 +0,0 @@
-
-interface ToggleProps {
-    checked: boolean;
-    onChange: (checked: boolean) => void;
-}
-
-const Toggle = ({ checked, onChange }: ToggleProps) => {
-    const handleChange = () => {
-        onChange(checked);
-    }
-
-    return (
-        <label
-            className="flex items-center relative w-max cursor-pointer select-none"
-        >
-            {/* Hidden input */}
-            <input
-                type="checkbox"
-                checked={checked}
-                onChange={() => handleChange()} // Update state using the checkbox itself
-                className="sr-only"
-            />
-
-            {/* Toggle text-accent-blue */}
-            <div
-                className={`relative transition-colors w-14 h-7 rounded-full cursor-pointer ${
-                    checked ? "bg-green-500" : "bg-red-500"
-                }`}
-            >
-                {/* The slider dot */}
-                <span
-                    className={`absolute top-0.5 left-0.5 w-6 h-6 rounded-full transform transition-transform bg-white ${
-                        checked ? "translate-x-7" : "translate-x-0"
-                    }`}
-                ></span>
-            </div>
-        </label>
-    );
-};
-
-export default Toggle;

frontend-old/app/context/AuthContext.tsx

@@ -1,41 +0,0 @@
-import React, { createContext, useContext, useEffect, useState } from 'react';
-
-interface AuthContextProps {
-    isAuthenticated: boolean;
-    login: () => void;
-    logout: () => void;
-}
-
-const AuthContext = createContext<AuthContextProps>({
-    isAuthenticated: false,
-    login: () => {},
-    logout: () => {},
-});
-
-export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
-    // Start with false during SSR, will be updated on client
-    const [isAuthenticated, setIsAuthenticated] = useState<boolean>(false);
-
-    useEffect(() => {
-        // Check token on client after mount
-        const token = localStorage.getItem('token');
-        setIsAuthenticated(!!token);
-    }, []);
-
-    const login = () => {
-        setIsAuthenticated(true);
-    };
-
-    const logout = () => {
-        setIsAuthenticated(false);
-        localStorage.removeItem('token');
-    };
-
-    return (
-        <AuthContext.Provider value={{ isAuthenticated, login, logout }}>
-            {children}
-        </AuthContext.Provider>
-    );
-};
-
-export const useAuth = () => useContext(AuthContext);

frontend-old/app/helpers/Date.ts

@@ -1,18 +0,0 @@
-import { DateTime } from 'luxon';
-
-// Validate if a given string matches the "yyyy-MM-dd" format and is a valid date
-export const isValidDate = (date: string): boolean => {
-    const parsedDate = DateTime.fromFormat(date, 'yyyy-MM-dd');
-    return parsedDate.isValid && parsedDate.toFormat('yyyy-MM-dd') === date;
-};
-
-// Format a date to a specific string format
-export const formatDate = (date: Date | string, format: string = 'yyyy-MM-dd'): string => {
-    const parsedDate = typeof date === 'string' ? DateTime.fromISO(date) : DateTime.fromJSDate(date);
-    return parsedDate.toFormat(format);
-};
-
-// Compare two dates to see if one is before the other
-export const isBefore = (date1: string, date2: string): boolean => {
-    return DateTime.fromISO(date1) < DateTime.fromISO(date2);
-};

frontend-old/app/hooks/useFetchDishes.ts

@@ -1,22 +0,0 @@
-import { useState, useEffect } from "react";
-import { listDishes } from "@/utils/api/dishApi"
-import { DishType } from "@/types/DishType"
-
-export const useFetchDishes = () => {
-    const [dishes, setDishes] = useState<DishType[]>([]);
-    const [isLoading, setIsLoading] = useState<boolean>(true);
-    const [error, setError] = useState<string | null>(null);
-
-    useEffect(() => {
-        const fetchDishes = async () => {
-            listDishes()
-                .then((dishes: DishType[]) => setDishes(dishes))
-                .catch((err) => setError((err as Error).message || "An error occurred."))
-                .finally(() => setIsLoading(false));
-        };
-
-        fetchDishes();
-    }, []);
-
-    return { dishes, isLoading, error };
-};

frontend-old/app/hooks/useFetchUsers.ts

@@ -1,22 +0,0 @@
-import { useState, useEffect } from "react";
-import {UserType} from "@/types/UserType";
-import {listUsers} from "@/utils/api/usersApi";
-
-export const useFetchUsers = () => {
-    const [users, setUsers] = useState<UserType[]>([]);
-    const [isLoading, setIsLoading] = useState<boolean>(true);
-    const [error, setError] = useState<string | null>(null);
-
-    useEffect(() => {
-        const fetchUsers = async () => {
-            listUsers()
-                .then((users: UserType[]) => setUsers(users))
-                .catch((err) => setError((err as Error).message || "An error occurred."))
-                .finally(() => setIsLoading(false));
-        };
-
-        fetchUsers();
-    }, []);
-
-    return { users, isLoading, error };
-};

frontend-old/app/hooks/useRoutes.ts

@@ -1,32 +0,0 @@
-import type { DishType } from "@/types/DishType";
-import type { UserType } from "@/types/UserType";
-
-const useRoutes = () => {
-    return {
-        home: () => "/",
-        auth: {
-            login: () => "/login",
-            register: () => "/register",
-        },
-        dish: {
-            index: () => "/dishes",
-            create: () => "/dishes/create",
-            edit: (dish: DishType) => `/dishes/${ dish.id }/edit`,
-            delete: (dish: DishType) => `/dishes/${ dish.id }/delete`,
-        },
-        schedule: {
-            date: {
-                edit: (date: string) => `/schedule/${ date }/edit`
-            },
-            history: () => "/scheduled-user-dishes/history",
-        },
-        user: {
-            index: () => "/users",
-            create: () => `/users/create`,
-            edit: (user: UserType) => `/users/${ user.id }/edit`,
-            delete: (user: UserType) => `/users/${ user.id }/delete`,
-        }
-    };
-};
-
-export default useRoutes;

frontend-old/app/root.tsx

@@ -1,84 +0,0 @@
-import {
-    isRouteErrorResponse,
-    Links,
-    Meta,
-    Outlet,
-    Scripts,
-    ScrollRestoration,
-} from "react-router";
-
-import type { Route } from "./+types/root";
-import "./app.css";
-import React from "react"
-import { AuthProvider } from "~/context/AuthContext"
-import AuthGuard from "~/components/layout/AuthGuard"
-import NavBar from "~/components/layout/NavBar"
-
-export const links: Route.LinksFunction = () => [
-    { rel: "preconnect", href: "https://fonts.googleapis.com" },
-    {
-        rel: "preconnect",
-        href: "https://fonts.gstatic.com",
-        crossOrigin: "anonymous",
-    },
-    {
-        rel: "stylesheet",
-        href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap",
-    },
-];
-
-export function Layout({ children }: { children: React.ReactNode }) {
-    return (
-        <html lang="en">
-        <head>
-            <meta charSet="utf-8"/>
-            <meta name="viewport" content="width=device-width, initial-scale=1"/>
-            <Meta/>
-            <Links/>
-        </head>
-        <body className="antialiased w-full min-h-screen bg-gray-600">
-        <AuthProvider>
-            <AuthGuard>
-                <NavBar />
-                <div className="m-5 lg:container lg:mx-auto">{ children }</div>
-            </AuthGuard>
-        </AuthProvider>
-        <ScrollRestoration/>
-        <Scripts/>
-        </body>
-        </html>
-    );
-}
-
-export default function App() {
-    return <Outlet/>;
-}
-
-export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
-    let message = "Oops!";
-    let details = "An unexpected error occurred.";
-    let stack: string | undefined;
-
-    if (isRouteErrorResponse(error)) {
-        message = error.status === 404 ? "404" : "Error";
-        details =
-            error.status === 404
-                ? "The requested page could not be found."
-                : error.statusText || details;
-    } else if (import.meta.env.DEV && error && error instanceof Error) {
-        details = error.message;
-        stack = error.stack;
-    }
-
-    return (
-        <main className="pt-16 p-4 container mx-auto">
-            <h1>{ message }</h1>
-            <p>{ details }</p>
-            { stack && (
-                <pre className="w-full p-4 overflow-x-auto">
-          <code>{ stack }</code>
-        </pre>
-            ) }
-        </main>
-    );
-}

frontend-old/app/routes.ts

@@ -1,23 +0,0 @@
-import { type RouteConfig, index, route } from "@react-router/dev/routes";
-
-export default [
-    index("routes/home.tsx"),
-    route("login", "./components/features/auth/LoginForm.tsx"),
-    route("register", "./components/features/auth/RegisterForm.tsx"),
-
-    // Dishes routes
-    route("dishes", "routes/dishes.tsx"),
-    route("dishes/create", "routes/dishes.create.tsx"),
-    route("dishes/:id/edit", "routes/dishes.$id.edit.tsx"),
-
-    // Users routes
-    route("users", "routes/users.tsx"),
-    route("users/create", "routes/users.create.tsx"),
-    route("users/:id/edit", "routes/users.$id.edit.tsx"),
-
-    // Schedule routes
-    route("schedule/:date/edit", "routes/schedule.$date.edit.tsx"),
-
-    // History route
-    route("scheduled-user-dishes/history", "routes/scheduled-user-dishes.history.tsx"),
-] satisfies RouteConfig;

frontend-old/app/routes/dishes.$id.edit.tsx

@@ -1,66 +0,0 @@
-import type { Route } from "./+types/dishes.$id.edit";
-import { useCallback, useEffect, useState } from "react";
-import PageTitle from "~/components/ui/PageTitle";
-import EditDishForm from "~/components/features/dishes/EditDishForm";
-import { DishType } from "~/types/DishType";
-import Spinner from "~/components/Spinner";
-import { fetchDish } from "~/utils/api/dishApi";
-import SyncUsersForm from "~/components/features/dishes/SyncUsersForm";
-import { ChevronLeftIcon } from "@heroicons/react/16/solid";
-import useRoutes from "~/hooks/useRoutes";
-import OutlineLinkButton from "~/components/ui/Buttons/OutlineLinkButton";
-import Hr from "~/components/ui/Hr";
-import { useParams } from "react-router";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Edit Dish" },
-    { name: "description", content: "Edit dish details" },
-  ];
-}
-
-export default function EditDishPage() {
-  const params = useParams();
-  const id = Number(params.id);
-  const [dish, setDish] = useState<DishType | null>(null);
-  const [isLoading, setIsLoading] = useState<boolean>(true);
-  const routes = useRoutes();
-
-  const loadDish = useCallback(async () => {
-    try {
-      const fetchedDish = await fetchDish(id);
-      setDish(fetchedDish);
-    } catch (error) {
-      console.error("Error fetching dish:", error);
-      throw new Error("No token found in localStorage.");
-    } finally {
-      setIsLoading(false);
-    }
-  }, [id]);
-
-  useEffect(() => {
-    loadDish();
-  }, [loadDish]);
-
-  if (isLoading || dish === null) {
-    return <Spinner />;
-  }
-
-  return (
-    <div>
-      <div className="flex mb-3">
-        <PageTitle>Edit Dish</PageTitle>
-        <OutlineLinkButton href={routes.dish.index()}>
-          <ChevronLeftIcon className="w-5 h-5 mr-1" />
-          <p className="text-sm">BACK</p>
-        </OutlineLinkButton>
-      </div>
-
-      <EditDishForm dish={dish} />
-
-      <Hr className="mt-8" />
-
-      <SyncUsersForm dish={dish} reloadDish={loadDish} />
-    </div>
-  );
-}

frontend-old/app/routes/dishes.create.tsx

@@ -1,13 +0,0 @@
-import type { Route } from "./+types/dishes.create";
-import CreateDishForm from "~/components/features/dishes/CreateDishForm";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Create Dish" },
-    { name: "description", content: "Create a new dish" },
-  ];
-}
-
-export default function CreateDishPage() {
-  return <CreateDishForm />;
-}

frontend-old/app/routes/dishes.tsx

@@ -1,64 +0,0 @@
-import type { Route } from "./+types/dishes";
-import PageTitle from "~/components/ui/PageTitle";
-import { DishType } from "~/types/DishType";
-import Dish from "~/components/features/dishes/Dish";
-import { PlusIcon } from "@heroicons/react/24/solid";
-import { useEffect, useState } from "react";
-import useRoutes from "~/hooks/useRoutes";
-import { listDishes } from "~/utils/api/dishApi";
-import Button from "~/components/ui/Button";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Dishes" },
-    { name: "description", content: "Manage your dishes" },
-  ];
-}
-
-export default function DishesIndexPage() {
-  const routes = useRoutes();
-
-  const [dishes, setDishes] = useState<DishType[]>([]);
-  const [loading, setLoading] = useState(true);
-
-  useEffect(() => {
-    listDishes()
-      .then((dishes: DishType[]) => setDishes(dishes))
-      .finally(() => setLoading(false));
-  }, []);
-
-  if (loading) return <p>Loading...</p>;
-
-  if (!dishes) {
-    return <h1>Loading...</h1>;
-  }
-
-  return (
-    <>
-      <div className="flex mb-3">
-        <div className="flex-none mr-4 pt-1">
-          <PageTitle>Dishes</PageTitle>
-        </div>
-        <div className="flex-grow flex justify-end">
-          <Button
-            href={routes.dish.create()}
-            icon={<PlusIcon />}
-            size="small"
-            variant="primary"
-            appearance="text"
-          >
-            Add Dish
-          </Button>
-        </div>
-      </div>
-
-      {dishes.length === 0 ? (
-        <h1 className="text-secondary">No dishes found :(</h1>
-      ) : (
-        dishes.map((dish: DishType, index: number) => (
-          <Dish key={index} dish={dish} />
-        ))
-      )}
-    </>
-  );
-}

frontend-old/app/routes/home.tsx

@@ -1,13 +0,0 @@
-import type { Route } from "./+types/home";
-import UpcomingDishes from "~/components/features/schedule/UpcomingDishes";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Schedule" },
-    { name: "description", content: "View and manage your upcoming dish schedule" },
-  ];
-}
-
-export default function Home() {
-  return <UpcomingDishes />;
-}

frontend-old/app/routes/schedule.$date.edit.tsx

@@ -1,19 +0,0 @@
-import type { Route } from "./+types/schedule.$date.edit";
-import ScheduleEditForm from "~/components/features/schedule/ScheduleEditForm";
-import { useParams } from "react-router";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Edit Schedule" },
-    { name: "description", content: "Edit schedule for a specific date" },
-  ];
-}
-
-const ScheduleEditPage = () => {
-  const params = useParams();
-  const date = params.date as string;
-
-  return <ScheduleEditForm date={date} />;
-};
-
-export default ScheduleEditPage;

frontend-old/app/routes/scheduled-user-dishes.history.tsx

@@ -1,13 +0,0 @@
-import type { Route } from "./+types/scheduled-user-dishes.history";
-import HistoricalDishes from "~/components/features/schedule/HistoricalDishes";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - History" },
-    { name: "description", content: "View historical dishes" },
-  ];
-}
-
-export default function HistoryPage() {
-  return <HistoricalDishes />;
-}

frontend-old/app/routes/users.$id.edit.tsx

@@ -1,32 +0,0 @@
-import type { Route } from "./+types/users.$id.edit";
-import { useEffect, useState } from "react";
-import { UserType } from "~/types/UserType";
-import { showUser } from "~/utils/api/usersApi";
-import Spinner from "~/components/Spinner";
-import EditUserForm from "~/components/features/users/EditUserForm";
-import { useParams } from "react-router";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Edit User" },
-    { name: "description", content: "Edit user details" },
-  ];
-}
-
-const UpdateUsersPage = () => {
-  const params = useParams();
-  const id = Number(params.id);
-  const [user, setUser] = useState<UserType | null>(null);
-
-  useEffect(() => {
-    showUser(id).then((user: UserType) => setUser(user));
-  }, [id]);
-
-  if (!user) {
-    return <Spinner />;
-  }
-
-  return <EditUserForm user={user} />;
-};
-
-export default UpdateUsersPage;

frontend-old/app/routes/users.create.tsx

@@ -1,74 +0,0 @@
-import type { Route } from "./+types/users.create";
-import PageTitle from "~/components/ui/PageTitle";
-import useRoutes from "~/hooks/useRoutes";
-import { useNavigate } from "react-router";
-import { useState } from "react";
-import Alert from "~/components/ui/Alert";
-import { createUser } from "~/utils/api/usersApi";
-import { Link } from "react-router";
-import SolidButton from "~/components/ui/Buttons/SolidButton";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Create User" },
-    { name: "description", content: "Create a new user" },
-  ];
-}
-
-const CreateUsersPage = () => {
-  const [name, setName] = useState<string>("");
-  const [error, setError] = useState<string>("");
-  const navigate = useNavigate();
-  const routes = useRoutes();
-
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
-    e.preventDefault();
-
-    if (!name.trim()) {
-      setError("Name cannot be empty.");
-      return;
-    }
-
-    createUser(name).then(() => {
-      navigate(routes.user.index());
-    });
-  };
-
-  return (
-    <div className="w-full flex flex-col items-center">
-      <PageTitle>Create User</PageTitle>
-      <Link to={routes.user.index()} className="py-2 mr-auto">
-        Back to users
-      </Link>
-
-      <form
-        onSubmit={handleSubmit}
-        className="w-full max-w-sm mt-4 border-secondary border-2 rounded p-4"
-      >
-        {error != "" && (
-          <Alert type="error" className="mt-4">
-            {error}
-          </Alert>
-        )}
-
-        <label htmlFor="name">Name</label>
-        <input
-          type="text"
-          placeholder=""
-          name="name"
-          id="name"
-          autoFocus={true}
-          value={name}
-          onChange={(e) => setName(e.target.value)}
-          className="w-full p-2 border rounded bg-primary border-secondary bg-gray-600 text-secondary"
-        />
-
-        <SolidButton type="submit" className="mt-4">
-          Create
-        </SolidButton>
-      </form>
-    </div>
-  );
-};
-
-export default CreateUsersPage;

frontend-old/app/routes/users.tsx

@@ -1,77 +0,0 @@
-import type { Route } from "./+types/users";
-import PageTitle from "~/components/ui/PageTitle";
-import { useFetchUsers } from "~/hooks/useFetchUsers";
-import Spinner from "~/components/Spinner";
-import useRoutes from "~/hooks/useRoutes";
-import { Link } from "react-router";
-import { PencilIcon, PlusIcon, TrashIcon } from "@heroicons/react/24/solid";
-import React from "react";
-import { deleteUser } from "~/utils/api/usersApi";
-import { UserType } from "~/types/UserType";
-import Card from "~/components/layout/Card";
-import OutlineLinkButton from "~/components/ui/Buttons/OutlineLinkButton";
-
-export function meta({}: Route.MetaArgs) {
-  return [
-    { title: "Dish Planner - Users" },
-    { name: "description", content: "Manage your users" },
-  ];
-}
-
-const UsersPage = () => {
-  const { users, isLoading } = useFetchUsers();
-  const routes = useRoutes();
-
-  const handleDelete = (user: UserType) => {
-    deleteUser(user).then(() => window.location.reload());
-  };
-
-  if (isLoading) {
-    return <Spinner />;
-  }
-
-  const usersList = () => {
-    return users.map((user) => (
-      <Card key={user.id}>
-        <div className="flex-grow text-xl font-bold pt-1">{user.name}</div>
-        <div className="flex-none flex gap-2">
-          <div className="flex-none w-8">
-            <Link to={routes.user.edit(user)}>
-              <div className="border border-foreground p-2 rounded">
-                <PencilIcon width="14" />
-              </div>
-            </Link>
-          </div>
-          <div className="flex-none w-8">
-            <Link to="#" onClick={() => handleDelete(user)}>
-              <div className="border border-red-500 p-2 rounded">
-                <TrashIcon width="14" className="text-red-500" />
-              </div>
-            </Link>
-          </div>
-        </div>
-      </Card>
-    ));
-  };
-
-  return (
-    <div className="w-full">
-      <div className="flex w-full">
-        <div className="w-1/2 flex-none pt-2">
-          <PageTitle>Users</PageTitle>
-        </div>
-
-        <div className="flex-grow flex justify-end">
-          <OutlineLinkButton href={routes.user.create()} variant="primary">
-            <PlusIcon className="w-4 h-4 mt-1 mr-1" />
-            <p>Add User</p>
-          </OutlineLinkButton>
-        </div>
-      </div>
-
-      {users && users.length > 0 ? usersList() : <div>No users</div>}
-    </div>
-  );
-};
-
-export default UsersPage;

frontend-old/app/styles/base/globals.css

@@ -1,19 +0,0 @@
-html, body {
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  overflow-x: hidden;
-}
-
-body {
-  font-family: Arial, Helvetica, sans-serif;
-}
-
-
-.toggle-input:checked {
-  background-color: #22c55e; /* bg-green-500 */
-}
-
-.toggle-input:checked ~ span:last-child {
-  --tw-translate-x: 1.75rem; /* translate-x-7 */
-}

frontend-old/app/styles/components/buttons.css

@@ -1,42 +0,0 @@
-.button-primary-solid {
-    background-color: var(--color-primary);
-    color: var(--color-secondary-200);
-    border: 1px solid var(--color-primary);
-    text-transform: uppercase;
-    font-family: "Anta", serif;
-    font-style: normal;
-    font-size: 1.1rem;
-    font-weight: 600;
-    padding: 4px 16px 2px 16px;
-}
-.button-primary-outline {
-    background-color: var(--color-background);
-    color: var(--color-primary);
-    border: 1px solid var(--color-primary);
-    text-transform: uppercase;
-    font-family: "Anta", serif;
-    font-style: normal;
-    font-size: 1.1rem;
-    font-weight: 600;
-    padding: 4px 16px 2px 16px;
-}
-
-.button-secondary-solid {
-    background-color: var(--color-secondary);
-    color: var(--color-primary);
-    border: 1px solid var(--color-secondary);
-}
-
-.button-accent-solid {
-    background-color: var(--color-accent-blue);
-    color: var(--color-secondary-900);
-    border: 1px solid var(--color-accent-blue);
-}
-.button-accent-outline {
-    background-color: var(--color-background);
-    color: var(--color-accent-blue);
-    border: 1px solid var(--color-accent-blue);
-}
-.button-accent-outline:hover {
-    background-color: var(--color-background-400);
-}

frontend-old/app/styles/main.css

@@ -1,6 +0,0 @@
-@import "./theme/borders.css";
-@import "./theme/fonts.css";
-@import "./components/buttons.css";
-
-@import "./base/globals.css";
-@import "./theme/colors.css";

frontend-old/app/styles/theme/borders.css

@@ -1,14 +0,0 @@
-.border-primary {
-    border-color: var(--color-primary);
-}
-
-.border-secondary {
-    border-color: var(--color-secondary);
-}
-
-.border-accent-blue {
-    border-color: var(--color-accent-blue);
-}
-.border-accent-800 {
-    border-color: var(--color-accent-blue-800);
-}

frontend-old/app/styles/theme/colors.css

@@ -1,10 +0,0 @@
-@import './colors/root.css';
-@import './colors/background.css';
-@import './colors/border.css';
-@import './colors/text.css';
-
-body {
-    color: var(--color-secondary) !important;
-    background: var(--color-gray-600) !important;
-}
-

frontend-old/app/styles/theme/colors/background.css

@@ -1,226 +0,0 @@
-.bg-gray-100 {
-    background-color: var(--color-gray-100) !important;
-}
-.bg-gray-200 {
-    background-color: var(--color-gray-200) !important;
-}
-.bg-gray-300 {
-    background-color: var(--color-gray-300) !important;
-}
-.bg-gray-400 {
-    background-color: var(--color-gray-400) !important;
-}
-.bg-gray-500 {
-    background-color: var(--color-gray-500) !important;
-}
-.bg-gray-600 {
-    background-color: var(--color-gray-600) !important;
-}
-.bg-gray-700 {
-    background-color: var(--color-gray-700) !important;
-}
-.bg-gray-800 {
-    background-color: var(--color-gray-800) !important;
-}
-.bg-gray-900 {
-    background-color: var(--color-gray-900) !important;
-}
-
-
-.bg-primary {
-    background-color: var(--color-primary) !important;
-}
-
-
-.bg-accent-blue {
-    background-color: var(--color-accent-blue-500) !important;
-}
-.bg-accent-blue-100 {
-    background-color: var(--color-accent-blue-100) !important;
-}
-.bg-accent-blue-200 {
-    background-color: var(--color-accent-blue-200) !important;
-}
-.bg-accent-blue-300 {
-    background-color: var(--color-accent-blue-300) !important;
-}
-.bg-accent-blue-400 {
-    background-color: var(--color-accent-blue-400) !important;
-}
-.bg-accent-blue-500 {
-    background-color: var(--color-accent-blue-500) !important;
-}
-.bg-accent-blue-600 {
-    background-color: var(--color-accent-blue-600) !important;
-}
-.bg-accent-blue-700 {
-    background-color: var(--color-accent-blue-700) !important;
-}
-.bg-accent-blue-800 {
-    background-color: var(--color-accent-blue-800) !important;
-}
-.bg-accent-blue-900 {
-    background-color: var(--color-accent-blue-900) !important;
-}
-
-
-.bg-accent-yellow {
-    background-color: var(--color-accent-yellow) !important;
-}
-
-.bg-accent-yellow-100 {
-    background-color: var(--color-accent-yellow-100) !important;
-}
-
-.bg-accent-yellow-200 {
-    background-color: var(--color-accent-yellow-200) !important;
-}
-
-.bg-accent-yellow-300 {
-    background-color: var(--color-accent-yellow-300) !important;
-}
-
-.bg-accent-yellow-400 {
-    background-color: var(--color-accent-yellow-400) !important;
-}
-
-.bg-accent-yellow-500 {
-    background-color: var(--color-accent-yellow-500) !important;
-}
-
-.bg-accent-yellow-600 {
-    background-color: var(--color-accent-yellow-600) !important;
-}
-
-.bg-accent-yellow-700 {
-    background-color: var(--color-accent-yellow-700) !important;
-}
-
-.bg-accent-yellow-800 {
-    background-color: var(--color-accent-yellow-800) !important;
-}
-
-.bg-accent-yellow-900 {
-    background-color: var(--color-accent-yellow-900) !important;
-}
-
-
-.bg-success {
-    background-color: var(--color-success) !important;
-}
-
-.bg-success-100 {
-    background-color: var(--color-success-100) !important;
-}
-
-.bg-success-200 {
-    background-color: var(--color-success-200) !important;
-}
-
-.bg-success-300 {
-    background-color: var(--color-success-300) !important;
-}
-
-.bg-success-400 {
-    background-color: var(--color-success-400) !important;
-}
-
-.bg-success-500 {
-    background-color: var(--color-success-500) !important;
-}
-
-.bg-success-600 {
-    background-color: var(--color-success-600) !important;
-}
-
-.bg-success-700 {
-    background-color: var(--color-success-700) !important;
-}
-
-.bg-success-800 {
-    background-color: var(--color-success-800) !important;
-}
-
-.bg-success-900 {
-    background-color: var(--color-success-900) !important;
-}
-
-.bg-warning {
-    background-color: var(--color-warning) !important;
-}
-
-.bg-warning-100 {
-    background-color: var(--color-warning-100) !important;
-}
-
-.bg-warning-200 {
-    background-color: var(--color-warning-200) !important;
-}
-
-.bg-warning-300 {
-    background-color: var(--color-warning-300) !important;
-}
-
-.bg-warning-400 {
-    background-color: var(--color-warning-400) !important;
-}
-
-.bg-warning-500 {
-    background-color: var(--color-warning-500) !important;
-}
-
-.bg-warning-600 {
-    background-color: var(--color-warning-600) !important;
-}
-
-.bg-warning-700 {
-    background-color: var(--color-warning-700) !important;
-}
-
-.bg-warning-800 {
-    background-color: var(--color-warning-800) !important;
-}
-
-.bg-warning-900 {
-    background-color: var(--color-warning-900) !important;
-}
-
-.bg-danger {
-    background-color: var(--color-danger) !important;
-}
-
-.bg-danger-100 {
-    background-color: var(--color-danger-100) !important;
-}
-
-.bg-danger-200 {
-    background-color: var(--color-danger-200) !important;
-}
-
-.bg-danger-300 {
-    background-color: var(--color-danger-300) !important;
-}
-
-.bg-danger-400 {
-    background-color: var(--color-danger-400) !important;
-}
-
-.bg-danger-500 {
-    background-color: var(--color-danger-500) !important;
-}
-
-.bg-danger-600 {
-    background-color: var(--color-danger-600) !important;
-}
-
-.bg-danger-700 {
-    background-color: var(--color-danger-700) !important;
-}
-
-.bg-danger-800 {
-    background-color: var(--color-danger-800) !important;
-}
-
-.bg-danger-900 {
-    background-color: var(--color-danger-900) !important;
-}