Merge pull request #28 from Gimanh/fix/issues

Fix/issues

README.md

@@ -5,6 +5,12 @@
 TaskView is a self-hosted project and task management platform focused on clarity, ownership, and control.
 TaskView is built for teams that want a transparent, self-hosted alternative to SaaS task managers.
 
+## Apps
+* [Docs](https://taskview.tech/docs/) 
+* [Web](https://app.taskview.tech/)  
+* [iOS](https://apps.apple.com/lk/app/taskview-todo-list-tasks/id6499107867)  
+* [Android](https://play.google.com/store/apps/details?id=com.handscreamgnl.taskview.app&hl=en)  
+
 It is designed for teams and individuals who want:  
 - full control over their data
 - transparent architecture
@@ -129,9 +135,9 @@ Make sure the image versions match the version defined in the root package.json.
 ## Roadmap
 
 - Plugin / extension system
-- Migrate to NuxtUI or similar ui library
+- [X] Migrate to NuxtUI or similar ui library
 - Enterprise SSO and identity integrations
-- Redesign
+- [X] Redesign
 - Desktop version
 
 

api/dev-containers-test/.env.taskview

@@ -16,6 +16,7 @@ SMTP_PASSWORD="smtp-password"
 SMTP_ENCRYPTION="ssl"
 SMTP_FROM_NAME="TaskViewApiServer"
 SMTP_FROM_EMAIL="smtp"
+CORS_ALLOWED_ORIGINS="http://localhost:5173,http://127.0.0.1:5173,http://localhost:3000,http://localhost:8888,http://127.0.0.1:3000,http://127.0.0.1:8888"
 
 # Constant value
 APP_URL="https://taskview.handscream.com"

api/dev-containers-test/docker-compose.yml

@@ -14,7 +14,7 @@ services:
       timeout: 5s
       retries: 5
   migration:
-    image: gimanhead/taskview-ce-db-migration:1.18.2
+    image: gimanhead/taskview-ce-db-migration:latest
     restart: "no"
     depends_on:
       db:
@@ -23,12 +23,12 @@ services:
       - ./.env.taskview
 
   taskview-ce-webapp:
-    image: gimanhead/taskview-ce-webapp:1.18.2
+    image: gimanhead/taskview-ce-webapp:latest
     restart: "no"
     ports:
       - "8888:80"
   taskview-api-server:
-    image: gimanhead/taskview-ce-api-server:1.18.2
+    image: gimanhead/taskview-ce-api-server:latest
     restart: "no"
     ports:
       - "1725:1401"

api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "taskview-ce-api-server",
-  "version": "1.17.0",
+  "version": "1.20.7",
   "scripts": {
     "dev": "bun run --watch ./server.ts",
     "start": "NODE_ENV=production node ./dist/taskview-server.js",
@@ -24,6 +24,7 @@
     "@types/express": "^4.17.21",
     "@types/jsonwebtoken": "^9.0.7",
     "@types/node": "^22.10.3",
+    "@types/passport-apple": "^2.0.3",
     "@types/pg": "^8.15.5",
     "@types/semver": "^7.5.8",
     "aws-sdk": "^2.1691.0",
@@ -56,6 +57,7 @@
     "helmet": "^7.1.0",
     "jsonwebtoken": "^9.0.2",
     "passport": "^0.7.0",
+    "passport-apple": "^2.0.2",
     "passport-github2": "^0.1.12",
     "passport-google-oauth20": "^2.0.0",
     "pg": "^8.16.3",
@@ -69,4 +71,4 @@
   "engines": {
     "node": ">=24 <25"
   }
-}
+}

api/src/App.ts

@@ -14,7 +14,9 @@ const allow = new Set([
         "https://taskview.handscream.com",
         "capacitor://taskview.handscream.com",
         "capacitor://app.taskview.tech",
+        "https://appleid.apple.com"
     ]),
+    ...(process.env.CORS_ALLOWED_ORIGINS?.split(',') || []),
 ]);
 
 export default class App {

api/src/migrations/taskview/migrate.json

@@ -294,5 +294,16 @@
         "description": [
             "Release 1.18.2"
         ]
+    },
+    "23": {
+        "version": "1.20.0",
+        "name": "Release 1.20.0",
+        "releaseDate": "20260221",
+        "scripts": [
+            "/1.20.0/all-triggers.sql"
+        ],
+        "description": [
+            "Validate tag and task belong to the same project on insert into tasks_to_tags"
+        ]
     }
 }

api/src/migrations/taskview/sql/1.20.0/all-triggers.sql

@@ -0,0 +1,585 @@
+--1.
+--Trigger set previous version
+create or replace function app.trigger_set_previous_version()
+    returns trigger as
+$date_complete$
+begin
+    new.prev_version = old.version;
+    return new;
+end;
+$date_complete$
+    language plpgsql;
+
+drop trigger if exists trigger_set_previous_version on app.version;
+create trigger trigger_set_previous_version
+    before insert
+    on app.version
+    for each row
+execute procedure app.trigger_set_previous_version();
+
+--2.
+--Trigger for adding owner for taskList from goal
+create or replace function tasks.trigger_set_owner_for_component()
+    returns trigger as
+$date_complete$
+begin
+    new.owner = (select owner from tasks.goals where id = new.goal_id);
+    return new;
+end;
+$date_complete$
+    language plpgsql;
+
+drop trigger if exists trigger_set_owner_for_component on tasks.goal_lists;
+create trigger trigger_set_owner_for_component
+    before insert
+    on tasks.goal_lists
+    for each row
+execute procedure tasks.trigger_set_owner_for_component();
+
+--3.
+--Trigger for updating date_complete for task
+create or replace function tasks.update_date_complete()
+    returns trigger as
+$date_complete$
+begin
+    if new.complete != old.complete
+    then
+        if new.complete = true
+        then
+            update tasks.tasks set date_complete = now() where id = old.id;
+        else
+            update tasks.tasks set date_complete = null where id = old.id;
+        end if;
+    end if;
+    return new;
+end;
+$date_complete$
+    language plpgsql;
+
+drop trigger if exists tr_update_date_complete on tasks.tasks;
+create trigger tr_update_date_complete
+    after update
+    on tasks.tasks
+    for each row
+execute procedure tasks.update_date_complete();
+
+--4.
+-- Delete user from collaboration if not assigned to any goal
+create or replace function collaboration.delete_user_if_not_assigned_to_goal()
+returns trigger as $$
+declare
+    count int;
+begin
+    if not exists (
+        select 1
+        from collaboration.users_to_goals
+        where user_id = old.user_id
+        limit 1
+    ) then
+        delete from collaboration.users where id = old.user_id;
+    end if;
+
+    return old;
+end;
+$$ language plpgsql;
+
+drop trigger if exists trigger_delete_user_if_not_assigned_to_goal on collaboration.users_to_goals;
+create trigger trigger_delete_user_if_not_assigned_to_goal 
+    after delete 
+    on collaboration.users_to_goals 
+    for each row 
+execute function collaboration.delete_user_if_not_assigned_to_goal();
+
+--5.
+--Trigger for checking task graph relation goal to avoid connection between tasks from different goals
+create or replace function tasks.check_task_graph_relation_goal()
+returns trigger as $$
+declare
+    from_goal int;
+    to_goal   int;
+begin
+    select goal_id into from_goal from tasks.tasks where id = new.from_task_id;
+    select goal_id into to_goal   from tasks.tasks where id = new.to_task_id;
+
+    if from_goal is null or to_goal is null then
+        raise exception 'Invalid task reference in relation';
+    end if;
+
+    if from_goal <> to_goal then
+        raise exception 'Relation goal_id must match both tasks'' goal_id';
+    end if;
+
+    new.goal_id := from_goal;
+
+    return new;
+end;
+$$ language plpgsql;
+
+drop trigger if exists trigger_task_relation_goal on tasks.task_relations;
+create trigger trigger_task_relation_goal
+before insert or update on tasks.task_relations
+for each row execute function tasks.check_task_graph_relation_goal();
+
+--6.
+--Trigger for logging changes in taskList to history table
+create or replace function tasks.log_changes_tasks_goal_lists()
+    returns trigger as
+$body$
+begin
+    if tg_op = 'DELETE' then
+        insert into history.tasks_goal_lists (goal_list_id, edit_date, task, deleted) values (old.id, now(), to_jsonb(old), 1);
+        return old;
+    elseif tg_op = 'UPDATE' then
+        insert into history.tasks_goal_lists (goal_list_id, edit_date, task, deleted)
+        VALUES (old.id, new.date_creation, to_jsonb(old), 0);
+        new.edit_date = now();
+        return new;
+    end if;
+end
+$body$
+    language plpgsql;
+
+drop trigger if exists trigger_log_changes_tasks_goal_lists on tasks.goal_lists;
+create trigger trigger_log_changes_tasks_goal_lists
+    before update or delete
+    on tasks.goal_lists
+    for each row
+execute procedure tasks.log_changes_tasks_goal_lists();
+
+--7.
+--Trigger for logging changes in goal to history table
+create or replace function tasks.log_changes_tasks_goals()
+    returns trigger as
+$body$
+begin
+    if tg_op = 'DELETE' then
+        insert into history.tasks_goals (goal_id, edit_date, task, deleted) values (old.id, now(), to_jsonb(old), 1);
+        return old;
+    elseif tg_op = 'UPDATE' then
+        insert into history.tasks_goals (goal_id, edit_date, task, deleted)
+        VALUES (old.id, new.date_creation, to_jsonb(old), 0);
+        new.edit_date = now();
+        return new;
+    end if;
+end
+$body$
+    language plpgsql;
+
+drop trigger if exists trigger_log_changes_tasks_goals on tasks.goals;
+create trigger trigger_log_changes_tasks_goals
+    before update or delete
+    on tasks.goals
+    for each row
+execute procedure tasks.log_changes_tasks_goals();
+
+--8.
+--Trigger for logging changes in task to history table
+create or replace function tasks.log_changes_tasks_tasks()
+    returns trigger as
+$body$
+begin
+    if tg_op = 'DELETE' then
+        insert into history.tasks_tasks (task_id, edit_date, task, deleted) values (old.id, now(), to_jsonb(old), 1);
+        return old;
+    elseif tg_op = 'UPDATE' then
+        insert into history.tasks_tasks (task_id, edit_date, task, deleted)
+        VALUES (old.id, new.date_creation, to_jsonb(old), 0);
+        new.edit_date = now();
+        return new;
+    end if;
+end
+$body$
+    language plpgsql;
+
+drop trigger if exists trigger_log_changes_tasks_tasks on tasks.tasks;
+create trigger trigger_log_changes_tasks_tasks
+    before update or delete
+    on tasks.tasks
+    for each row
+execute procedure tasks.log_changes_tasks_tasks();
+
+--9.
+--Trigger for setting goal_id default for task
+CREATE OR REPLACE FUNCTION tasks.set_goal_id_default_for_task()
+    RETURNS TRIGGER AS
+$$
+DECLARE
+    goal_id INT;
+BEGIN
+    
+    SELECT gl.goal_id
+    INTO goal_id
+    FROM tasks.goal_lists gl
+    WHERE gl.id = NEW.goal_list_id;
+
+    IF goal_id IS NOT NULL THEN
+        NEW.goal_id := goal_id;
+    END IF;
+
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+drop trigger if exists before_insert_set_goal_id_for_task on tasks.tasks;
+
+CREATE TRIGGER before_insert_set_goal_id_for_task
+    BEFORE INSERT OR UPDATE
+    ON tasks.tasks
+    FOR EACH ROW
+EXECUTE FUNCTION tasks.set_goal_id_default_for_task();
+
+
+--10.
+--Trigger for adding default roles and permissions for goal
+CREATE OR REPLACE FUNCTION tasks.add_roles_and_permissions()
+    RETURNS TRIGGER AS
+$$
+DECLARE
+    editor_role_id  INTEGER;
+    executor_role_id INTEGER;
+BEGIN
+    -- 1. Create role "editor"
+    INSERT INTO collaboration.roles (name, goal_id)
+    VALUES ('editor', NEW.id)
+    RETURNING id INTO editor_role_id;
+
+    -- 2. Create role "executor"
+    INSERT INTO collaboration.roles (name, goal_id)
+    VALUES ('executor', NEW.id)
+    RETURNING id INTO executor_role_id;
+
+    -- 3. Add permissions for role "editor"
+    INSERT INTO collaboration.permissions_to_role (role_id, permission_id)
+    SELECT editor_role_id, id
+    FROM tv_auth.permissions
+    WHERE name IN (
+                   'goal_can_watch_content',
+                   'goal_can_edit',
+                   'goal_can_add_task_list',
+                   'goal_can_manage_users',
+                   'component_can_watch_content',
+                   'component_can_edit',
+                   'component_can_delete',
+                   'component_can_add_tasks',
+                   'task_can_edit_deadline',
+                   'task_can_watch_subtasks',
+                   'task_can_watch_note',
+                   'task_can_recovery_history',
+                   'task_can_watch_assigned_users',
+                   'task_can_edit_priority',
+                   'task_can_delete',
+                   'task_can_watch_details',
+                   'task_can_assign_users',
+                   'task_can_add_subtasks',
+                   'task_can_watch_tags',
+                   'task_can_watch_priority',
+                   'task_can_access_history',
+                   'task_can_edit_tags',
+                   'task_can_edit_description',
+                   'task_can_edit_status',
+                   'task_can_edit_note',
+                   'kanban_can_manage',
+                   'kanban_can_view',
+                   'graph_can_manage',
+                   'graph_can_view'
+        );
+
+    -- 4. Add permissions for role "viewver"
+    INSERT INTO collaboration.permissions_to_role (role_id, permission_id)
+    SELECT executor_role_id, id
+    FROM tv_auth.permissions
+    WHERE name IN (
+                   'goal_can_watch_content',
+                   'component_can_watch_content',
+                   'component_can_add_tasks',
+                   'task_can_watch_subtasks',
+                   'task_can_watch_note',
+                   'task_can_watch_assigned_users',
+                   'task_can_watch_details',
+                   'task_can_add_subtasks',
+                   'task_can_watch_tags',
+                   'task_can_watch_priority'
+        );
+
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+
+drop trigger if exists add_roles_after_insert on tasks.goals;
+
+CREATE TRIGGER add_roles_after_insert
+    AFTER INSERT
+    ON tasks.goals 
+    FOR EACH ROW
+EXECUTE FUNCTION tasks.add_roles_and_permissions();
+
+
+--11.
+--Trigger for adjusting start and end dates for task
+CREATE OR REPLACE FUNCTION tasks.adjust_start_and_end_dates()
+    RETURNS TRIGGER AS
+$$
+DECLARE
+    start_timestamp TIMESTAMPTZ;
+    end_timestamp   TIMESTAMPTZ;
+BEGIN
+    -- If start_date is NULL, then start_time should be NULL
+    IF NEW.start_date IS NULL THEN
+        NEW.start_time := NULL;
+    END IF;
+
+    -- If end_date is NULL, then end_time should be NULL
+    IF NEW.end_date IS NULL THEN
+        NEW.end_time := NULL;
+    END IF;
+
+    -- If both dates are set
+    IF NEW.start_date IS NOT NULL AND NEW.end_date IS NOT NULL THEN
+        -- Adjust dates
+        IF NEW.start_date > NEW.end_date THEN
+            -- If start_date is greater than end_date, set end_date to start_date
+            NEW.end_date := NEW.start_date;
+            -- end_time remains unchanged
+        ELSIF NEW.end_date < NEW.start_date THEN
+            -- If end_date is less than start_date, set start_date to end_date
+            NEW.start_date := NEW.end_date;
+            -- start_time remains unchanged
+        END IF;
+
+        -- Prepare timestamps for comparison
+        start_timestamp := (NEW.start_date::text || ' ' || COALESCE(NEW.start_time::text, '00:00:00+00'))::timestamptz;
+        end_timestamp := (NEW.end_date::text || ' ' || COALESCE(NEW.end_time::text, '00:00:00+00'))::timestamptz;
+
+        -- If start_timestamp is greater than end_timestamp, adjust end_date and end_time
+        IF start_timestamp > end_timestamp THEN
+            NEW.end_date := NEW.start_date;
+            -- Assign end_time only if start_time is not NULL
+            IF NEW.start_time IS NOT NULL AND NEW.end_time IS NOT NULL THEN
+                NEW.end_time := NEW.start_time;
+            END IF;
+        END IF;
+    END IF;
+
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+
+drop trigger if exists adjust_dates_and_times_trigger on tasks.tasks;
+CREATE TRIGGER adjust_dates_and_times_trigger
+    BEFORE INSERT OR UPDATE
+    ON tasks.tasks
+    FOR EACH ROW
+EXECUTE FUNCTION tasks.adjust_start_and_end_dates();
+
+--12.
+--Trigger for adding self/owner to collaboration table to be able to assign tasks to self
+create or replace function tasks.add_self_to_collaboration()
+returns trigger as $$
+DECLARE
+    owner_email TEXT;
+BEGIN
+
+    select email into owner_email
+    from tv_auth.users
+    where id = NEW.owner;
+
+    if owner_email is not null then
+        insert into collaboration.users (email) values (owner_email) ON CONFLICT (email) DO NOTHING;
+        insert into collaboration.users_to_goals (goal_id, user_id) values (NEW.id, (select id from collaboration.users where email = owner_email));
+    end if;
+
+    return NEW;
+END;
+$$ language plpgsql;
+
+drop trigger if exists add_selt_to_collaboration_trg on tasks.goals;
+
+create trigger add_selt_to_collaboration_trg
+    after insert on tasks.goals
+    for each row
+    execute function tasks.add_self_to_collaboration();
+
+--13.
+--Trigger for adding default kanban columns for new goal
+CREATE OR REPLACE FUNCTION tasks.kanban_add_default_columns()
+RETURNS TRIGGER AS $$
+BEGIN
+    -- Add default columns for new goal
+    INSERT INTO tasks.statuses (name, goal_id, view_order)
+    VALUES 
+        ('TODO', NEW.id, 1),
+        ('In Progress', NEW.id, 2),
+        ('Done', NEW.id, 3);
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+DROP TRIGGER IF EXISTS kanban_add_default_columns_trg ON tasks.goals;
+
+CREATE TRIGGER kanban_add_default_columns_trg
+AFTER INSERT ON tasks.goals
+FOR EACH ROW
+EXECUTE FUNCTION tasks.kanban_add_default_columns();
+
+--14.
+--Trigger for validating the correct statusId for the inserted value. To avoid assigning a status that does not belong to the goal.
+CREATE OR REPLACE FUNCTION tasks.check_task_status_goal()
+RETURNS TRIGGER AS $$
+BEGIN
+    -- Check if there is a record in tasks.statuses with the same goal_id
+    IF NOT EXISTS (
+        SELECT 1 FROM tasks.statuses s 
+        WHERE s.id = NEW.status_id AND s.goal_id = NEW.goal_id
+    ) THEN
+        RAISE EXCEPTION 'Status ID % is not valid for goal ID %', NEW.status_id, NEW.goal_id;
+    END IF;
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+drop trigger if exists enforce_task_status_goal on tasks.tasks;
+
+CREATE TRIGGER enforce_task_status_goal
+BEFORE INSERT OR UPDATE ON tasks.tasks
+FOR EACH ROW
+WHEN (NEW.status_id IS NOT NULL)
+EXECUTE FUNCTION tasks.check_task_status_goal();
+
+--15.
+--Trigger for setting default orders value for task
+CREATE OR REPLACE FUNCTION tasks.set_order_value()
+RETURNS TRIGGER AS $$
+BEGIN
+    IF NEW.task_order IS NULL THEN
+        NEW.task_order := NEW.id;
+    END IF;
+    IF NEW.kanban_order IS NULL THEN
+        NEW.kanban_order := NEW.id;
+    END IF;
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+drop trigger if exists set_order_trigger on tasks.tasks;
+CREATE TRIGGER set_order_trigger
+BEFORE INSERT ON tasks.tasks
+FOR EACH ROW
+EXECUTE FUNCTION tasks.set_order_value();
+
+--16.
+--Trigger for setting default view order for new status
+CREATE OR REPLACE FUNCTION tasks.status_set_default_view_order()
+RETURNS TRIGGER AS $$
+DECLARE
+    new_view_order INT;
+BEGIN
+    -- Determine the next view_order for the given goal_id
+    SELECT COALESCE(MAX(view_order), 0) + 1 INTO new_view_order
+    FROM tasks.statuses
+    WHERE goal_id = NEW.goal_id;
+
+    -- Assign the calculated value to the view_order field
+    NEW.view_order := new_view_order;
+
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+drop trigger if exists set_default_status_view_order on tasks.statuses;
+
+CREATE TRIGGER set_default_status_view_order
+BEFORE INSERT ON tasks.statuses
+FOR EACH ROW
+EXECUTE FUNCTION tasks.status_set_default_view_order();
+
+--17.
+--Trigger for validating the correct user_id for the inserted value. To avoid assigning a user that does not belong to the goal.
+CREATE OR REPLACE FUNCTION tasks_auth.control_user_id_is_from_same_goal_as_task()
+RETURNS TRIGGER AS $$
+DECLARE
+    user_exists BOOLEAN;
+BEGIN
+    SELECT EXISTS (
+        SELECT 1 
+        FROM tasks.tasks tt    
+        LEFT JOIN collaboration.users_to_goals utg ON utg.goal_id = tt.goal_id
+        WHERE tt.id = NEW.task_id AND utg.user_id = NEW.collab_user_id
+    ) INTO user_exists;
+
+    IF NOT user_exists THEN
+        RAISE EXCEPTION 'User % is not associated with the goal of task %', NEW.collab_user_id, NEW.task_id;
+    END IF;
+
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+drop trigger if exists trigger_control_user_id_is_from_same_goal_as_task on tasks_auth.task_assignee;
+
+CREATE TRIGGER trigger_control_user_id_is_from_same_goal_as_task
+BEFORE INSERT ON tasks_auth.task_assignee
+FOR EACH ROW
+EXECUTE FUNCTION tasks_auth.control_user_id_is_from_same_goal_as_task();
+
+--18.
+--Trigger for adding owner for task, extend owner from goal or taskList
+
+--delete old function with wrong name
+drop trigger if exists trigger_set_owner_for_task on tasks.tasks;
+drop function if exists tasks.trigger_set_owner_for_task();
+
+CREATE OR REPLACE FUNCTION tasks.fn_set_owner_for_task()
+RETURNS TRIGGER AS
+$body$
+BEGIN
+    NEW.owner := COALESCE(
+        (SELECT owner FROM tasks.goal_lists WHERE id = NEW.goal_list_id),
+        (SELECT owner FROM tasks.goals WHERE id = NEW.goal_id)
+    );
+    
+    IF NEW.owner IS NULL THEN
+        RAISE EXCEPTION 'Can not insert task without owner';
+    END IF;
+
+    RETURN NEW;
+END;
+$body$
+LANGUAGE plpgsql;
+
+drop trigger if exists trigger_set_owner_for_task on tasks.tasks;
+create trigger trigger_set_owner_for_task
+    before insert
+    on tasks.tasks
+    for each row
+execute procedure tasks.fn_set_owner_for_task();
+
+--19.
+--Trigger for validating that tag and task belong to the same project (goal_id)
+drop trigger if exists trigger_check_tag_task_same_goal on tasks.tasks_to_tags;
+drop function if exists tasks.check_tag_task_same_goal();
+
+create or replace function tasks.check_tag_task_same_goal()
+returns trigger as $$
+declare
+    v_tag_goal_id integer;
+    v_task_goal_id integer;
+begin
+    select goal_id into v_tag_goal_id from tasks.tags where id = new.tag_id;
+    select goal_id into v_task_goal_id from tasks.tasks where id = new.task_id;
+
+    if v_tag_goal_id is null or v_tag_goal_id != v_task_goal_id then
+        raise exception 'Tag (id=%) and task (id=%) belong to different projects', new.tag_id, new.task_id;
+    end if;
+
+    return new;
+end;
+$$ language plpgsql;
+
+drop trigger if exists trigger_check_tag_task_same_goal on tasks.tasks_to_tags;
+create trigger trigger_check_tag_task_same_goal
+    before insert on tasks.tasks_to_tags
+    for each row
+execute function tasks.check_tag_task_same_goal();
+

api/src/tv-modules/auth/AuthController.ts

@@ -416,7 +416,7 @@ export default class AuthController {
             emailTemplate = EnEmailTemplate;
         }
 
-        const confirmUrl = `https://apitaskview.handscream.com/module/auth/confirm/email/${confirmEmailCode}/login/${login}`;
+        const confirmUrl = `https://${process.env.APP_URL}/module/auth/confirm/email/${confirmEmailCode}/login/${login}`;
 
         if (emailTemplate) {
             confirmEmailBody = emailTemplate.replace('{link}', confirmUrl);

api/src/tv-modules/auth/AuthRoutes.ts

@@ -48,5 +48,13 @@ export default class AuthRoutes implements Routable {
             })(req, res, next),
             this.authController.loginByProvider
         );
+
+        this.router.post(
+            '/provider/:providerName/callback',
+            (req: Request, res: Response, next: NextFunction) => passport.authenticate(req.params.providerName, {
+                scope: ExternalProviderScope[req.params.providerName], session: false
+            })(req, res, next),
+            this.authController.loginByProvider
+        );
     }
 }

api/src/tv-modules/auth/strategies/apple.strategy.ts

@@ -0,0 +1,50 @@
+import passport from "passport";
+import { Strategy as AppleStrategy } from "passport-apple";
+import jwt from "jsonwebtoken";
+import { $logger } from "../../../modules/logget";
+import type { ExternalAuthUser } from "./external-auth.types";
+
+interface AppleDecodedToken {
+    email?: string;
+    email_verified?: boolean | string;
+    sub?: string;
+}
+
+export function initAppleStrategy() {
+    if (!process.env.APPLE_CLIENT_ID ||
+        !process.env.APPLE_TEAM_ID ||
+        !process.env.APPLE_KEY_ID ||
+        !process.env.APPLE_CALLBACK_URL ||
+        !process.env.APPLE_KEY_LOCATION) {
+        $logger.warn("APPLE_CLIENT_ID, APPLE_TEAM_ID, APPLE_KEY_ID, APPLE_CALLBACK_URL, and APPLE_KEY_LOCATION must be set");
+        console.warn("APPLE_CLIENT_ID, APPLE_TEAM_ID, APPLE_KEY_ID, APPLE_CALLBACK_URL, and APPLE_KEY_LOCATION must be set");
+        return;
+    }
+
+    const options = {
+        clientID: process.env.APPLE_CLIENT_ID,
+        teamID: process.env.APPLE_TEAM_ID,
+        callbackURL: process.env.APPLE_CALLBACK_URL,
+        keyID: process.env.APPLE_KEY_ID,
+        privateKeyLocation: process.env.APPLE_KEY_LOCATION,
+        scope: ["name", "email"],
+        passReqToCallback: true as const,
+    };
+
+    passport.use(new AppleStrategy(options, async (_req, _accessToken, _refreshToken, idToken, _profile, done) => {
+        try {
+            const decoded = jwt.decode(idToken) as AppleDecodedToken | null;
+            const email = decoded?.email;
+            if (!email) return done(null, undefined);
+
+            const user: ExternalAuthUser = {
+                email,
+                provider: "apple",
+            };
+
+            done(null, user);
+        } catch (e) {
+            done(e instanceof Error ? e : new Error(String(e)));
+        }
+    }));
+}

api/src/tv-modules/auth/strategies/external-auth.types.ts

@@ -6,4 +6,5 @@ export type ExternalAuthUser = {
 export const ExternalProviderScope: Record<ExternalAuthUser['provider'], string[]> = {
     google: ["email"],
     github: ["user:email"],
+    apple: ["email"],
 }

api/src/tv-modules/auth/strategies/passport-login.ts

@@ -1,10 +1,12 @@
 import passport from "passport";
 import { initGoogleStrategy } from "./google.strategy";
 import { initGithubStrategy } from "./github.strategy";
+import { initAppleStrategy } from "./apple.strategy";
 
 export function initPassportLogin() {
     initGoogleStrategy();
     initGithubStrategy();
+    initAppleStrategy();
 }
 
 export default passport;

api/src/tv-modules/start/StartManager.ts

@@ -12,7 +12,7 @@ export class StartManager {
 
     constructor(user: AppUser) {
         this.user = user;
-        this.repository = new StartRepository();
+        this.repository = new StartRepository(this.user);
     }
 
     async fetchAllLists() {

api/src/tv-modules/start/StartRepository.ts

@@ -7,11 +7,14 @@ import type { TagToTaskInDb } from '../tags/tags.types';
 import { TaskItemForClient } from '../tasks/TaskItemForClient';
 import type { AssigneesForTaskFromDb, FetchAllListsResult, UsersByProjectsFromDb } from './start.types';
 
+//TODO: refactor 
 export class StartRepository {
     public readonly db: Database;
+    public readonly user: AppUser;
 
-    constructor() {
+    constructor(user: AppUser) {
         this.db = Database.getInstance();
+        this.user = user;
     }
 
     async fetchAllLists(user: AppUser): Promise<FetchAllListsResult[] | false> {
@@ -107,7 +110,7 @@ export class StartRepository {
 
     async fetchAllActiveTasksForGoals(
         goalsIds: number[],
-        assignees?: AssigneesForTaskFromDb[]
+        assignees?: AssigneesForTaskFromDb[],
     ): Promise<TaskItemForClient[]> {
         if (goalsIds.length === 0) {
             return [];
@@ -136,9 +139,9 @@ export class StartRepository {
         const tagsQuery = `select ttt.*
                             from tasks.tags
                                     left join tasks.tasks_to_tags ttt on tags.id = ttt.tag_id
-                            where owner = 1 and goal_id in (${placeholders.join(',')});`;
+                            where goal_id in (${placeholders.join(',')}) and owner = $${goalsIds.length + 1};`;
 
-        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, goalsIds);
+        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, [...goalsIds, this.user.getUserData()?.id]);
 
         if (tagsResult) {
             tagsResult.rows.forEach((r) => {
@@ -209,9 +212,9 @@ export class StartRepository {
         const tagsQuery = `select ttt.*
                             from tasks.tags
                                     left join tasks.tasks_to_tags ttt on tags.id = ttt.tag_id
-                            where owner = 1 and goal_id in (${placeholders.join(',')});`;
+                            where goal_id in (${placeholders.join(',')}) and owner = $${goalsIds.length + 1};`;
 
-        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, goalsIds);
+        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, [...goalsIds, this.user.getUserData()?.id]);
 
         if (tagsResult) {
             tagsResult.rows.forEach((r) => {
@@ -287,9 +290,9 @@ export class StartRepository {
         const tagsQuery = `select ttt.*
                             from tasks.tags
                                     left join tasks.tasks_to_tags ttt on tags.id = ttt.tag_id
-                            where owner = 1 and goal_id in (${placeholders.join(',')});`;
+                            where goal_id in (${placeholders.join(',')}) and owner = $${goalsIds.length + 1};`;
 
-        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, goalsIds);
+        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, [...goalsIds, this.user.getUserData()?.id]);
 
         if (tagsResult) {
             tagsResult.rows.forEach((r) => {
@@ -350,9 +353,9 @@ export class StartRepository {
         const tagsQuery = `select ttt.*
                             from tasks.tags
                                     left join tasks.tasks_to_tags ttt on tags.id = ttt.tag_id
-                            where owner = 1 and goal_id in (${placeholders.join(',')});`;
+                            where goal_id in (${placeholders.join(',')}) and owner = $${goalsIds.length + 1};`;
 
-        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, goalsIds);
+        const tagsResult = await this.db.query<TagToTaskInDb>(tagsQuery, [...goalsIds, this.user.getUserData()?.id]);
 
         if (tagsResult) {
             tagsResult.rows.forEach((r) => {

api/src/tv-modules/tags/TagsRepository.ts

@@ -1,6 +1,6 @@
 import { and, eq, inArray } from 'drizzle-orm';
 import type { TagsSchemaTypeForSelect } from 'taskview-db-schemas';
-import { GoalsSchema, TagsSchema, TasksToTagsSchema } from 'taskview-db-schemas';
+import { GoalsSchema, TagsSchema, TasksSchema, TasksToTagsSchema } from 'taskview-db-schemas';
 import type { AppUser } from '../../core/AppUser';
 import { Database } from '../../modules/db';
 import { GoalPermissions } from '../../types/auth.types';
@@ -171,6 +171,19 @@ export class TagsRepository {
     }
 
     async toggleTagNew(tagId: number, taskId: number): Promise<'delete' | 'add' | null> {
+        const [tag, task] = await Promise.all([
+            callWithCatch(() =>
+                this.db.dbDrizzle.select({ goalId: TagsSchema.goalId }).from(TagsSchema).where(eq(TagsSchema.id, tagId))
+            ),
+            callWithCatch(() =>
+                this.db.dbDrizzle.select({ goalId: TasksSchema.goalId }).from(TasksSchema).where(eq(TasksSchema.id, taskId))
+            ),
+        ])
+
+        if (!tag?.[0] || !task?.[0] || tag[0].goalId === null || tag[0].goalId !== task[0].goalId) {
+            return null
+        }
+
         const tagExists = await this.tagExists(tagId, taskId);
 
         if (tagExists) {

api/src/tv-modules/tasks/TasksRepository.ts

@@ -274,7 +274,7 @@ export class TasksRepository {
 
     async fetchSubtasks(taskId: number): Promise<TasksSchemaTypeForSelect[]> {
         const result = await callWithCatch(() =>
-            this.db.dbDrizzle.select().from(TasksSchema).where(eq(TasksSchema.parentId, taskId))
+            this.db.dbDrizzle.select().from(TasksSchema).where(eq(TasksSchema.parentId, taskId)).orderBy(asc(TasksSchema.id))
         );
 
         return result ?? [];
@@ -560,8 +560,10 @@ export class TasksRepository {
         }
 
         // complete
-        if (data.showCompleted === 0) conditions.push(eq(TasksSchema.complete, false));
-        else if (data.showCompleted === 1) conditions.push(eq(TasksSchema.complete, true));
+        if (!data.ignoreCompleted) {
+            if (data.showCompleted === 0) conditions.push(eq(TasksSchema.complete, false));
+            else if (data.showCompleted === 1) conditions.push(eq(TasksSchema.complete, true));
+        }
 
         // assignee filter — через EXISTS
         if (data.filters?.selectedUser) {
@@ -646,6 +648,7 @@ export class TasksRepository {
             eq(TasksSchema.goalId, goalId),
             columnId === null ? isNull(TasksSchema.statusId) : eq(TasksSchema.statusId, columnId),
             isNotNull(TasksSchema.kanbanOrder),
+            isNull(TasksSchema.parentId),
         ];
         if (cursor !== null) {
             conditions.push(gt(TasksSchema.kanbanOrder, cursor));

api/src/tv-modules/tasks/tasks.server.types.ts

@@ -12,7 +12,7 @@ export const TaskArkTypeUpdate = type({
     'parentId?': 'number|null',
     'description?': 'string',
     'complete?': 'boolean',
-    'goalListId?': 'number',
+    'goalListId?': 'number|null',
     // 'creatorId?': 'number',
     'note?': 'string',
     'priorityId?': '1|2|3|null',
@@ -23,7 +23,7 @@ export const TaskArkTypeUpdate = type({
     'statusId?': 'number|null',
     'taskOrder?': 'number',
     'kanbanOrder?': 'number',
-    'amount?': 'number|null',
+    'amount?': 'string|null',
     'transactionType?': '1|0|null',
     'nodeGraphPosition?': 'object|null',
 });
@@ -64,6 +64,7 @@ export const TaskArkTypeFetchTasksNew = type({
         })
         .pipe(TaskArkTypeFetchTasksNewFilters),
     'unlimited?': type('string').pipe((v) => v === 'true'),
+    'ignoreCompleted?': type('string').pipe((v) => v === 'true'),
 });
 
 export type TaskArgFetchTasksNew = typeof TaskArkTypeFetchTasksNew.infer;

package.json

@@ -1,42 +1,42 @@
 {
-    "name": "taskview-ce-monorepo",
-    "version": "1.19.6",
-    "private": true,
-    "description": "TaskView CE monorepo containing web, API, and packages",
-    "workspaces": [
-        "web",
-        "api",
-        "taskview-packages/*"
-    ],
-    "scripts": {
-        "dev:webapp": "cd web && pnpm dev",
-        "build:webapp": "cd web && pnpm build",
-        "build:webapp:dev": "cd web && pnpm build:dev",
-        "build:packages": "pnpm --filter=taskview-api --filter=taskview-db-schemas run build",
-        "dev:api": "cd api && pnpm dev",
-        "build:api": "cd api && pnpm build",
-        "install:all": "pnpm install",
-        "update:all": "pnpm update -r",
-        "clean": "pnpm store prune && rm -rf node_modules",
-        "lint": "pnpm -r run lint",
-        "test": "pnpm -r run test"
-    },
-    "devDependencies": {
-        "@types/node": "^18.19.119",
-        "typescript": "^5.7.3"
-    },
-    "engines": {
-        "node": ">=18.0.0",
-        "pnpm": ">=8.0.0"
-    },
-    "dependencies": {
-        "@types/passport": "^1.0.17",
-        "@types/passport-github2": "^1.2.9",
-        "@types/passport-google-oauth20": "^2.0.17",
-        "arktype": "2.1.20",
-        "drizzle-arktype": "0.1.3",
-        "passport": "^0.7.0",
-        "passport-github2": "^0.1.12",
-        "passport-google-oauth20": "^2.0.0"
-    }
-}
+  "name": "taskview-ce-monorepo",
+  "version": "1.20.7",
+  "private": true,
+  "description": "TaskView CE monorepo containing web, API, and packages",
+  "workspaces": [
+    "web",
+    "api",
+    "taskview-packages/*"
+  ],
+  "scripts": {
+    "dev:webapp": "cd web && pnpm dev",
+    "build:webapp": "cd web && pnpm build",
+    "build:webapp:dev": "cd web && pnpm build:dev",
+    "build:packages": "pnpm --filter=taskview-api --filter=taskview-db-schemas run build",
+    "dev:api": "cd api && pnpm dev",
+    "build:api": "cd api && pnpm build",
+    "install:all": "pnpm install",
+    "update:all": "pnpm update -r",
+    "clean": "pnpm store prune && rm -rf node_modules",
+    "lint": "pnpm -r run lint",
+    "test": "pnpm -r run test"
+  },
+  "devDependencies": {
+    "@types/node": "^18.19.119",
+    "typescript": "^5.7.3"
+  },
+  "engines": {
+    "node": ">=18.0.0",
+    "pnpm": ">=8.0.0"
+  },
+  "dependencies": {
+    "@types/passport": "^1.0.17",
+    "@types/passport-github2": "^1.2.9",
+    "@types/passport-google-oauth20": "^2.0.17",
+    "arktype": "2.1.20",
+    "drizzle-arktype": "0.1.3",
+    "passport": "^0.7.0",
+    "passport-github2": "^0.1.12",
+    "passport-google-oauth20": "^2.0.0"
+  }
+}

taskview-packages/taskview-api/README.md

@@ -1,59 +1,570 @@
 # TaskView API
 
-Библиотека для работы с TaskView API.
+TypeScript/JavaScript SDK for the [TaskView](https://taskview.tech) API. Provides a typed interface for managing goals, task lists, tasks, tags, kanban boards, team collaboration, and task dependencies.
 
-## Установка
+## Installation
 
 ```bash
-npm install taskview-api
+npm install taskview-api axios
 ```
 
-## Использование
+`axios` is a peer dependency — you provide your own configured instance.
 
-```javascript
-import { setupCounter } from 'taskview-api'
+## Quick Start
 
-// Использование функции setupCounter
-const button = document.querySelector('#counter')
-setupCounter(button)
+```typescript
+import axios from 'axios';
+import { TvApi } from 'taskview-api';
+
+const $axios = axios.create({
+    baseURL: 'https://api.taskview.app',
+});
+$axios.defaults.headers.common['Authorization'] = `Bearer ${accessToken}`;
+
+const api = new TvApi($axios);
 ```
 
-## Разработка
+You can change the base URL at any time:
 
-### Установка зависимостей
-
-```bash
-npm install
+```typescript
+api.setBaseUrl('https://other-api.example.com');
 ```
 
-### Запуск в режиме разработки
+## Authentication
 
-```bash
-npm run dev
+All API requests (except auth endpoints) require a Bearer token in the `Authorization` header. Below is how to obtain and manage tokens.
+
+### Login
+
+**With email or username and password:**
+
+```typescript
+const response = await $axios.post('/module/auth/login', {
+    login: 'user@example.com', // email or username
+    password: 'securePassword123',
+});
+
+const { access, refresh, userData } = response.data;
 ```
 
-### Сборка библиотеки
+**Passwordless login (email code):**
 
-```bash
-npm run build
+```typescript
+// 1. Request a login code
+await $axios.post('/module/auth/send-login-code', {
+    email: 'user@example.com',
+});
+
+// 2. User receives a code via email, then submit it
+const response = await $axios.post('/module/auth/login-by-code', {
+    email: 'user@example.com',
+    code: '123456',
+});
+
+const { access, refresh, userData } = response.data;
 ```
 
-### Проверка типов
+### Using Tokens
 
-```bash
-npm run type-check
+Once you have the access token, pass it to `TvApi` via the axios instance:
+
+```typescript
+import axios from 'axios';
+import { TvApi } from 'taskview-api';
+
+const $axios = axios.create({
+    baseURL: 'https://api.taskview.tech',
+});
+$axios.defaults.headers.common['Authorization'] = `Bearer ${access}`;
+
+const api = new TvApi($axios);
 ```
 
-## Структура проекта
+Store the refresh token securely (e.g. `httpOnly` cookie or secure storage). The access token has a short lifetime; the refresh token lives longer (up to 30 days).
 
-- `src/index.ts` - основной файл экспорта библиотеки
-- `src/counter.ts` - модуль с функцией счетчика
-- `dist/` - собранные файлы библиотеки
+### Refreshing Tokens
 
-## Форматы сборки
+When the access token expires the server returns `401 Unauthorized`. Use the refresh token to obtain a new pair:
 
-Библиотека собирается в следующих форматах:
-- ES Module (`.es.js`)
-- CommonJS (`.cjs.js`) 
-- UMD (`.umd.js`)
-- TypeScript типы (`.d.ts`) 
+```typescript
+const response = await $axios.post('/module/auth/refresh/token', {
+    refreshToken: refresh,
+});
+
+const { access: newAccess, refresh: newRefresh } = response.data;
+
+// Update the axios header with the new access token
+$axios.defaults.headers.common['Authorization'] = `Bearer ${newAccess}`;
+```
+
+### Logout
+
+```typescript
+await $axios.post('/module/auth/logout');
+// Clear stored tokens on the client side
+```
+
+
+### OAuth Providers
+
+TaskView supports OAuth login via **Google**, **GitHub**, and **Apple**. Redirect the user to:
+
+```
+GET /module/auth/provider/google
+GET /module/auth/provider/github
+GET /module/auth/provider/apple
+```
+
+After successful authentication the user is redirected back with a login code that can be exchanged for tokens via the `login-by-code` endpoint.
+
+### JWT Payload Structure
+
+The decoded access token contains:
+
+```typescript
+{
+    exp: number;           // Expiration timestamp
+    id: number;            // Token ID
+    type: 'jwt';
+    userData: {
+        id: number;        // User ID
+        email: string;
+        login: string;
+        permissions: {
+            [key: string]: {
+                id: number;
+                name: string;
+                description: string;
+            };
+        };
+    };
+}
+```
+
+## API Modules
+
+The `TvApi` instance exposes the following modules:
+
+| Module              | Access               | Description                            |
+|---------------------|----------------------|----------------------------------------|
+| Goals               | `api.goals`          | Create, update, delete, fetch goals    |
+| Goal Lists          | `api.goalLists`      | Task lists within a goal               |
+| Tasks               | `api.tasks`          | Full task CRUD, history, assignments   |
+| Tags                | `api.tags`           | Tag management and task tagging        |
+| Kanban              | `api.kanban`         | Columns, task ordering, pagination     |
+| Graph               | `api.graph`          | Task dependency edges                  |
+| Collaboration       | `api.collaboration`  | Users, roles, permissions              |
+
+---
+
+### Goals
+
+```typescript
+// Fetch all goals
+const goals = await api.goals.fetchGoals();
+
+// Create a goal
+const goal = await api.goals.createGoal({
+    name: 'Sprint 1',
+    description: 'First sprint tasks',
+    color: '#4A90D9',
+});
+
+// Update a goal
+await api.goals.updateGoal({
+    id: goal.id,
+    name: 'Sprint 1 (updated)',
+    archive: 0,
+});
+
+// Delete a goal
+await api.goals.deleteGoal(goal.id);
+```
+
+### Goal Lists
+
+Goal lists are task lists that belong to a goal.
+
+```typescript
+// Fetch lists for a goal
+const lists = await api.goalLists.fetchLists({ goalId: goal.id });
+
+// Create a list
+const list = await api.goalLists.createList({
+    goalId: goal.id,
+    name: 'Backlog',
+    description: 'Upcoming work',
+});
+
+// Update a list
+await api.goalLists.updateList({
+    id: list.id,
+    name: 'Backlog (v2)',
+});
+
+// Delete a list
+await api.goalLists.deleteList(list.id);
+```
+
+### Tasks
+
+```typescript
+// Fetch tasks with pagination and filters
+const tasks = await api.tasks.fetch({
+    goalId: goal.id,
+    componentId: list.id,   // list ID, or -1401 for all tasks
+    page: 1,
+    showCompleted: 0,       // 0 = hide completed, 1 = show
+    firstNew: 0,            // 0 = oldest first, 1 = newest first
+    searchText: 'bug',      // optional text search
+    filters: {              // optional filters
+        selectedUser: 5,
+        priority: 1,
+        selectedTags: { '12': true, '15': true },
+    },
+});
+
+// Create a task
+const task = await api.tasks.createTask({
+    goalId: goal.id,
+    description: 'Fix login bug',
+    priorityId: 1,          // 1 = low, 2 = medium, 3 = high
+    goalListId: list.id,
+    note: 'Details here',
+    startDate: '2025-03-01',
+    endDate: '2025-03-05',
+});
+
+// Update a task
+await api.tasks.updateTask({
+    id: task.id,
+    description: 'Fix login bug (critical)',
+    complete: true,
+    priorityId: 3,
+});
+
+// Delete a task
+await api.tasks.deleteTask(task.id);
+
+// Fetch a single task by ID
+const single = await api.tasks.fetchTaskById(task.id);
+
+// Toggle user assignment
+await api.tasks.toggleTasksAssignee({
+    taskId: task.id,
+    userId: 42,
+});
+
+// Task history
+const history = await api.tasks.fetchTaskHistory(task.id);
+await api.tasks.recoveryTaskHistory(history.history[0].historyId, task.id);
+```
+
+### Tags
+
+```typescript
+// Fetch all tags
+const tags = await api.tags.fetchAllTagsForUser();
+
+// Create a tag
+const tag = await api.tags.createTag({
+    name: 'urgent',
+    color: '#FF0000',
+    goalId: goal.id,
+});
+
+// Toggle tag on a task (adds if missing, removes if present)
+await api.tags.toggleTag({ tagId: tag.id, taskId: task.id });
+
+// Update a tag
+await api.tags.updateTag({ id: tag.id, name: 'critical', color: '#CC0000' });
+
+// Delete a tag
+await api.tags.deleteTag({ tagId: tag.id });
+```
+
+### Kanban
+
+```typescript
+// Fetch all columns for a goal
+const columns = await api.kanban.fetchAllColumns(goal.id);
+
+// Add a column
+const column = await api.kanban.addColumn({
+    goalId: goal.id,
+    name: 'In Progress',
+});
+
+// Fetch tasks for a column (cursor-based pagination)
+const result = await api.kanban.fetchTasksForColumn(goal.id, column.id, null);
+// result.tasks, result.nextCursor, result.columnVersion
+
+// Move a task between columns / reorder
+await api.kanban.updateTasksOrderAndColumn({
+    goalId: goal.id,
+    columnId: column.id,
+    taskId: task.id,
+    prevTaskId: null,
+    nextTaskId: 10,
+});
+
+// Update a column
+await api.kanban.updateColumn({ id: column.id, goalId: goal.id, name: 'Review' });
+
+// Delete a column
+await api.kanban.deleteColumn({ id: column.id, goalId: goal.id });
+```
+
+### Graph (Task Dependencies)
+
+```typescript
+// Add a dependency edge (source -> target)
+const edge = await api.graph.addEdge({ source: 1, target: 2 });
+
+// Fetch all edges for a goal
+const edges = await api.graph.fetchAllEdges(goal.id);
+
+// Delete an edge
+await api.graph.deleteEdge(edge.id);
+```
+
+### Collaboration
+
+```typescript
+// Invite a user by email
+await api.collaboration.inviteUserToGoal({
+    goalId: goal.id,
+    email: 'user@example.com',
+});
+
+// Fetch goal members
+const members = await api.collaboration.fetchUsersForGoal(goal.id);
+
+// Remove a user
+await api.collaboration.deleteUserFromGoal({
+    goalId: goal.id,
+    userId: 5,
+});
+
+// Roles
+const roles = await api.collaboration.fetchRolesForGoal(goal.id);
+const newRole = await api.collaboration.createRoleForGoal({
+    goalId: goal.id,
+    name: 'Developer',
+});
+await api.collaboration.toggleUserRoles({
+    goalId: goal.id,
+    userId: 5,
+    roleId: newRole.id,
+});
+
+// Permissions
+const allPermissions = await api.collaboration.fetchAllPermissions();
+await api.collaboration.toggleRolePermission({
+    goalId: goal.id,
+    roleId: newRole.id,
+    permissionId: 3,
+});
+await api.collaboration.deleteRoleFromGoal({
+    goalId: goal.id,
+    roleId: newRole.id,
+});
+```
+
+## Permissions
+
+The package exports `TvPermissions` — a map of all permission constants:
+
+```typescript
+import { TvPermissions } from 'taskview-api';
+
+TvPermissions.GOAL_CAN_DELETE           // 'goal_can_delete'
+TvPermissions.GOAL_CAN_EDIT            // 'goal_can_edit'
+TvPermissions.GOAL_CAN_MANAGE_USERS    // 'goal_can_manage_users'
+TvPermissions.GOAL_CAN_WATCH_CONTENT   // 'goal_can_watch_content'
+TvPermissions.GOAL_CAN_ADD_TASK_LIST   // 'goal_can_add_task_list'
+
+TvPermissions.COMPONENT_CAN_DELETE     // 'component_can_delete'
+TvPermissions.COMPONENT_CAN_EDIT       // 'component_can_edit'
+TvPermissions.COMPONENT_CAN_WATCH_CONTENT // 'component_can_watch_content'
+TvPermissions.COMPONENT_CAN_ADD_TASKS  // 'component_can_add_tasks'
+
+TvPermissions.TASK_CAN_DELETE          // 'task_can_delete'
+TvPermissions.TASK_CAN_EDIT_DESCRIPTION // 'task_can_edit_description'
+TvPermissions.TASK_CAN_EDIT_STATUS     // 'task_can_edit_status'
+TvPermissions.TASK_CAN_EDIT_NOTE       // 'task_can_edit_note'
+TvPermissions.TASK_CAN_EDIT_DEADLINE   // 'task_can_edit_deadline'
+TvPermissions.TASK_CAN_EDIT_TAGS       // 'task_can_edit_tags'
+TvPermissions.TASK_CAN_EDIT_PRIORITY   // 'task_can_edit_priority'
+TvPermissions.TASK_CAN_ASSIGN_USERS    // 'task_can_assign_users'
+TvPermissions.TASK_CAN_ACCESS_HISTORY  // 'task_can_access_history'
+// ... and more
+
+TvPermissions.KANBAN_CAN_MANAGE       // 'kanban_can_manage'
+TvPermissions.KANBAN_CAN_VIEW         // 'kanban_can_view'
+
+TvPermissions.GRAPH_CAN_MANAGE        // 'graph_can_manage'
+TvPermissions.GRAPH_CAN_VIEW          // 'graph_can_view'
+```
+
+## Build Formats
+
+The library ships in three formats:
+
+- **ES Module** — `taskview-api.es.js`
+- **CommonJS** — `taskview-api.cjs.js`
+- **UMD** — `taskview-api.umd.js`
+- **TypeScript declarations** — `index.d.ts`
+
+## Example
+
+```typescript
+import axios from 'axios';
+import { TvApi } from 'taskview-api';
+
+const BASE_URL = 'http://localhost:1401';
+
+const $axios = axios.create({ baseURL: BASE_URL });
+
+async function login(): Promise<{ access: string; refresh: string }> {
+    const { data } = await $axios.post('/module/auth/login', {
+        login: 'test@mail.dest',
+        password: 'user1!#Q',
+    });
+    return data;
+}
+
+async function main() {
+    // 1. Authenticate
+    console.log('Logging in...');
+    const { access, refresh } = await login();
+    console.log('Logged in. Access token received.');
+
+    // 2. Set auth header and create API instance
+    $axios.defaults.headers.common['Authorization'] = `Bearer ${access}`;
+    const api = new TvApi($axios);
+
+    // 3. Goals
+    console.log('\n--- Goals ---');
+    const goals = await api.goals.fetchGoals();
+    console.log(`Found ${goals.length} goal(s)`);
+
+    const goal = await api.goals.createGoal({
+        name: `Example Goal ${Date.now()}`,
+        description: 'Created by taskview-api example',
+        color: '#4A90D9',
+    });
+    console.log(`Created goal: id=${goal!.id}, name="${goal!.name}"`);
+
+    // 4. Goal Lists
+    console.log('\n--- Goal Lists ---');
+    const list = await api.goalLists.createList({
+        goalId: goal!.id,
+        name: 'Backlog',
+        description: 'Example task list',
+    });
+    console.log(`Created list: id=${list!.id}, name="${list!.name}"`);
+
+    const lists = await api.goalLists.fetchLists({ goalId: goal!.id });
+    console.log(`Goal has ${lists.length} list(s)`);
+
+    // 5. Tasks
+    console.log('\n--- Tasks ---');
+    const task1 = await api.tasks.createTask({
+        goalId: goal!.id,
+        description: 'First task',
+        priorityId: 1,
+        goalListId: list!.id,
+    });
+    console.log(`Created task: id=${task1!.id}, "${task1!.description}"`);
+
+    const task2 = await api.tasks.createTask({
+        goalId: goal!.id,
+        description: 'Second task (high priority)',
+        priorityId: 3,
+        goalListId: list!.id,
+        note: 'This is an important task',
+    });
+    console.log(`Created task: id=${task2!.id}, "${task2!.description}"`);
+
+    const tasks = await api.tasks.fetch({
+        goalId: goal!.id,
+        componentId: list!.id,
+        page: 1,
+        showCompleted: 0,
+        firstNew: 0,
+    });
+    console.log(`Fetched ${tasks.length} task(s) from list`);
+
+    // 6. Update a task
+    await api.tasks.updateTask({
+        id: task1!.id,
+        description: 'First task (updated)',
+        complete: true,
+    });
+    console.log(`Marked task ${task1!.id} as complete`);
+
+    // 7. Tags
+    console.log('\n--- Tags ---');
+    const tag = await api.tags.createTag({
+        name: 'example-tag',
+        color: '#FF5733',
+        goalId: goal!.id,
+    });
+    console.log(`Created tag: id=${tag!.id}, name="${tag!.name}"`);
+
+    await api.tags.toggleTag({ tagId: tag!.id, taskId: task2!.id });
+    console.log(`Added tag "${tag!.name}" to task ${task2!.id}`);
+
+    // 8. Kanban
+    console.log('\n--- Kanban ---');
+    const column = await api.kanban.addColumn({
+        goalId: goal!.id,
+        name: 'In Progress',
+    });
+    console.log(`Created kanban column: id=${column.id}, name="${column.name}"`);
+
+    const columns = await api.kanban.fetchAllColumns(goal!.id);
+    console.log(`Goal has ${columns.length} kanban column(s)`);
+
+    // 9. Graph (task dependencies)
+    console.log('\n--- Graph ---');
+    const edge = await api.graph.addEdge({
+        source: task1!.id,
+        target: task2!.id,
+    });
+    console.log(`Created dependency: task ${edge.fromTaskId} → task ${edge.toTaskId}`);
+
+    const edges = await api.graph.fetchAllEdges(goal!.id);
+    console.log(`Goal has ${edges.length} dependency edge(s)`);
+
+    // 10. Cleanup
+    console.log('\n--- Cleanup ---');
+    await api.graph.deleteEdge(edge.id);
+    console.log('Deleted dependency edge');
+
+    await api.kanban.deleteColumn({ id: column.id, goalId: goal!.id });
+    console.log('Deleted kanban column');
+
+    await api.tags.deleteTag({ tagId: tag!.id });
+    console.log('Deleted tag');
+
+    await api.tasks.deleteTask(task2!.id);
+    await api.tasks.deleteTask(task1!.id);
+    console.log('Deleted tasks');
+
+    await api.goalLists.deleteList(list!.id);
+    console.log('Deleted list');
+
+    await api.goals.deleteGoal(goal!.id);
+    console.log('Deleted goal');
+
+    console.log('\nDone! All examples completed successfully.');
+}
+
+main().catch((err) => {
+    console.error('Error:', err.response?.data || err.message);
+    process.exit(1);
+});
+
+```

taskview-packages/taskview-api/example/index.ts

@@ -0,0 +1,147 @@
+import axios from 'axios';
+import { TvApi } from 'taskview-api';
+
+const BASE_URL = 'http://localhost:1401';
+
+const $axios = axios.create({ baseURL: BASE_URL });
+
+async function login(): Promise<{ access: string; refresh: string }> {
+    const { data } = await $axios.post('/module/auth/login', {
+        login: 'test@mail.dest',
+        password: 'user1!#Q',
+    });
+    return data;
+}
+
+async function main() {
+    // 1. Authenticate
+    console.log('Logging in...');
+    const { access, refresh } = await login();
+    console.log('Logged in. Access token received.');
+
+    // 2. Set auth header and create API instance
+    $axios.defaults.headers.common['Authorization'] = `Bearer ${access}`;
+    const api = new TvApi($axios);
+
+    // 3. Goals
+    console.log('\n--- Goals ---');
+    const goals = await api.goals.fetchGoals();
+    console.log(`Found ${goals.length} goal(s)`);
+
+    const goal = await api.goals.createGoal({
+        name: `Example Goal ${Date.now()}`,
+        description: 'Created by taskview-api example',
+        color: '#4A90D9',
+    });
+    console.log(`Created goal: id=${goal!.id}, name="${goal!.name}"`);
+
+    // 4. Goal Lists
+    console.log('\n--- Goal Lists ---');
+    const list = await api.goalLists.createList({
+        goalId: goal!.id,
+        name: 'Backlog',
+        description: 'Example task list',
+    });
+    console.log(`Created list: id=${list!.id}, name="${list!.name}"`);
+
+    const lists = await api.goalLists.fetchLists({ goalId: goal!.id });
+    console.log(`Goal has ${lists.length} list(s)`);
+
+    // 5. Tasks
+    console.log('\n--- Tasks ---');
+    const task1 = await api.tasks.createTask({
+        goalId: goal!.id,
+        description: 'First task',
+        priorityId: 1,
+        goalListId: list!.id,
+    });
+    console.log(`Created task: id=${task1!.id}, "${task1!.description}"`);
+
+    const task2 = await api.tasks.createTask({
+        goalId: goal!.id,
+        description: 'Second task (high priority)',
+        priorityId: 3,
+        goalListId: list!.id,
+        note: 'This is an important task',
+    });
+    console.log(`Created task: id=${task2!.id}, "${task2!.description}"`);
+
+    const tasks = await api.tasks.fetch({
+        goalId: goal!.id,
+        componentId: list!.id,
+        page: 1,
+        showCompleted: 0,
+        firstNew: 0,
+    });
+    console.log(`Fetched ${tasks.length} task(s) from list`);
+
+    // 6. Update a task
+    await api.tasks.updateTask({
+        id: task1!.id,
+        description: 'First task (updated)',
+        complete: true,
+    });
+    console.log(`Marked task ${task1!.id} as complete`);
+
+    // 7. Tags
+    console.log('\n--- Tags ---');
+    const tag = await api.tags.createTag({
+        name: 'example-tag',
+        color: '#FF5733',
+        goalId: goal!.id,
+    });
+    console.log(`Created tag: id=${tag!.id}, name="${tag!.name}"`);
+
+    await api.tags.toggleTag({ tagId: tag!.id, taskId: task2!.id });
+    console.log(`Added tag "${tag!.name}" to task ${task2!.id}`);
+
+    // 8. Kanban
+    console.log('\n--- Kanban ---');
+    const column = await api.kanban.addColumn({
+        goalId: goal!.id,
+        name: 'In Progress',
+    });
+    console.log(`Created kanban column: id=${column.id}, name="${column.name}"`);
+
+    const columns = await api.kanban.fetchAllColumns(goal!.id);
+    console.log(`Goal has ${columns.length} kanban column(s)`);
+
+    // 9. Graph (task dependencies)
+    console.log('\n--- Graph ---');
+    const edge = await api.graph.addEdge({
+        source: task1!.id,
+        target: task2!.id,
+    });
+    console.log(`Created dependency: task ${edge.fromTaskId} → task ${edge.toTaskId}`);
+
+    const edges = await api.graph.fetchAllEdges(goal!.id);
+    console.log(`Goal has ${edges.length} dependency edge(s)`);
+
+    // 10. Cleanup
+    console.log('\n--- Cleanup ---');
+    await api.graph.deleteEdge(edge.id);
+    console.log('Deleted dependency edge');
+
+    await api.kanban.deleteColumn({ id: column.id, goalId: goal!.id });
+    console.log('Deleted kanban column');
+
+    await api.tags.deleteTag({ tagId: tag!.id });
+    console.log('Deleted tag');
+
+    await api.tasks.deleteTask(task2!.id);
+    await api.tasks.deleteTask(task1!.id);
+    console.log('Deleted tasks');
+
+    await api.goalLists.deleteList(list!.id);
+    console.log('Deleted list');
+
+    await api.goals.deleteGoal(goal!.id);
+    console.log('Deleted goal');
+
+    console.log('\nDone! All examples completed successfully.');
+}
+
+main().catch((err) => {
+    console.error('Error:', err.response?.data || err.message);
+    process.exit(1);
+});

taskview-packages/taskview-api/example/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "taskview-api-example",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "start": "npx tsx index.ts"
+  },
+  "dependencies": {
+    "taskview-api": "latest",
+    "axios": "^1.2.3",
+    "tsx": "^4.19.0"
+  }
+}

taskview-packages/taskview-api/package.json

@@ -1,7 +1,7 @@
 {
   "name": "taskview-api",
   "private": false,
-  "version": "1.17.0",
+  "version": "1.17.2",
   "type": "module",
   "main": "./dist/taskview-api.umd.js",
   "module": "./dist/taskview-api.es.js",

taskview-packages/taskview-api/src/api/tasks.api.types.ts

@@ -2,7 +2,6 @@ export const TaskIncomeType = 1;
 export const TaskExpenseType = 0;
 export type TaskTransactionTypes = typeof TaskIncomeType | typeof TaskExpenseType | null;
 
-//TODO add optional type for fields that can be not allowed by permissions (subtasks, note)
 export interface TaskBase {
     id: number;
     description: string;
@@ -26,8 +25,8 @@ export interface TaskBase {
     statusId: number | null;
     taskOrder: number | null;
     kanbanOrder: number | null;
-    //we add amount as number but got as string from API
-    amount: number | string | null; //string bec JS not working with numbers like 3.43
+
+    amount: number | string | null;
     transactionType: TaskTransactionTypes;
     nodeGraphPosition: Record<'x' | 'y', number> | null;
     creatorId: number | null;
@@ -36,7 +35,7 @@ export interface TaskBase {
 export interface Task extends TaskBase {
     tags: number[];
     historyId: null | number;
-    assignedUsers: number[]; //TODO how we update assigned users? maybe we need to do it in different module
+    assignedUsers: number[];
 };
 
 // we can not update defined fields
@@ -47,8 +46,7 @@ export type TaskResponseUpdate = Task | null;
 
 export type TaskArgAdd = Pick<Task, 'goalId' | 'description'>
     & Partial<Omit<Task, NotAllowedToUpdate | 'subtasks' | 'tags' | 'assignedUsers' | 'creatorId' | 'amount'>>
-    //we add amount as number but got as string from API
-    & { amount?: number | null };
+    & { amount?: number | string | null };
 
 export type TaskResponseAdd = Task | null;
 
@@ -77,6 +75,7 @@ export type TaskArgFetch = {
     searchText?: string;
     filters?: TaskFilters;
     unlimited?: boolean;
+    ignoreCompleted?: boolean;
 };
 
 export type TaskResponseFetch = Task[];

taskview-packages/taskview-api/src/tv.ts

@@ -7,7 +7,6 @@ import TvGoalListApi from "./api/goals-list";
 import TvTagsApi from "./api/tags";
 import TvKanban from "./api/kanban";
 
-// const TASKVIEW_URL = 'https://apitaskview.handscream.com/';
 export class TvApi {
 
     protected $axios: AxiosInstance;

taskview-packages/taskview-db-schemas/src/schemas/tasks.schema.ts

@@ -1,4 +1,4 @@
-import { integer, pgSchema, varchar, boolean, date, time, jsonb } from "drizzle-orm/pg-core";
+import { integer, numeric, pgSchema, varchar, boolean, date, time, jsonb } from "drizzle-orm/pg-core";
 import { createInsertSchema } from 'drizzle-arktype';
 import { UsersSchema } from "./users.schema";
 
@@ -20,7 +20,7 @@ export const TasksSchema = pgSchema('tasks').table('tasks', {
     statusId: integer('status_id'), //kanban column id
     taskOrder: integer('task_order'),
     kanbanOrder: integer('kanban_order'),
-    amount: integer(),
+    amount: numeric({ precision: 10, scale: 2 }),
     transactionType: integer('transaction_type').$type<1 | 0 | null>(),
     nodeGraphPosition: jsonb('node_graph_position'),
 });

web/.claude/settings.json

@@ -0,0 +1,5 @@
+{
+  "enabledPlugins": {
+    "context7@claude-plugins-official": true
+  }
+}

web/.editorconfig

@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

web/.github/workflows/ci.yml

@@ -0,0 +1,37 @@
+name: ci
+
+on: push
+
+jobs:
+  ci:
+    runs-on: ${{ matrix.os }}
+
+    strategy:
+      matrix:
+        os: [ubuntu-latest]
+        node: [22]
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v6
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+
+      - name: Install node
+        uses: actions/setup-node@v6
+        with:
+          node-version: ${{ matrix.node }}
+          cache: pnpm
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Lint
+        run: pnpm run lint
+
+      - name: Build
+        run: pnpm run build
+
+      - name: Typecheck
+        run: pnpm run typecheck

web/.gitignore

@@ -1,2 +1,39 @@
-!build-upload.sh
-tsconfig.tsbuildinfo
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Auto-generated type declarations
+auto-imports.d.ts
+components.d.ts
+tsconfig.app.tsbuildinfo
+tsconfig.node.tsbuildinfo
+
+# Environment variables
+.env
+Info.plist
+e2e_logs
+e2e_pgdata
+e2e_updates
+playwright-report
+test-results

web/android/.gitignore

@@ -54,8 +54,8 @@ captures/
 
 # Keystore files
 # Uncomment the following lines if you do not want to check your keystore files in.
-#*.jks
-#*.keystore
+*.jks
+*.keystore
 
 # External native build folder generated in Android Studio 2.2 and later
 .externalNativeBuild

web/android/app/build.gradle

@@ -1,28 +1,25 @@
 apply plugin: 'com.android.application'
 
 android {
-    namespace "com.handscream.taskview.app"
-    compileSdk rootProject.ext.compileSdkVersion
+    namespace = "com.handscream.taskview.app"
+    compileSdk = rootProject.ext.compileSdkVersion
     defaultConfig {
         applicationId "com.handscreamgnl.taskview.app"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 1196
-        versionName "1.19.6"
+        versionCode 1201
+        versionName "1.20.1"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.
              // Default: https://android.googlesource.com/platform/frameworks/base/+/282e181b58cf72b6ca770dc7ca5f91f135444502/tools/aapt/AaptAssets.cpp#61
-            ignoreAssetsPattern '!.svn:!.git:!.ds_store:!*.scc:.*:!CVS:!thumbs.db:!picasa.ini:!*~'
+            ignoreAssetsPattern = '!.svn:!.git:!.ds_store:!*.scc:.*:!CVS:!thumbs.db:!picasa.ini:!*~'
         }
-        setProperty("archivesBaseName", "TaskView-$versionName")
-
     }
     buildTypes {
         release {
             minifyEnabled false
             proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
-            signingConfig signingConfigs.debug
         }
     }
 }

web/android/app/src/main/AndroidManifest.xml

@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <manifest xmlns:android="http://schemas.android.com/apk/res/android">
+
     <application
         android:allowBackup="true"
         android:icon="@mipmap/ic_launcher"
@@ -8,23 +9,20 @@
         android:supportsRtl="true"
         android:networkSecurityConfig="@xml/network_security_config"
         android:theme="@style/AppTheme">
+
         <activity
-            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode|navigation"
+            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode|navigation|density"
             android:name=".MainActivity"
             android:label="@string/title_activity_main"
             android:theme="@style/AppTheme.NoActionBarLaunch"
             android:launchMode="singleTask"
             android:exported="true">
+
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
-            <intent-filter>
-                <action android:name="android.intent.action.VIEW" />
-                <category android:name="android.intent.category.DEFAULT" />
-                <category android:name="android.intent.category.BROWSABLE" />
-                <data android:scheme="taskview" />
-            </intent-filter>
+
         </activity>
 
         <provider
@@ -32,8 +30,9 @@
             android:authorities="${applicationId}.fileprovider"
             android:exported="false"
             android:grantUriPermissions="true">
-            <meta-data android:name="android.support.FILE_PROVIDER_PATHS"
-                android:resource="@xml/file_paths" />
+            <meta-data
+                android:name="android.support.FILE_PROVIDER_PATHS"
+                android:resource="@xml/file_paths"></meta-data>
         </provider>
     </application>
 

web/android/build.gradle

@@ -7,8 +7,8 @@ buildscript {
         mavenCentral()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:8.7.3'
-        classpath 'com.google.gms:google-services:4.4.2'
+        classpath 'com.android.tools.build:gradle:8.13.0'
+        classpath 'com.google.gms:google-services:4.4.4'
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

web/android/capacitor.settings.gradle

@@ -1,21 +1,21 @@
 // DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN
 include ':capacitor-android'
-project(':capacitor-android').projectDir = new File('../../../node_modules/.pnpm/@capacitor+android@7.4.5_@capacitor+core@7.4.5/node_modules/@capacitor/android/capacitor')
+project(':capacitor-android').projectDir = new File('../../../node_modules/.pnpm/@capacitor+android@8.1.0_@capacitor+core@8.1.0/node_modules/@capacitor/android/capacitor')
 
 include ':capacitor-app'
-project(':capacitor-app').projectDir = new File('../../../node_modules/.pnpm/@capacitor+app@7.0.1_@capacitor+core@7.4.5/node_modules/@capacitor/app/android')
+project(':capacitor-app').projectDir = new File('../../../node_modules/.pnpm/@capacitor+app@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/app/android')
 
 include ':capacitor-browser'
-project(':capacitor-browser').projectDir = new File('../../../node_modules/.pnpm/@capacitor+browser@7.0.3_@capacitor+core@7.4.5/node_modules/@capacitor/browser/android')
+project(':capacitor-browser').projectDir = new File('../../../node_modules/.pnpm/@capacitor+browser@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/browser/android')
 
 include ':capacitor-device'
-project(':capacitor-device').projectDir = new File('../../../node_modules/.pnpm/@capacitor+device@7.0.1_@capacitor+core@7.4.5/node_modules/@capacitor/device/android')
+project(':capacitor-device').projectDir = new File('../../../node_modules/.pnpm/@capacitor+device@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/device/android')
 
 include ':capacitor-preferences'
-project(':capacitor-preferences').projectDir = new File('../../../node_modules/.pnpm/@capacitor+preferences@7.0.1_@capacitor+core@7.4.5/node_modules/@capacitor/preferences/android')
+project(':capacitor-preferences').projectDir = new File('../../../node_modules/.pnpm/@capacitor+preferences@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/preferences/android')
 
 include ':capacitor-splash-screen'
-project(':capacitor-splash-screen').projectDir = new File('../../../node_modules/.pnpm/@capacitor+splash-screen@7.0.4_@capacitor+core@7.4.5/node_modules/@capacitor/splash-screen/android')
+project(':capacitor-splash-screen').projectDir = new File('../../../node_modules/.pnpm/@capacitor+splash-screen@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/splash-screen/android')
 
 include ':capgo-capacitor-updater'
-project(':capgo-capacitor-updater').projectDir = new File('../../../node_modules/.pnpm/@capgo+capacitor-updater@7.41.1_@capacitor+core@7.4.5/node_modules/@capgo/capacitor-updater/android')
+project(':capgo-capacitor-updater').projectDir = new File('../../../node_modules/.pnpm/@capgo+capacitor-updater@8.43.2_@capacitor+core@8.1.0/node_modules/@capgo/capacitor-updater/android')

web/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.11.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.14.3-all.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME

web/android/gradlew

@@ -15,6 +15,8 @@
 # See the License for the specific language governing permissions and
 # limitations under the License.
 #
+# SPDX-License-Identifier: Apache-2.0
+#
 
 ##############################################################################
 #
@@ -55,7 +57,7 @@
 #       Darwin, MinGW, and NonStop.
 #
 #   (3) This script is generated from the Groovy template
-#       https://github.com/gradle/gradle/blob/HEAD/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
 #       within the Gradle project.
 #
 #       You can find Gradle at https://github.com/gradle/gradle/.
@@ -83,7 +85,8 @@ done
 # This is normally unused
 # shellcheck disable=SC2034
 APP_BASE_NAME=${0##*/}
-APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit
+# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s\n' "$PWD" ) || exit
 
 # Use the maximum available, or set MAX_FD != -1 to use that value.
 MAX_FD=maximum
@@ -111,7 +114,7 @@ case "$( uname )" in                #(
   NONSTOP* )        nonstop=true ;;
 esac
 
-CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
+CLASSPATH="\\\"\\\""
 
 
 # Determine the Java command to use to start the JVM.
@@ -144,7 +147,7 @@ if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
     case $MAX_FD in #(
       max*)
         # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
-        # shellcheck disable=SC3045
+        # shellcheck disable=SC2039,SC3045
         MAX_FD=$( ulimit -H -n ) ||
             warn "Could not query maximum file descriptor limit"
     esac
@@ -152,7 +155,7 @@ if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
       '' | soft) :;; #(
       *)
         # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
-        # shellcheck disable=SC3045
+        # shellcheck disable=SC2039,SC3045
         ulimit -n "$MAX_FD" ||
             warn "Could not set maximum file descriptor limit to $MAX_FD"
     esac
@@ -201,16 +204,16 @@ fi
 # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
 DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
 
-# Collect all arguments for the java command;
-#   * $DEFAULT_JVM_OPTS, $JAVA_OPTS, and $GRADLE_OPTS can contain fragments of
-#     shell script including quotes and variable substitutions, so put them in
-#     double quotes to make sure that they get re-expanded; and
-#   * put everything else in single quotes, so that it's not re-expanded.
+# Collect all arguments for the java command:
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
+#     and any embedded shellness will be escaped.
+#   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
+#     treated as '${Hostname}' itself on the command line.
 
 set -- \
         "-Dorg.gradle.appname=$APP_BASE_NAME" \
         -classpath "$CLASSPATH" \
-        org.gradle.wrapper.GradleWrapperMain \
+        -jar "$APP_HOME/gradle/wrapper/gradle-wrapper.jar" \
         "$@"
 
 # Stop when "xargs" is not available.

web/android/gradlew.bat

@@ -1,92 +1,94 @@
-@rem
-@rem Copyright 2015 the original author or authors.
-@rem
-@rem Licensed under the Apache License, Version 2.0 (the "License");
-@rem you may not use this file except in compliance with the License.
-@rem You may obtain a copy of the License at
-@rem
-@rem      https://www.apache.org/licenses/LICENSE-2.0
-@rem
-@rem Unless required by applicable law or agreed to in writing, software
-@rem distributed under the License is distributed on an "AS IS" BASIS,
-@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-@rem See the License for the specific language governing permissions and
-@rem limitations under the License.
-@rem
-
-@if "%DEBUG%"=="" @echo off
-@rem ##########################################################################
-@rem
-@rem  Gradle startup script for Windows
-@rem
-@rem ##########################################################################
-
-@rem Set local scope for the variables with windows NT shell
-if "%OS%"=="Windows_NT" setlocal
-
-set DIRNAME=%~dp0
-if "%DIRNAME%"=="" set DIRNAME=.
-@rem This is normally unused
-set APP_BASE_NAME=%~n0
-set APP_HOME=%DIRNAME%
-
-@rem Resolve any "." and ".." in APP_HOME to make it shorter.
-for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
-
-@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
-set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
-
-@rem Find java.exe
-if defined JAVA_HOME goto findJavaFromJavaHome
-
-set JAVA_EXE=java.exe
-%JAVA_EXE% -version >NUL 2>&1
-if %ERRORLEVEL% equ 0 goto execute
-
-echo.
-echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
-echo.
-echo Please set the JAVA_HOME variable in your environment to match the
-echo location of your Java installation.
-
-goto fail
-
-:findJavaFromJavaHome
-set JAVA_HOME=%JAVA_HOME:"=%
-set JAVA_EXE=%JAVA_HOME%/bin/java.exe
-
-if exist "%JAVA_EXE%" goto execute
-
-echo.
-echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
-echo.
-echo Please set the JAVA_HOME variable in your environment to match the
-echo location of your Java installation.
-
-goto fail
-
-:execute
-@rem Setup the command line
-
-set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
-
-
-@rem Execute Gradle
-"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
-
-:end
-@rem End local scope for the variables with windows NT shell
-if %ERRORLEVEL% equ 0 goto mainEnd
-
-:fail
-rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
-rem the _cmd.exe /c_ return code!
-set EXIT_CODE=%ERRORLEVEL%
-if %EXIT_CODE% equ 0 set EXIT_CODE=1
-if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
-exit /b %EXIT_CODE%
-
-:mainEnd
-if "%OS%"=="Windows_NT" endlocal
-
-:omega
+@rem
+@rem Copyright 2015 the original author or authors.
+@rem
+@rem Licensed under the Apache License, Version 2.0 (the "License");
+@rem you may not use this file except in compliance with the License.
+@rem You may obtain a copy of the License at
+@rem
+@rem      https://www.apache.org/licenses/LICENSE-2.0
+@rem
+@rem Unless required by applicable law or agreed to in writing, software
+@rem distributed under the License is distributed on an "AS IS" BASIS,
+@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+@rem See the License for the specific language governing permissions and
+@rem limitations under the License.
+@rem
+@rem SPDX-License-Identifier: Apache-2.0
+@rem
+
+@if "%DEBUG%"=="" @echo off
+@rem ##########################################################################
+@rem
+@rem  Gradle startup script for Windows
+@rem
+@rem ##########################################################################
+
+@rem Set local scope for the variables with windows NT shell
+if "%OS%"=="Windows_NT" setlocal
+
+set DIRNAME=%~dp0
+if "%DIRNAME%"=="" set DIRNAME=.
+@rem This is normally unused
+set APP_BASE_NAME=%~n0
+set APP_HOME=%DIRNAME%
+
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
+@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
+
+@rem Find java.exe
+if defined JAVA_HOME goto findJavaFromJavaHome
+
+set JAVA_EXE=java.exe
+%JAVA_EXE% -version >NUL 2>&1
+if %ERRORLEVEL% equ 0 goto execute
+
+echo. 1>&2
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2
+echo. 1>&2
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
+echo location of your Java installation. 1>&2
+
+goto fail
+
+:findJavaFromJavaHome
+set JAVA_HOME=%JAVA_HOME:"=%
+set JAVA_EXE=%JAVA_HOME%/bin/java.exe
+
+if exist "%JAVA_EXE%" goto execute
+
+echo. 1>&2
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2
+echo. 1>&2
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
+echo location of your Java installation. 1>&2
+
+goto fail
+
+:execute
+@rem Setup the command line
+
+set CLASSPATH=
+
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" -jar "%APP_HOME%\gradle\wrapper\gradle-wrapper.jar" %*
+
+:end
+@rem End local scope for the variables with windows NT shell
+if %ERRORLEVEL% equ 0 goto mainEnd
+
+:fail
+rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
+rem the _cmd.exe /c_ return code!
+set EXIT_CODE=%ERRORLEVEL%
+if %EXIT_CODE% equ 0 set EXIT_CODE=1
+if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
+exit /b %EXIT_CODE%
+
+:mainEnd
+if "%OS%"=="Windows_NT" endlocal
+
+:omega

web/android/variables.gradle

@@ -1,16 +1,16 @@
 ext {
-    minSdkVersion = 23
-    compileSdkVersion = 35
-    targetSdkVersion = 35
-    androidxActivityVersion = '1.9.2'
-    androidxAppCompatVersion = '1.7.0'
-    androidxCoordinatorLayoutVersion = '1.2.0'
-    androidxCoreVersion = '1.15.0'
-    androidxFragmentVersion = '1.8.4'
-    coreSplashScreenVersion = '1.0.1'
-    androidxWebkitVersion = '1.12.1'
+    minSdkVersion = 24
+    compileSdkVersion = 36
+    targetSdkVersion = 36
+    androidxActivityVersion = '1.11.0'
+    androidxAppCompatVersion = '1.7.1'
+    androidxCoordinatorLayoutVersion = '1.3.0'
+    androidxCoreVersion = '1.17.0'
+    androidxFragmentVersion = '1.8.9'
+    coreSplashScreenVersion = '1.2.0'
+    androidxWebkitVersion = '1.14.0'
     junitVersion = '4.13.2'
-    androidxJunitVersion = '1.2.1'
-    androidxEspressoCoreVersion = '3.6.1'
-    cordovaAndroidVersion = '10.1.1'
+    androidxJunitVersion = '1.3.0'
+    androidxEspressoCoreVersion = '3.7.0'
+    cordovaAndroidVersion = '14.0.1'
 }

web/capacitor.config.ts

@@ -1,30 +1,31 @@
-import type { CapacitorConfig } from '@capacitor/cli';
+import type { CapacitorConfig } from '@capacitor/cli'
 
 const config: CapacitorConfig = {
-    appId: 'com.handscream.taskview.app',
-    appName: 'TaskView',
-    webDir: 'dist',
+  appId: 'com.handscream.taskview.app',
+  appName: 'TaskView',
+  webDir: 'dist',
+  zoomEnabled: false,
+  android: {
     zoomEnabled: false,
-    android: {
-        zoomEnabled: false,
+  },
+  ios: {
+    zoomEnabled: false,
+    webContentsDebuggingEnabled: true,
+  },
+  server: {
+    hostname: 'app.taskview.tech',
+  },
+  plugins: {
+    CapacitorUpdater: {
+      autoUpdate: false,
     },
-    ios: {
-        zoomEnabled: false,
+    CapacitorCookies: {
+      enabled: true,
     },
-    server: {
-        hostname: 'app.taskview.tech',
+    CapacitorHttp: {
+      enabled: true,
     },
-    plugins: {
-        CapacitorUpdater: {
-            autoUpdate: false,
-        },
-        CapacitorCookies: {
-            enabled: true,
-        },
-        CapacitorHttp: {
-            enabled: true,
-        },
-    },
-};
+  },
+}
 
-export default config;
+export default config

web/e2e/auth.spec.ts

@@ -0,0 +1,27 @@
+import { test, expect } from '@playwright/test'
+import { TEST_USER } from './fixtures/auth'
+import { setEnglishLocale } from './test-helpers'
+
+test.describe('Login', () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto('/')
+    await setEnglishLocale(page)
+    await page.reload()
+  })
+
+  test('shows login page with welcome message', async ({ page }) => {
+    await expect(page.getByRole('heading', { level: 1 })).toContainText(/welcome/i)
+  })
+
+  test('user can login with password and reach dashboard', async ({ page }) => {
+    await page.getByRole('tab', { name: /password/i }).click()
+
+    await page.getByTestId('login-input').fill(TEST_USER.login)
+    await page.getByTestId('password-input').fill(TEST_USER.password)
+
+    await page.getByTestId('sign-in-button').click()
+
+    await expect(page).toHaveURL(/\/user/)
+    await expect(page.locator('body')).not.toContainText(/invalid|error/i)
+  })
+})

web/e2e/docker-compose.yml

@@ -0,0 +1,51 @@
+# E2E test stack: PostgreSQL + migration + API
+# Run from repo root: bash build-dockers.sh (builds images first)
+# Then: docker compose -f se/web-nuxt-ui/e2e/docker-compose.yml up -d
+#
+# API is exposed on 1401 so web-nuxt-ui (useTaskViewMainUrl) can connect.
+
+services:
+  db:
+    image: postgres:17
+    restart: unless-stopped
+    env_file:
+      - ../../dockers-check/.env.postgresql
+    volumes:
+      - ./e2e_pgdata:/var/lib/postgresql/data
+    ports:
+      - "5433:5432"
+    healthcheck:
+      test: ["CMD-SHELL", "pg_isready -U tvdbuser -d taskviewdb"]
+      interval: 5s
+      timeout: 5s
+      retries: 5
+
+  migration:
+    image: gimanhead/taskview-se-db-migration:latest
+    restart: "no"
+    depends_on:
+      db:
+        condition: service_healthy
+    env_file:
+      - ../../dockers-check/.env.taskview
+
+  api:
+    image: gimanhead/taskview-se-api-server:latest
+    restart: "no"
+    ports:
+      - "1401:1401"
+    depends_on:
+      db:
+        condition: service_healthy
+      migration:
+        condition: service_completed_successfully
+    env_file:
+      - ../../dockers-check/.env.taskview
+    volumes:
+      - ./e2e_logs:/usr/src/app/logs
+      - ./e2e_updates:/usr/src/app/updates
+
+volumes:
+  e2e_pgdata:
+  e2e_logs:
+  e2e_updates:

web/e2e/fixtures/auth.ts

@@ -0,0 +1,8 @@
+/**
+ * E2E auth fixtures. Credentials match DB seed from community migrations
+ * (user / user1!#Q from app_permissions.sql).
+ */
+export const TEST_USER = {
+  login: 'user',
+  password: 'user1!#Q',
+}

web/e2e/global-setup.ts

@@ -0,0 +1,25 @@
+import { execSync } from 'node:child_process'
+import { readFileSync, existsSync } from 'node:fs'
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+function loadEnv(dir: string) {
+  const envPath = path.join(dir, '.env')
+  if (!existsSync(envPath)) return
+  for (const line of readFileSync(envPath, 'utf-8').split('\n')) {
+    const m = line.match(/^([^#=]+)=(.*)$/)
+    if (m) process.env[m[1].trim()] = m[2].trim()
+  }
+}
+
+export default async function globalSetup() {
+  const e2eDir = path.dirname(fileURLToPath(import.meta.url))
+  const projectDir = path.join(e2eDir, '..')
+  loadEnv(projectDir)
+  const setupScript = path.join(e2eDir, 'docker-setup.sh')
+  execSync(`bash "${setupScript}"`, {
+    stdio: 'inherit',
+    cwd: path.join(e2eDir, '../../..'),
+    env: process.env,
+  })
+}

web/e2e/global-teardown.ts

@@ -0,0 +1,16 @@
+import { execSync } from 'node:child_process'
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+export default async function globalTeardown() {
+  const e2eDir = path.dirname(fileURLToPath(import.meta.url))
+  const teardownScript = path.join(e2eDir, 'docker-teardown.sh')
+  try {
+    execSync(`bash "${teardownScript}"`, {
+      stdio: 'inherit',
+      cwd: path.join(e2eDir, '../../..'),
+    })
+  } catch {
+    console.warn('[e2e] Teardown: some containers may have already been stopped')
+  }
+}

web/e2e/projects.spec.ts

@@ -0,0 +1,70 @@
+import { test, expect } from '@playwright/test'
+import {
+  setupAndLogin,
+  addProject,
+  openProjectMenu,
+  cleanupProjects,
+} from './test-helpers'
+
+test.describe('Projects', () => {
+  test.setTimeout(30_000)
+
+  test.beforeEach(async ({ page }) => {
+    await setupAndLogin(page)
+  })
+
+  test.afterAll(async ({ browser }) => {
+    const page = await browser.newPage()
+    await cleanupProjects(page)
+    await page.close()
+  })
+
+  test('user can add project', async ({ page }) => {
+    const projectName = `Test Project ${Date.now()}`
+    await addProject(page, projectName)
+  })
+
+  test('user can edit project', async ({ page }) => {
+    const projectName = `Edit Me ${Date.now()}`
+    await addProject(page, projectName)
+    const newName = `Edited ${Date.now()}`
+    await openProjectMenu(page, projectName)
+    await page.getByTestId('context-menu-edit').click()
+    await page.getByTestId('project-edit-name').fill(newName)
+    await page.getByTestId('project-edit-save').click()
+
+    await expect(page.getByText(newName).first()).toBeVisible({ timeout: 5000 })
+  })
+
+  test('user can delete project', async ({ page }) => {
+    const projectName = `Delete Me ${Date.now()}`
+    await addProject(page, projectName)
+    await page.waitForTimeout(1000)
+    await openProjectMenu(page, projectName)
+    await page.getByTestId('context-menu-delete').click({ force: true })
+    await page.getByTestId('confirm-delete-button').click()
+    await expect(page.getByText(projectName)).toHaveCount(0)
+  })
+
+  test('user can archive project', async ({ page }) => {
+    const projectName = `Archive Me ${Date.now()}`
+    await addProject(page, projectName)
+    await openProjectMenu(page, projectName)
+    await page.getByTestId('context-menu-move-to-archive').click()
+    await page.getByTestId('archive-list-collapsible').click()
+    await expect(page.getByTestId(`project-row-${projectName}`)).toBeVisible()
+  })
+
+  test('user can unarchive project', async ({ page }) => {
+    const projectName = `Unarchive Me ${Date.now()}`
+    await addProject(page, projectName)
+    await openProjectMenu(page, projectName)
+    await page.getByTestId('context-menu-move-to-archive').click()
+    await page.waitForTimeout(1000)
+    await page.getByTestId('archive-list-collapsible').click()
+    await page.getByTestId(`project-row-${projectName}`).first().waitFor({ state: 'visible', timeout: 5000 })
+    await openProjectMenu(page, projectName)
+    await page.getByTestId('context-menu-restore-from-archive').click({ force: true })
+    await expect(page.getByText(projectName).first()).toBeVisible({ timeout: 5000 })
+  })
+})

web/e2e/subtasks-duplication.spec.ts

@@ -0,0 +1,88 @@
+import { test, expect } from '@playwright/test'
+import {
+  setupAndLogin,
+  createProjectAndNavigate,
+  cleanupProjects,
+  addTaskFromList,
+  openTaskDetail,
+  addSubtask,
+  getSubtaskCount,
+  navigateToKanban,
+  navigateToGraph,
+} from './test-helpers'
+
+test.describe('Subtask duplication', () => {
+  test.setTimeout(60_000)
+
+  let projectName: string
+
+  test.beforeEach(async ({ page }) => {
+    await setupAndLogin(page)
+  })
+
+  test.afterAll(async ({ browser }) => {
+    const page = await browser.newPage()
+    await cleanupProjects(page)
+    await page.close()
+  })
+
+  test('adding subtask from task list does not duplicate', async ({ page }) => {
+    const project = await createProjectAndNavigate(page)
+    projectName = project.name
+
+    const taskName = `List Task ${Date.now()}`
+    await addTaskFromList(page, taskName)
+    await openTaskDetail(page, taskName)
+
+    const count = await addSubtask(page)
+    expect(count).toBe(1)
+  })
+
+  test('adding subtask from kanban does not duplicate', async ({ page }) => {
+    const project = await createProjectAndNavigate(page)
+    projectName = project.name
+
+    const taskName = `Kanban Task ${Date.now()}`
+    await addTaskFromList(page, taskName)
+
+    await navigateToKanban(page, projectName)
+
+    await expect(page.getByText(taskName).first()).toBeVisible({ timeout: 10000 })
+    await openTaskDetail(page, taskName)
+
+    const count = await addSubtask(page)
+    expect(count).toBe(1)
+  })
+
+  test('adding subtask from graph does not duplicate', async ({ page }) => {
+    const project = await createProjectAndNavigate(page)
+    projectName = project.name
+
+    const taskName = `Graph Task ${Date.now()}`
+    await addTaskFromList(page, taskName)
+
+    await navigateToGraph(page, projectName)
+
+    await expect(page.getByText(taskName).first()).toBeVisible({ timeout: 10000 })
+    await openTaskDetail(page, taskName)
+
+    const count = await addSubtask(page)
+    expect(count).toBe(1)
+  })
+
+  test('adding multiple subtasks does not duplicate any of them', async ({ page }) => {
+    const project = await createProjectAndNavigate(page)
+    projectName = project.name
+
+    const taskName = `Multi Subtask ${Date.now()}`
+    await addTaskFromList(page, taskName)
+    await openTaskDetail(page, taskName)
+
+    for (let i = 0; i < 3; i++) {
+      await addSubtask(page)
+    }
+
+    const count = await getSubtaskCount(page)
+    expect(count).toBe(3)
+  })
+})

web/e2e/test-helpers.ts

@@ -0,0 +1,160 @@
+import { expect, type Page } from '@playwright/test'
+import { TEST_USER } from './fixtures/auth'
+
+const API_URL = 'http://localhost:1401'
+
+// ── Cleanup ──
+
+const createdProjectIds: number[] = []
+
+export function trackProjectId(id: number | null) {
+  if (id) createdProjectIds.push(id)
+}
+
+/**
+ * Deletes all tracked projects via API. Call in afterAll.
+ * Authenticates via API login to get a JWT token (page.request alone has no Bearer header).
+ */
+export async function cleanupProjects(page: Page) {
+  if (createdProjectIds.length === 0) return
+
+  const loginResponse = await page.request.post(`${API_URL}/module/auth/login`, {
+    form: { login: TEST_USER.login, password: TEST_USER.password },
+  })
+  const loginData = await loginResponse.json()
+  const token = loginData.access
+  if (!token) {
+    console.error('Cleanup: failed to get auth token, skipping project deletion')
+    return
+  }
+
+  for (const id of createdProjectIds) {
+    try {
+      await page.request.delete(`${API_URL}/module/goals`, {
+        data: { goalId: id },
+        headers: { Authorization: `Bearer ${token}` },
+        timeout: 5000,
+      })
+    } catch {
+      console.error(`Failed to delete project ${id} via API`)
+    }
+  }
+  createdProjectIds.length = 0
+}
+
+// ── Locale ──
+
+/**
+ * Sets the app locale to English via localStorage before page load.
+ * Must be called after page.goto() so localStorage is available for the domain,
+ * then reload to apply.
+ */
+export async function setEnglishLocale(page: Page) {
+  await page.evaluate(() => {
+    localStorage.setItem('store_task_view.task_view.locale', 'en')
+  })
+}
+
+// ── Auth ──
+
+export async function login(page: Page) {
+  await page.getByRole('tab', { name: /password/i }).click()
+  await page.getByTestId('login-input').fill(TEST_USER.login)
+  await page.getByTestId('password-input').fill(TEST_USER.password)
+  await page.getByTestId('sign-in-button').click()
+}
+
+/**
+ * Navigates to `/`, sets English locale, reloads, and logs in.
+ */
+export async function setupAndLogin(page: Page) {
+  await page.goto('/')
+  await setEnglishLocale(page)
+  await page.reload()
+  await login(page)
+}
+
+// ── Projects ──
+
+export async function addProject(page: Page, name: string): Promise<number | null> {
+  const urlBefore = page.url()
+  const input = page.getByTestId('project-add-input').first()
+  await input.waitFor({ state: 'visible', timeout: 15000 })
+  await input.fill(name)
+  await input.press('Enter')
+  await expect(page.getByText(name).first()).toBeVisible({ timeout: 10000 })
+  await page.waitForFunction(
+    (prev) => location.href !== prev && /\/user\/\d+\//.test(location.href),
+    urlBefore,
+    { timeout: 10000 },
+  )
+  const id = extractProjectId(page.url())
+  trackProjectId(id)
+  return id
+}
+
+/**
+ * Creates a project, waits for auto-navigation, and tracks the ID for cleanup.
+ */
+export async function createProjectAndNavigate(page: Page, prefix = 'Test') {
+  const projectName = `${prefix} ${Date.now()}`
+  const id = await addProject(page, projectName)
+  await expect(page.getByTestId('task-search-add-input')).toBeVisible({ timeout: 10000 })
+  return { name: projectName, id }
+}
+
+export function extractProjectId(url: string): number | null {
+  const match = url.match(/\/user\/(\d+)\//)
+  return match ? Number(match[1]) : null
+}
+
+export async function openProjectMenu(page: Page, projectName: string) {
+  const row = page.getByTestId(`project-row-${projectName}`)
+  await row.first().waitFor({ state: 'visible', timeout: 10000 })
+  await row.first().getByTestId('project-menu-trigger').click({ force: true })
+}
+
+// ── Navigation ──
+
+export async function navigateToKanban(page: Page, projectName: string) {
+  await openProjectMenu(page, projectName)
+  await page.getByRole('link', { name: /kanban/i }).click()
+  await page.waitForURL(/\/kanban/, { timeout: 10000 })
+}
+
+export async function navigateToGraph(page: Page, projectName: string) {
+  await openProjectMenu(page, projectName)
+  await page.getByRole('link', { name: /graph/i }).click()
+  await page.waitForURL(/\/graph/, { timeout: 10000 })
+}
+
+// ── Tasks ──
+
+export async function addTaskFromList(page: Page, taskName: string) {
+  const input = page.getByTestId('task-search-add-input')
+  await input.waitFor({ state: 'visible', timeout: 10000 })
+  await input.fill(taskName)
+  await input.press('Enter')
+  await expect(page.getByText(taskName).first()).toBeVisible({ timeout: 10000 })
+}
+
+export async function openTaskDetail(page: Page, taskName: string) {
+  await page.getByText(taskName).first().click()
+  await expect(page.getByTestId('add-subtask-button')).toBeVisible({ timeout: 10000 })
+}
+
+// ── Subtasks ──
+
+/**
+ * Clicks "Add subtask" and returns the total count of subtask items.
+ */
+export async function addSubtask(page: Page) {
+  await page.getByTestId('add-subtask-button').click()
+  await expect(page.getByTestId('subtasks-list')).toBeVisible({ timeout: 10000 })
+  await page.waitForTimeout(500)
+  return page.locator('[data-testid^="subtask-item-"]').count()
+}
+
+export function getSubtaskCount(page: Page) {
+  return page.locator('[data-testid^="subtask-item-"]').count()
+}

web/eslint.config.ts

@@ -0,0 +1,103 @@
+import js from '@eslint/js'
+import eslintPluginVue from 'eslint-plugin-vue'
+import ts from 'typescript-eslint'
+import { fileURLToPath } from 'node:url'
+
+export default ts.config(
+  js.configs.recommended,
+  ...ts.configs.recommended,
+  ...eslintPluginVue.configs['flat/recommended'],
+  {
+    files: ['**/*.ts', '**/*.js'],
+    languageOptions: {
+      parserOptions: {
+        tsconfigRootDir: fileURLToPath(new URL('.', import.meta.url)),
+      },
+    },
+  },
+  {
+    files: ['*.vue', '**/*.vue'],
+    languageOptions: {
+      parserOptions: {
+        parser: '@typescript-eslint/parser',
+        tsconfigRootDir: fileURLToPath(new URL('.', import.meta.url)),
+      },
+    },
+    rules: {
+      'vue/multi-word-component-names': 'off',
+      'no-undef': 'off',
+      '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
+
+      // Formatting rules
+      'vue/script-indent': ['error', 2, { baseIndent: 0 }],
+      'vue/html-indent': ['error', 2],
+      'vue/max-attributes-per-line': [
+        'error',
+        {
+          singleline: 1,
+          multiline: 1,
+        },
+      ],
+      'vue/first-attribute-linebreak': [
+        'error',
+        {
+          singleline: 'ignore',
+          multiline: 'below',
+        },
+      ],
+      'vue/html-closing-bracket-newline': [
+        'error',
+        {
+          singleline: 'never',
+          multiline: 'always',
+        },
+      ],
+      'vue/html-self-closing': [
+        'error',
+        {
+          html: {
+            void: 'always',
+            normal: 'always',
+            component: 'always',
+          },
+          svg: 'always',
+          math: 'always',
+        },
+      ],
+      'vue/attribute-hyphenation': ['error', 'always'],
+      'vue/v-bind-style': ['error', 'shorthand'],
+      'vue/v-on-style': ['error', 'shorthand'],
+      'vue/v-slot-style': ['error', 'shorthand'],
+    },
+  },
+  {
+    files: ['**/*.ts', '**/*.js', '**/*.vue'],
+    rules: {
+      semi: ['error', 'never'],
+      quotes: ['error', 'single'],
+      'comma-dangle': ['error', 'always-multiline'],
+      'keyword-spacing': ['error', { before: true, after: true }],
+      'space-before-blocks': ['error', 'always'],
+      'space-before-function-paren': ['error', { anonymous: 'always', named: 'never', asyncArrow: 'always' }],
+      'space-infix-ops': 'error',
+      'space-in-parens': ['error', 'never'],
+      'object-curly-spacing': ['error', 'always'],
+      'array-bracket-spacing': ['error', 'never'],
+      'comma-spacing': ['error', { before: false, after: true }],
+      'key-spacing': ['error', { beforeColon: false, afterColon: true }],
+      'arrow-spacing': ['error', { before: true, after: true }],
+    },
+  },
+  {
+    files: ['**/*.ts', '**/*.js'],
+    rules: {
+      indent: ['error', 2],
+    },
+  },
+  {
+    files: ['**/*.vue'],
+    rules: {
+      indent: 'off',
+    },
+  },
+)

web/index.html

@@ -1,14 +1,27 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-    <head>
-        <meta charset="UTF-8" />
-        <link rel="icon" href="/tv-logo.svg" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
-        <title>Task View</title>
-    </head>
 
-    <body>
-        <div id="app"></div>
-        <script type="module" src="/src/main.ts"></script>
-    </body>
-</html>
+<head>
+  <meta charset="UTF-8" />
+  <link rel="icon"
+        type="image/svg+xml"
+        href="/logo.svg" />
+  <meta name="viewport"
+        content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
+  <link rel="preconnect"
+        href="https://fonts.bunny.net">
+  <link href="https://fonts.bunny.net/css?family=public-sans:400,500,600,700"
+        rel="stylesheet" />
+  <title>TaskView</title>
+  <meta name="description"
+        content="TaskView is a self-hosted project and task management platform focused on clarity, ownership, and control.">
+</head>
+
+<body>
+  <div id="app"
+       class="isolate"></div>
+  <script type="module"
+          src="/src/main.ts"></script>
+</body>
+
+</html>

web/ios/App/App.xcodeproj/project.pbxproj

@@ -3,37 +3,31 @@
 	archiveVersion = 1;
 	classes = {
 	};
-	objectVersion = 48;
+	objectVersion = 60;
 	objects = {
 
 /* Begin PBXBuildFile section */
 		2FAD9763203C412B000D30F8 /* config.xml in Resources */ = {isa = PBXBuildFile; fileRef = 2FAD9762203C412B000D30F8 /* config.xml */; };
+		4D22ABE92AF431CB00220026 /* CapApp-SPM in Frameworks */ = {isa = PBXBuildFile; productRef = 4D22ABE82AF431CB00220026 /* CapApp-SPM */; };
 		50379B232058CBB4000EE86E /* capacitor.config.json in Resources */ = {isa = PBXBuildFile; fileRef = 50379B222058CBB4000EE86E /* capacitor.config.json */; };
 		504EC3081FED79650016851F /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 504EC3071FED79650016851F /* AppDelegate.swift */; };
 		504EC30D1FED79650016851F /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 504EC30B1FED79650016851F /* Main.storyboard */; };
 		504EC30F1FED79650016851F /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 504EC30E1FED79650016851F /* Assets.xcassets */; };
 		504EC3121FED79650016851F /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 504EC3101FED79650016851F /* LaunchScreen.storyboard */; };
 		50B271D11FEDC1A000F3C39B /* public in Resources */ = {isa = PBXBuildFile; fileRef = 50B271D01FEDC1A000F3C39B /* public */; };
-		A75AC5A184BA226F87D9DFB4 /* Pods_TaskView.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = C33826060E12180E2E6AE45B /* Pods_TaskView.framework */; };
-		AA2DDEAF2BD5EE2800137350 /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = AA2DDEAE2BD5EE2800137350 /* PrivacyInfo.xcprivacy */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXFileReference section */
 		2FAD9762203C412B000D30F8 /* config.xml */ = {isa = PBXFileReference; lastKnownFileType = text.xml; path = config.xml; sourceTree = "<group>"; };
-		3DDB5660BE7C0283C0A61E6B /* Pods-TaskView.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-TaskView.release.xcconfig"; path = "Pods/Target Support Files/Pods-TaskView/Pods-TaskView.release.xcconfig"; sourceTree = "<group>"; };
-		4ED8FB2BBB1F064473F2BF99 /* Pods-TaskView.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-TaskView.debug.xcconfig"; path = "Pods/Target Support Files/Pods-TaskView/Pods-TaskView.debug.xcconfig"; sourceTree = "<group>"; };
 		50379B222058CBB4000EE86E /* capacitor.config.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = capacitor.config.json; sourceTree = "<group>"; };
-		504EC3041FED79650016851F /* TaskView.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = TaskView.app; sourceTree = BUILT_PRODUCTS_DIR; };
+		504EC3041FED79650016851F /* App.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = App.app; sourceTree = BUILT_PRODUCTS_DIR; };
 		504EC3071FED79650016851F /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
 		504EC30C1FED79650016851F /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = "<group>"; };
 		504EC30E1FED79650016851F /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
 		504EC3111FED79650016851F /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
 		504EC3131FED79650016851F /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		50B271D01FEDC1A000F3C39B /* public */ = {isa = PBXFileReference; lastKnownFileType = folder; path = public; sourceTree = "<group>"; };
-		AA2DDEAE2BD5EE2800137350 /* PrivacyInfo.xcprivacy */ = {isa = PBXFileReference; lastKnownFileType = text.xml; path = PrivacyInfo.xcprivacy; sourceTree = "<group>"; };
-		AF51FD2D460BCFE21FA515B2 /* Pods-App.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-App.release.xcconfig"; path = "Pods/Target Support Files/Pods-App/Pods-App.release.xcconfig"; sourceTree = "<group>"; };
-		C33826060E12180E2E6AE45B /* Pods_TaskView.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = Pods_TaskView.framework; sourceTree = BUILT_PRODUCTS_DIR; };
-		FC68EB0AF532CFC21C3344DD /* Pods-App.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-App.debug.xcconfig"; path = "Pods/Target Support Files/Pods-App/Pods-App.debug.xcconfig"; sourceTree = "<group>"; };
+		958DCC722DB07C7200EA8C5F /* debug.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; name = debug.xcconfig; path = ../debug.xcconfig; sourceTree = SOURCE_ROOT; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -41,36 +35,26 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				A75AC5A184BA226F87D9DFB4 /* Pods_TaskView.framework in Frameworks */,
+				4D22ABE92AF431CB00220026 /* CapApp-SPM in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
 /* End PBXFrameworksBuildPhase section */
 
 /* Begin PBXGroup section */
-		27E2DDA53C4D2A4D1A88CE4A /* Frameworks */ = {
-			isa = PBXGroup;
-			children = (
-				C33826060E12180E2E6AE45B /* Pods_TaskView.framework */,
-			);
-			name = Frameworks;
-			sourceTree = "<group>";
-		};
 		504EC2FB1FED79650016851F = {
 			isa = PBXGroup;
 			children = (
-				AA2DDEAE2BD5EE2800137350 /* PrivacyInfo.xcprivacy */,
+				958DCC722DB07C7200EA8C5F /* debug.xcconfig */,
 				504EC3061FED79650016851F /* App */,
 				504EC3051FED79650016851F /* Products */,
-				7F8756D8B27F46E3366F6CEA /* Pods */,
-				27E2DDA53C4D2A4D1A88CE4A /* Frameworks */,
 			);
 			sourceTree = "<group>";
 		};
 		504EC3051FED79650016851F /* Products */ = {
 			isa = PBXGroup;
 			children = (
-				504EC3041FED79650016851F /* TaskView.app */,
+				504EC3041FED79650016851F /* App.app */,
 			);
 			name = Products;
 			sourceTree = "<group>";
@@ -90,37 +74,27 @@
 			path = App;
 			sourceTree = "<group>";
 		};
-		7F8756D8B27F46E3366F6CEA /* Pods */ = {
-			isa = PBXGroup;
-			children = (
-				FC68EB0AF532CFC21C3344DD /* Pods-App.debug.xcconfig */,
-				AF51FD2D460BCFE21FA515B2 /* Pods-App.release.xcconfig */,
-				4ED8FB2BBB1F064473F2BF99 /* Pods-TaskView.debug.xcconfig */,
-				3DDB5660BE7C0283C0A61E6B /* Pods-TaskView.release.xcconfig */,
-			);
-			name = Pods;
-			sourceTree = "<group>";
-		};
 /* End PBXGroup section */
 
 /* Begin PBXNativeTarget section */
-		504EC3031FED79650016851F /* TaskView */ = {
+		504EC3031FED79650016851F /* App */ = {
 			isa = PBXNativeTarget;
-			buildConfigurationList = 504EC3161FED79650016851F /* Build configuration list for PBXNativeTarget "TaskView" */;
+			buildConfigurationList = 504EC3161FED79650016851F /* Build configuration list for PBXNativeTarget "App" */;
 			buildPhases = (
-				6634F4EFEBD30273BCE97C65 /* [CP] Check Pods Manifest.lock */,
 				504EC3001FED79650016851F /* Sources */,
 				504EC3011FED79650016851F /* Frameworks */,
 				504EC3021FED79650016851F /* Resources */,
-				9592DBEFFC6D2A0C8D5DEB22 /* [CP] Embed Pods Frameworks */,
 			);
 			buildRules = (
 			);
 			dependencies = (
 			);
-			name = TaskView;
+			name = App;
+			packageProductDependencies = (
+				4D22ABE82AF431CB00220026 /* CapApp-SPM */,
+			);
 			productName = App;
-			productReference = 504EC3041FED79650016851F /* TaskView.app */;
+			productReference = 504EC3041FED79650016851F /* App.app */;
 			productType = "com.apple.product-type.application";
 		};
 /* End PBXNativeTarget section */
@@ -129,8 +103,8 @@
 		504EC2FC1FED79650016851F /* Project object */ = {
 			isa = PBXProject;
 			attributes = {
-				LastSwiftUpdateCheck = 920;
-				LastUpgradeCheck = 920;
+				LastSwiftUpdateCheck = 0920;
+				LastUpgradeCheck = 0920;
 				TargetAttributes = {
 					504EC3031FED79650016851F = {
 						CreatedOnToolsVersion = 9.2;
@@ -148,11 +122,14 @@
 				Base,
 			);
 			mainGroup = 504EC2FB1FED79650016851F;
+			packageReferences = (
+				D4C12C0A2AAA248700AAC8A2 /* XCLocalSwiftPackageReference "CapApp-SPM" */,
+			);
 			productRefGroup = 504EC3051FED79650016851F /* Products */;
 			projectDirPath = "";
 			projectRoot = "";
 			targets = (
-				504EC3031FED79650016851F /* TaskView */,
+				504EC3031FED79650016851F /* App */,
 			);
 		};
 /* End PBXProject section */
@@ -163,7 +140,6 @@
 			buildActionMask = 2147483647;
 			files = (
 				504EC3121FED79650016851F /* LaunchScreen.storyboard in Resources */,
-				AA2DDEAF2BD5EE2800137350 /* PrivacyInfo.xcprivacy in Resources */,
 				50B271D11FEDC1A000F3C39B /* public in Resources */,
 				504EC30F1FED79650016851F /* Assets.xcassets in Resources */,
 				50379B232058CBB4000EE86E /* capacitor.config.json in Resources */,
@@ -174,42 +150,6 @@
 		};
 /* End PBXResourcesBuildPhase section */
 
-/* Begin PBXShellScriptBuildPhase section */
-		6634F4EFEBD30273BCE97C65 /* [CP] Check Pods Manifest.lock */ = {
-			isa = PBXShellScriptBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputPaths = (
-				"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
-				"${PODS_ROOT}/Manifest.lock",
-			);
-			name = "[CP] Check Pods Manifest.lock";
-			outputPaths = (
-				"$(DERIVED_FILE_DIR)/Pods-TaskView-checkManifestLockResult.txt",
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
-			showEnvVarsInLog = 0;
-		};
-		9592DBEFFC6D2A0C8D5DEB22 /* [CP] Embed Pods Frameworks */ = {
-			isa = PBXShellScriptBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputPaths = (
-			);
-			name = "[CP] Embed Pods Frameworks";
-			outputPaths = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-TaskView/Pods-TaskView-frameworks.sh\"\n";
-			showEnvVarsInLog = 0;
-		};
-/* End PBXShellScriptBuildPhase section */
-
 /* Begin PBXSourcesBuildPhase section */
 		504EC3001FED79650016851F /* Sources */ = {
 			isa = PBXSourcesBuildPhase;
@@ -243,6 +183,7 @@
 /* Begin XCBuildConfiguration section */
 		504EC3141FED79650016851F /* Debug */ = {
 			isa = XCBuildConfiguration;
+			baseConfigurationReference = 958DCC722DB07C7200EA8C5F /* debug.xcconfig */;
 			buildSettings = {
 				ALWAYS_SEARCH_USER_PATHS = NO;
 				CLANG_ANALYZER_NONNULL = YES;
@@ -289,7 +230,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 13.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
 				MTL_ENABLE_DEBUG_INFO = YES;
 				ONLY_ACTIVE_ARCH = YES;
 				SDKROOT = iphoneos;
@@ -340,28 +281,30 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 13.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
 				MTL_ENABLE_DEBUG_INFO = NO;
 				SDKROOT = iphoneos;
-				SWIFT_OPTIMIZATION_LEVEL = "-Owholemodule";
+				SWIFT_COMPILATION_MODE = wholemodule;
+				SWIFT_OPTIMIZATION_LEVEL = "-O";
 				VALIDATE_PRODUCT = YES;
 			};
 			name = Release;
 		};
 		504EC3171FED79650016851F /* Debug */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 4ED8FB2BBB1F064473F2BF99 /* Pods-TaskView.debug.xcconfig */;
+			baseConfigurationReference = 958DCC722DB07C7200EA8C5F /* debug.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 1.19.6;
+				CURRENT_PROJECT_VERSION = 1.20.1;
 				DEVELOPMENT_TEAM = H2W2SG48JT;
 				INFOPLIST_FILE = App/Info.plist;
-				INFOPLIST_KEY_CFBundleDisplayName = TaskView;
-				INFOPLIST_KEY_LSApplicationCategoryType = "public.app-category.productivity";
-				IPHONEOS_DEPLOYMENT_TARGET = 14.0;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.19.6;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
+				MARKETING_VERSION = 1.20.1;
 				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
 				PRODUCT_BUNDLE_IDENTIFIER = com.handscream.taskview.app;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -373,18 +316,18 @@
 		};
 		504EC3181FED79650016851F /* Release */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 3DDB5660BE7C0283C0A61E6B /* Pods-TaskView.release.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 1.19.6;
+				CURRENT_PROJECT_VERSION = 1.20.1;
 				DEVELOPMENT_TEAM = H2W2SG48JT;
 				INFOPLIST_FILE = App/Info.plist;
-				INFOPLIST_KEY_CFBundleDisplayName = TaskView;
-				INFOPLIST_KEY_LSApplicationCategoryType = "public.app-category.productivity";
-				IPHONEOS_DEPLOYMENT_TARGET = 14.0;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.19.6;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
+				MARKETING_VERSION = 1.20.1;
 				PRODUCT_BUNDLE_IDENTIFIER = com.handscream.taskview.app;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";
@@ -405,7 +348,7 @@
 			defaultConfigurationIsVisible = 0;
 			defaultConfigurationName = Release;
 		};
-		504EC3161FED79650016851F /* Build configuration list for PBXNativeTarget "TaskView" */ = {
+		504EC3161FED79650016851F /* Build configuration list for PBXNativeTarget "App" */ = {
 			isa = XCConfigurationList;
 			buildConfigurations = (
 				504EC3171FED79650016851F /* Debug */,
@@ -415,6 +358,21 @@
 			defaultConfigurationName = Release;
 		};
 /* End XCConfigurationList section */
+
+/* Begin XCLocalSwiftPackageReference section */
+		D4C12C0A2AAA248700AAC8A2 /* XCLocalSwiftPackageReference "CapApp-SPM" */ = {
+			isa = XCLocalSwiftPackageReference;
+			relativePath = "CapApp-SPM";
+		};
+/* End XCLocalSwiftPackageReference section */
+
+/* Begin XCSwiftPackageProductDependency section */
+		4D22ABE82AF431CB00220026 /* CapApp-SPM */ = {
+			isa = XCSwiftPackageProductDependency;
+			package = D4C12C0A2AAA248700AAC8A2 /* XCLocalSwiftPackageReference "CapApp-SPM" */;
+			productName = "CapApp-SPM";
+		};
+/* End XCSwiftPackageProductDependency section */
 	};
 	rootObject = 504EC2FC1FED79650016851F /* Project object */;
 }

web/ios/App/App.xcodeproj/project.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -0,0 +1,51 @@
+{
+  "originHash" : "e5bfee72a3975177edbeb9593e2d4a7624097d5319fbcc2894685c2c76545af8",
+  "pins" : [
+    {
+      "identity" : "alamofire",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/Alamofire/Alamofire.git",
+      "state" : {
+        "revision" : "3f99050e75bbc6fe71fc323adabb039756680016",
+        "version" : "5.11.1"
+      }
+    },
+    {
+      "identity" : "bigint",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/attaswift/BigInt.git",
+      "state" : {
+        "revision" : "e07e00fa1fd435143a2dcf8b7eec9a7710b2fdfe",
+        "version" : "5.7.0"
+      }
+    },
+    {
+      "identity" : "capacitor-swift-pm",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/ionic-team/capacitor-swift-pm.git",
+      "state" : {
+        "revision" : "1f324fe7bdbdc8c5cc28bea48a231545a8c2e823",
+        "version" : "8.1.0"
+      }
+    },
+    {
+      "identity" : "version",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/mrackwitz/Version.git",
+      "state" : {
+        "revision" : "fd4b0eb5756aa7f1c33977fb626cf37d2140a3a0",
+        "version" : "0.8.0"
+      }
+    },
+    {
+      "identity" : "zipfoundation",
+      "kind" : "remoteSourceControl",
+      "location" : "https://github.com/weichsel/ZIPFoundation.git",
+      "state" : {
+        "revision" : "22787ffb59de99e5dc1fbfe80b19c97a904ad48d",
+        "version" : "0.9.20"
+      }
+    }
+  ],
+  "version" : 3
+}

web/ios/App/App/Base.lproj/LaunchScreen.storyboard

@@ -1,9 +1,9 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="32700.99.1234" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="17132" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
     <device id="retina4_7" orientation="portrait" appearance="light"/>
     <dependencies>
         <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22684"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="17105"/>
         <capability name="System colors in document resources" minToolsVersion="11.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
@@ -24,7 +24,7 @@
         </scene>
     </scenes>
     <resources>
-        <image name="Splash" width="1639" height="1639"/>
+        <image name="Splash" width="1366" height="1366"/>
         <systemColor name="systemBackgroundColor">
             <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
         </systemColor>

web/ios/App/CapApp-SPM/.gitignore

@@ -0,0 +1,9 @@
+.DS_Store
+/.build
+/Packages
+/*.xcodeproj
+xcuserdata/
+DerivedData/
+.swiftpm/config/registries.json
+.swiftpm/xcode/package.xcworkspace/contents.xcworkspacedata
+.netrc

web/ios/App/CapApp-SPM/Package.swift

@@ -0,0 +1,37 @@
+// swift-tools-version: 5.9
+import PackageDescription
+
+// DO NOT MODIFY THIS FILE - managed by Capacitor CLI commands
+let package = Package(
+    name: "CapApp-SPM",
+    platforms: [.iOS(.v15)],
+    products: [
+        .library(
+            name: "CapApp-SPM",
+            targets: ["CapApp-SPM"])
+    ],
+    dependencies: [
+        .package(url: "https://github.com/ionic-team/capacitor-swift-pm.git", exact: "8.1.0"),
+        .package(name: "CapacitorApp", path: "../../../../node_modules/.pnpm/@capacitor+app@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/app"),
+        .package(name: "CapacitorBrowser", path: "../../../../node_modules/.pnpm/@capacitor+browser@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/browser"),
+        .package(name: "CapacitorDevice", path: "../../../../node_modules/.pnpm/@capacitor+device@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/device"),
+        .package(name: "CapacitorPreferences", path: "../../../../node_modules/.pnpm/@capacitor+preferences@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/preferences"),
+        .package(name: "CapacitorSplashScreen", path: "../../../../node_modules/.pnpm/@capacitor+splash-screen@8.0.1_@capacitor+core@8.1.0/node_modules/@capacitor/splash-screen"),
+        .package(name: "CapgoCapacitorUpdater", path: "../../../../node_modules/.pnpm/@capgo+capacitor-updater@8.43.8_@capacitor+core@8.1.0/node_modules/@capgo/capacitor-updater")
+    ],
+    targets: [
+        .target(
+            name: "CapApp-SPM",
+            dependencies: [
+                .product(name: "Capacitor", package: "capacitor-swift-pm"),
+                .product(name: "Cordova", package: "capacitor-swift-pm"),
+                .product(name: "CapacitorApp", package: "CapacitorApp"),
+                .product(name: "CapacitorBrowser", package: "CapacitorBrowser"),
+                .product(name: "CapacitorDevice", package: "CapacitorDevice"),
+                .product(name: "CapacitorPreferences", package: "CapacitorPreferences"),
+                .product(name: "CapacitorSplashScreen", package: "CapacitorSplashScreen"),
+                .product(name: "CapgoCapacitorUpdater", package: "CapgoCapacitorUpdater")
+            ]
+        )
+    ]
+)

web/ios/App/CapApp-SPM/README.md

@@ -0,0 +1,5 @@
+# CapApp-SPM
+
+This SPM is used to host SPM dependencies for you Capacitor project
+
+Do not modify the contents of it or there may be unintended consequences.

web/ios/App/CapApp-SPM/Sources/CapApp-SPM/CapApp-SPM.swift

@@ -0,0 +1 @@
+public let isCapacitorApp = true

web/ios/debug.xcconfig

@@ -0,0 +1 @@
+CAPACITOR_DEBUG = true

web/package.json

@@ -1,99 +1,85 @@
 {
-  "name": "taskview-ce-webapp",
-  "version": "1.19.6",
+  "name": "web-nuxt-ui",
   "private": true,
+  "type": "module",
+  "version": "1.20.7",
   "scripts": {
     "dev": "vite",
-    "build:dev": "BRANCH_MODE=dev pnpm run build",
-    "build": "run-p type-check build-only",
-    "preview": "vite preview",
-    "test:unit": "vitest --environment jsdom --root src/",
-    "test:e2e": "start-server-and-test preview :4173 'cypress run --e2e'",
-    "test:e2e:dev": "start-server-and-test 'vite dev --port 4173' :4173 'cypress open --e2e'",
+    "build": "pnpm run typecheck && vite build",
     "build-only": "vite build",
-    "type-check": "vue-tsc --noEmit --project tsconfig.json",
-    "lint": "eslint . --config eslint.config.mjs --fix",
-    "lint:biome": "biome lint .",
-    "format": "biome format --write .",
-    "check": "biome check --write ."
+    "preview": "vite preview",
+    "lint": "eslint src",
+    "lint:fix": "eslint src --fix",
+    "format": "eslint src --fix",
+    "typecheck": "vue-tsc -p ./tsconfig.app.json",
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui",
+    "test:e2e:headed": "playwright test --headed",
+    "test:e2e:install": "playwright install chromium",
+    "test:e2e:skip-build": "SKIP_BUILD=1 playwright test"
   },
   "dependencies": {
-    "@capacitor/android": "^7.0.0",
-    "@capacitor/app": "7.0.1",
-    "@capacitor/browser": "^7.0.3",
-    "@capacitor/core": "^7.0.0",
-    "@capacitor/device": "7.0.1",
-    "@capacitor/ios": "^7.0.0",
-    "@capacitor/preferences": "7.0.1",
-    "@capacitor/splash-screen": "^7.0.1",
-    "@capgo/capacitor-updater": "^7.7.7",
+    "@capacitor/android": "^8.1.0",
+    "@capacitor/app": "8.0.1",
+    "@capacitor/browser": "^8.0.1",
+    "@capacitor/core": "^8.1.0",
+    "@capacitor/device": "8.0.1",
+    "@capacitor/ios": "^8.1.0",
+    "@capacitor/preferences": "8.0.1",
+    "@capacitor/splash-screen": "^8.0.1",
+    "@capgo/capacitor-updater": "^8.43.2",
     "@dagrejs/dagre": "^1.1.5",
-    "@tiptap/extension-color": "^3.0.0",
-    "@tiptap/extension-link": "^3.0.0",
-    "@tiptap/extension-list-item": "^3.0.0",
-    "@tiptap/extension-placeholder": "^3.0.0",
-    "@tiptap/extension-text-style": "^3.0.0",
-    "@tiptap/pm": "^3.0.0",
-    "@tiptap/starter-kit": "^3.0.0",
-    "@tiptap/vue-3": "^3.0.0",
-    "@typescript-eslint/eslint-plugin": "^8.24.1",
-    "@typescript-eslint/parser": "^8.24.1",
+    "@iconify-json/carbon": "^1.2.18",
+    "@iconify-json/lucide": "^1.2.90",
+    "@iconify-json/mdi": "^1.2.3",
+    "@iconify/vue": "^5.0.0",
+    "@internationalized/date": "^3.10.1",
+    "@nuxt/ui": "^4.4.0",
+    "@tanstack/table-core": "^8.21.3",
+    "@tiptap/core": "^3.20.0",
+    "@tiptap/extension-drag-handle-vue-3": "^3.20.0",
+    "@tiptap/extension-text-align": "^3.20.0",
+    "@tiptap/extension-underline": "^3.20.0",
+    "@tiptap/pm": "^3.20.0",
+    "@tiptap/starter-kit": "^3.20.0",
+    "@tiptap/vue-3": "^3.20.0",
+    "@types/qs": "^6.14.0",
+    "@unovis/ts": "^1.6.2",
+    "@unovis/vue": "^1.6.2",
     "@vue-flow/background": "^1.3.2",
     "@vue-flow/controls": "^1.1.3",
-    "@vue-flow/core": "^1.46.4",
+    "@vue-flow/core": "^1.48.1",
     "@vue-flow/minimap": "^1.5.4",
     "@vue-flow/node-resizer": "^1.5.0",
     "@vue-flow/node-toolbar": "^1.1.1",
-    "@vue/eslint-config-typescript": "^14.4.0",
-    "@vueuse/components": "^10.9.0",
-    "@vueuse/core": "^10.9.0",
-    "echarts": "^5.5.1",
-    "globals": "^15.15.0",
-    "motion-v": "^1.1.0-alpha.1",
-    "pinia": "^2.0.28",
+    "@vueuse/core": "^14.1.0",
+    "arktype": "2.1.20",
+    "axios": "^1.13.4",
+    "date-fns": "^4.1.0",
+    "pinia": "^2.3.1",
+    "qs": "^6.14.1",
+    "scule": "^1.3.0",
+    "tailwindcss": "^4.1.18",
     "taskview-api": "workspace:^",
-    "vue": "^3.2.45",
-    "vue-router": "4.3.2",
-    "vuedraggable": "^4.1.0"
+    "vue": "^3.5.27",
+    "vue-i18n": "^11.2.8",
+    "vue-router": "^4.6.4",
+    "vuedraggable": "^4.1.0",
+    "zod": "^4.3.5"
   },
   "devDependencies": {
-    "@biomejs/biome": "^2.3.8",
     "@capacitor/assets": "^3.0.5",
-    "@capacitor/cli": "^7.0.0",
-    "@date-io/date-fns": "^3.2.0",
-    "@mdi/js": "^7.1.96",
-    "@rushstack/eslint-patch": "^1.1.4",
-    "@types/jsdom": "^20.0.1",
-    "@types/node": "^18.19.119",
-    "@types/qs": "^6.9.7",
-    "@vitejs/plugin-vue": "^4.0.0",
-    "@vitejs/plugin-vue-jsx": "^3.0.0",
-    "@vue/eslint-config-prettier": "^7.0.0",
-    "@vue/test-utils": "^2.2.6",
-    "@vue/tsconfig": "0.7.0",
-    "autoprefixer": "^10.4.20",
-    "axios": "^1.2.3",
-    "check-password-strength": "^2.0.7",
-    "eslint": "9.20.1",
-    "eslint-plugin-vue": "^9.3.0",
-    "jsdom": "^20.0.3",
-    "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.49",
-    "prettier": "^2.7.1",
-    "qs": "^6.11.0",
-    "sass": "^1.69.7",
-    "sass-loader": "^13.3.3",
-    "start-server-and-test": "^1.15.2",
-    "tailwindcss": "^3.4.16",
-    "typescript": "^5.7.3",
-    "typescript-eslint": "^8.22.0",
-    "vite": "^4.0.0",
-    "vitest": "^0.25.6",
-    "vue-i18n": "11.1.10",
-    "vue-tsc": "3.0.3",
-    "vuetify": "3.7.9"
+    "@capacitor/cli": "^8.1.0",
+    "@playwright/test": "^1.49.0",
+    "@types/node": "^22.19.7",
+    "@vitejs/plugin-vue": "^6.0.3",
+    "eslint": "^9.39.2",
+    "eslint-plugin-vue": "^10.7.0",
+    "playwright": "^1.49.0",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.53.1",
+    "vite": "^7.3.1",
+    "vue-tsc": "^3.2.2"
   },
-  "engines": {
-    "node": ">=24 <25"
-  }
-}
+  "packageManager": "pnpm@10.28.1"
+}

web/playwright.config.ts

@@ -0,0 +1,28 @@
+import { defineConfig, devices } from '@playwright/test'
+
+export default defineConfig({
+  testDir: './e2e',
+  // globalSetup: './e2e/global-setup.ts',
+  // globalTeardown: './e2e/global-teardown.ts',
+  fullyParallel: true,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+  reporter: 'html',
+  use: {
+    baseURL: process.env.PLAYWRIGHT_BASE_URL ?? 'http://localhost:5173',
+    trace: 'on-first-retry',
+    screenshot: 'only-on-failure',
+  },
+  projects: [{ name: 'chromium', use: { ...devices['Desktop Chrome'] } }],
+  webServer: process.env.CI
+    ? undefined
+    : {
+        command: 'pnpm dev',
+        url: 'http://localhost:5173',
+        reuseExistingServer: !process.env.CI,
+        timeout: 120_000,
+      },
+  timeout: 15_000,
+  expect: { timeout: 5_000 },
+})

web/renovate.json

@@ -0,0 +1,13 @@
+{
+  "extends": [
+    "github>nuxt/renovate-config-nuxt"
+  ],
+  "lockFileMaintenance": {
+    "enabled": true
+  },
+  "packageRules": [{
+    "matchDepTypes": ["resolutions"],
+    "enabled": false
+  }],
+  "postUpdateOptions": ["pnpmDedupe"]
+}

web/src/App.vue

@@ -1,49 +1,9 @@
 <template>
-    <component :is="layout">
-        <router-view />
-    </component>
+  <UApp>
+    <RouterView />
+  </UApp>
 </template>
 
-<script lang="ts">
-import { defineAsyncComponent, defineComponent } from 'vue';
-import { useAdditionalServer } from '@/composition/useAdditionalServer';
-import { isLoggedIn } from '@/helpers/app-helper';
-
-export default defineComponent({
-    components: {
-        DefaultLayout: defineAsyncComponent(() => import('@/layout/DefaultLayout.vue')),
-        AdminLayout: defineAsyncComponent(() => import('@/layout/AdminLayout.vue')),
-        UserLayout: defineAsyncComponent(() => import('@/layout/UserLayout.vue')),
-    },
-    computed: {
-        layout() {
-            return isLoggedIn.value ? 'UserLayout' : 'DefaultLayout';
-        },
-    },
-    mounted() {
-        const handleViewportHeight = () => {
-            document.documentElement.style.setProperty('--viewport-height', `${window.innerHeight}px`);
-            console.log('viewport-height', window.innerHeight);
-        };
-
-        window.addEventListener('resize', handleViewportHeight);
-
-        handleViewportHeight();
-
-        this.blurWhenClickOutsideInput();
-    },
-    async created() {
-        const { mainServer, setMainServer } = await useAdditionalServer();
-        setMainServer(mainServer.value);
-        // console.log('mainServer', mainServer.value);
-    },
-    methods: {
-        //input blur for safari
-        blurWhenClickOutsideInput() {
-            if (document.body.firstElementChild) {
-                (document.body.firstElementChild as HTMLElement).tabIndex = 1;
-            }
-        },
-    },
-});
+<script setup lang="ts">
+import { RouterView } from 'vue-router'
 </script>

web/src/assets/css/main.css

@@ -0,0 +1,83 @@
+@import "tailwindcss" theme(static);
+
+@import "@nuxt/ui";
+
+@theme static {
+  --font-sans: 'Public Sans', sans-serif;
+}
+
+@theme {
+  --tv-ui-bg-elevated: #fff;
+  --color-tv-ui-bg-elevated: var(--tv-ui-bg-elevated);
+}
+
+/* Safe area utilities */
+@utility pt-safe {
+  padding-top: var(--tv-safe-area-inset-top);
+}
+
+@utility pb-safe {
+  padding-bottom: var(--tv-safe-area-inset-bottom);
+}
+
+@utility pl-safe {
+  padding-left: var(--tv-safe-area-inset-left);
+}
+
+@utility pr-safe {
+  padding-right: var(--tv-safe-area-inset-right);
+}
+
+@utility px-safe {
+  padding-left: var(--tv-safe-area-inset-left);
+  padding-right: var(--tv-safe-area-inset-right);
+}
+
+@utility py-safe {
+  padding-top: var(--tv-safe-area-inset-top);
+  padding-bottom: var(--tv-safe-area-inset-bottom);
+}
+
+@utility p-safe {
+  padding-top: var(--tv-safe-area-inset-top);
+  padding-right: var(--tv-safe-area-inset-right);
+  padding-bottom: var(--tv-safe-area-inset-bottom);
+  padding-left: var(--tv-safe-area-inset-left);
+}
+
+@utility mt-safe {
+  margin-top: var(--tv-safe-area-inset-top);
+}
+
+@utility mb-safe {
+  margin-bottom: var(--tv-safe-area-inset-bottom);
+}
+
+@utility ml-safe {
+  margin-left: var(--tv-safe-area-inset-left);
+}
+
+@utility mr-safe {
+  margin-right: var(--tv-safe-area-inset-right);
+}
+
+@layer base {
+  html {
+    touch-action: manipulation;
+  }
+  
+  :root {
+    --tv-safe-area-inset-top: env(safe-area-inset-top, 0px);
+    --tv-safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);
+    --tv-safe-area-inset-left: env(safe-area-inset-left, 0px);
+    --tv-safe-area-inset-right: env(safe-area-inset-right, 0px);
+    /* --tv-safe-area-inset-top: 30px;
+    --tv-safe-area-inset-bottom: 30px;
+    --tv-safe-area-inset-left: 30px;
+    --tv-safe-area-inset-right: 30px; */
+  }
+  
+  .dark {
+    --tv-ui-bg-elevated: var(--color-neutral-800);
+  }
+}

web/src/components/UserMenu.vue

@@ -0,0 +1,265 @@
+<template>
+  <UDropdownMenu
+    :items="items"
+    :content="{ align: 'center', collisionPadding: 12 }"
+    :ui="{ content: collapsed ? 'w-48' : 'w-(--reka-dropdown-menu-trigger-width)' }"
+  >
+    <UButton
+      v-bind="{
+        ...user,
+        label: collapsed ? undefined : user?.name,
+        trailingIcon: collapsed ? undefined : 'i-lucide-chevrons-up-down'
+      }"
+      color="neutral"
+      variant="ghost"
+      block
+      :square="collapsed"
+      class="data-[state=open]:bg-elevated"
+      :ui="{
+        trailingIcon: 'text-dimmed'
+      }"
+    />
+
+    <template #chip-leading="{ item }">
+      <div class="inline-flex items-center justify-center shrink-0 size-5">
+        <span
+          class="rounded-full ring ring-bg bg-(--chip-light) dark:bg-(--chip-dark) size-2"
+          :style="{
+            '--chip-light': `var(--color-${(item as any).chip}-500)`,
+            '--chip-dark': `var(--color-${(item as any).chip}-400)`
+          }"
+        />
+      </div>
+    </template>
+  </UDropdownMenu>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, onMounted } from 'vue'
+import type { DropdownMenuItem } from '@nuxt/ui'
+import { useColorMode } from '@vueuse/core'
+import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+import { useAppStore } from '@/stores/app.store'
+import { useLogout } from '@/composables/useLogout'
+import { saveLocale } from '@/plugins/i18n'
+import { useUpdater } from '@/composables/useUpdater'
+import { useUserStore } from '@/stores/user.store'
+import { $ls } from '@/plugins/axios'
+import avatarImg from '@/assets/images/avatar-1.jpeg'
+
+defineProps<{
+  collapsed?: boolean
+}>()
+
+const { t, locale } = useI18n()
+const colorMode = useColorMode()
+const appStore = useAppStore()
+const router = useRouter()
+const toast = useToast()
+const userStore = useUserStore()
+
+const prodOrDev = ref<'prod' | 'dev'>('prod')
+let counter = 0
+let timeout: number
+let timeoutChangeProdOrDev: number
+
+onMounted(async () => {
+  prodOrDev.value = (await $ls.getValue('update_loading')) === 'dev' ? 'dev' : 'prod'
+})
+
+async function checkForUpdates() {
+  counter++
+
+  if (timeout) clearTimeout(timeout)
+  if (timeoutChangeProdOrDev) clearTimeout(timeoutChangeProdOrDev)
+
+  timeout = window.setTimeout(() => {
+    counter = 0
+  }, 500)
+
+  if (counter === 7) {
+    timeoutChangeProdOrDev = window.setTimeout(async () => {
+      if ((await $ls.getValue('update_loading')) !== 'dev') {
+        await $ls.setValue('update_loading', 'dev')
+        prodOrDev.value = 'dev'
+      } else {
+        await $ls.setValue('update_loading', 'prod')
+        prodOrDev.value = 'prod'
+      }
+      console.log(await $ls.getValue('update_loading'))
+      await useUpdater(true)
+      clearTimeout(timeoutChangeProdOrDev)
+    }, 2000)
+  }
+}
+
+async function handleLogout() {
+  const success = await useLogout()
+  if (success) {
+    router.push('/')
+  } else {
+    toast.add({
+      title: t('userMenu.logoutFailed'),
+      description: t('userMenu.logoutFailedDescription'),
+      color: 'error',
+    })
+  }
+}
+
+const user = computed(() => ({
+  name: userStore.email || userStore.login,
+  avatar: {
+    src: avatarImg,
+    alt: userStore.email || userStore.login,
+  },
+}))
+
+const items = computed<DropdownMenuItem[][]>(() => [
+  [
+    {
+      type: 'label',
+      label: user.value.name,
+      avatar: user.value.avatar,
+    },
+  ],
+  [
+    // {
+    //   label: t('userMenu.profile'),
+    //   icon: 'i-lucide-user',
+    // },
+    {
+      label: t('userMenu.accountSettings'),
+      icon: 'i-lucide-settings',
+      onSelect() {
+        router.push({ name: 'account' })
+      },
+    },
+  ],
+  [
+    {
+      label: t('userMenu.appearance'),
+      icon: 'i-lucide-sun-moon',
+      children: [
+        {
+          label: t('userMenu.light'),
+          icon: 'i-lucide-sun',
+          type: 'checkbox',
+          checked: colorMode.value === 'light',
+          onSelect(e: Event) {
+            e.preventDefault()
+            colorMode.value = 'light'
+          },
+        },
+        {
+          label: t('userMenu.dark'),
+          icon: 'i-lucide-moon',
+          type: 'checkbox',
+          checked: colorMode.value === 'dark',
+          onUpdateChecked(checked: boolean) {
+            if (checked) {
+              colorMode.value = 'dark'
+            }
+          },
+          onSelect(e: Event) {
+            e.preventDefault()
+          },
+        },
+      ],
+    },
+    {
+      label: t('userMenu.language'),
+      icon: 'i-lucide-languages',
+      children: [
+        {
+          label: 'English',
+          type: 'checkbox',
+          checked: locale.value === 'en',
+          onSelect(e: Event) {
+            e.preventDefault()
+            saveLocale('en')
+          },
+        },
+        {
+          label: 'Русский',
+          type: 'checkbox',
+          checked: locale.value === 'ru',
+          onSelect(e: Event) {
+            e.preventDefault()
+            saveLocale('ru')
+          },
+        },
+      ],
+    },
+    {
+      label: t('userMenu.taskDetailView'),
+      icon: 'i-lucide-panel-right',
+      children: [
+        {
+          label: t('userMenu.taskDetailSlideover'),
+          icon: 'i-lucide-panel-right',
+          type: 'checkbox',
+          checked: appStore.taskDetailDisplayMode === 'slideover',
+          onSelect(e: Event) {
+            e.preventDefault()
+            appStore.setTaskDetailDisplayMode('slideover')
+          },
+        },
+        {
+          label: t('userMenu.taskDetailModal'),
+          icon: 'i-lucide-square',
+          type: 'checkbox',
+          checked: appStore.taskDetailDisplayMode === 'modal',
+          onSelect(e: Event) {
+            e.preventDefault()
+            appStore.setTaskDetailDisplayMode('modal')
+          },
+        },
+      ],
+    },
+  ],
+  [
+    {
+      label: t('userMenu.site'),
+      icon: 'i-lucide-globe',
+      to: 'https://taskview.tech/',
+      target: '_blank',
+    },
+    {
+      label: t('userMenu.documentation'),
+      icon: 'i-lucide-book-open',
+      to: 'https://taskview.tech/docs/',
+      target: '_blank',
+    },
+    {
+      label: t('userMenu.github'),
+      icon: 'simple-icons:github',
+      to: 'https://github.com/Gimanh/taskview-community',
+      target: '_blank',
+    },
+    {
+      label: t('userMenu.docker'),
+      icon: 'simple-icons:docker',
+      to: 'https://hub.docker.com/u/gimanhead',
+      target: '_blank',
+    },
+  ],
+  [
+    {
+      label: `v ${APP_VERSION}${prodOrDev.value === 'dev' ? '_d' : ''}`,
+      icon: 'i-lucide-info',
+      onSelect(e: Event) {
+        e.preventDefault()
+        checkForUpdates()
+      },
+    },
+  ],
+  [
+    {
+      label: t('userMenu.logout'),
+      icon: 'i-lucide-log-out',
+      onSelect: handleLogout,
+    },
+  ],
+])
+</script>

web/src/components/features/account/AccountSettings.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="flex flex-col gap-6 p-4 lg:p-6 w-full max-w-full lg:max-w-2xl m-0 lg:mx-auto">
+    <h1 class="text-2xl font-bold">
+      {{ t('account.title') }}
+    </h1>
+
+    <UPageCard class="w-full">
+      <div class="flex flex-col gap-4">
+        <h2 class="text-lg font-semibold">
+          {{ t('account.management') }}
+        </h2>
+
+        <div class="text-muted">
+          {{ userStore.email }}
+        </div>
+
+        <div>
+          <DeleteAccountButton
+            @code-sent="showCodeModal = true"
+            @error="onCodeSendError"
+          />
+        </div>
+      </div>
+    </UPageCard>
+
+    <DeleteAccountCodeModal v-model:open="showCodeModal" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useUserStore } from '@/stores/user.store'
+import DeleteAccountButton from './parts/DeleteAccountButton.vue'
+import DeleteAccountCodeModal from './parts/DeleteAccountCodeModal.vue'
+
+const { t } = useI18n()
+const userStore = useUserStore()
+const toast = useToast()
+
+const showCodeModal = ref(false)
+
+function onCodeSendError() {
+  toast.add({
+    title: t('account.codeSendError'),
+    color: 'error',
+  })
+}
+</script>

web/src/components/features/account/parts/DeleteAccountButton.vue

@@ -0,0 +1,33 @@
+<template>
+  <UButton
+    color="error"
+    @click="handleClick"
+  >
+    {{ t('account.deleteAccount') }}
+  </UButton>
+</template>
+
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n'
+import $api from '@/helpers/axios'
+
+const emit = defineEmits<{
+  codeSent: []
+  error: []
+}>()
+
+const { t } = useI18n()
+
+async function handleClick() {
+  const answer = confirm(t('account.deleteConfirm'))
+  if (!answer) return
+
+  try {
+    await $api.post('/module/auth/delete/account/code')
+    emit('codeSent')
+  } catch (err) {
+    console.log(err)
+    emit('error')
+  }
+}
+</script>

web/src/components/features/account/parts/DeleteAccountCodeModal.vue

@@ -0,0 +1,68 @@
+<template>
+  <UModal v-model:open="open">
+    <template #content>
+      <div class="flex flex-col gap-4 p-6">
+        <UAlert
+          color="error"
+          icon="i-lucide-triangle-alert"
+          :title="t('account.deleteWarning')"
+        />
+
+        <UInput
+          v-model="code"
+          :placeholder="t('account.enterCode')"
+          spellcheck="false"
+        />
+
+        <div class="flex justify-end gap-2">
+          <UButton
+            color="neutral"
+            variant="outline"
+            @click="open = false"
+          >
+            {{ t('account.cancel') }}
+          </UButton>
+          <UButton
+            color="error"
+            :disabled="!code"
+            @click="handleConfirm"
+          >
+            {{ t('account.confirm') }}
+          </UButton>
+        </div>
+      </div>
+    </template>
+  </UModal>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+import $api from '@/helpers/axios'
+import { $ls } from '@/plugins/axios'
+import type { AppResponse } from '@/types/global-app.types'
+
+const open = defineModel<boolean>('open', { required: true })
+
+const { t } = useI18n()
+const router = useRouter()
+const toast = useToast()
+
+const code = ref('')
+
+async function handleConfirm() {
+  const result = await $api
+    .post<AppResponse<{ del: boolean }>>('/module/auth/delete/account', { code: code.value })
+    .catch((err) => console.log(err))
+
+  if (result && result.data.response.del) {
+    toast.add({
+      title: t('account.deleted'),
+      color: 'success',
+    })
+    $ls.invalidateTokens()
+    router.push('/')
+  }
+}
+</script>

web/src/components/features/auth/ForgotPassword.vue

@@ -0,0 +1,142 @@
+<template>
+  <div class="space-y-4">
+    <!-- Success state -->
+    <template v-if="isSent">
+      <div class="text-center space-y-4">
+        <div class="mx-auto w-12 h-12 rounded-full bg-success/10 flex items-center justify-center">
+          <UIcon
+            name="i-lucide-mail-check"
+            class="w-6 h-6 text-success"
+          />
+        </div>
+        <div>
+          <h3 class="font-medium">
+            {{ t('auth.checkYourEmail') }}
+          </h3>
+          <p class="text-sm text-muted mt-1">
+            {{ t('auth.resetLinkSent') }}
+            <span class="font-medium">{{ state.email }}</span>
+          </p>
+        </div>
+        <UButton
+          :label="t('auth.backToLogin')"
+          variant="outline"
+          color="neutral"
+          block
+          @click="emit('back')"
+        />
+      </div>
+    </template>
+
+    <!-- Form -->
+    <template v-else>
+      <div class="text-center mb-4">
+        <p class="text-sm text-muted">
+          {{ t('auth.forgotPasswordDescription') }}
+        </p>
+      </div>
+
+      <UForm
+        :state="state"
+        :schema="EmailSchema"
+        class="space-y-4"
+        @submit="onSubmit"
+      >
+        <UFormField
+          :label="t('auth.email')"
+          name="email"
+        >
+          <UInput
+            v-model="state.email"
+            type="email"
+            :placeholder="t('auth.emailPlaceholder')"
+            icon="i-lucide-mail"
+            class="w-full"
+          />
+        </UFormField>
+
+        <UButton
+          :label="t('auth.sendResetLink')"
+          type="submit"
+          color="primary"
+          block
+          :loading="isLoading"
+        />
+
+        <UButton
+          :label="t('auth.backToLogin')"
+          variant="link"
+          color="neutral"
+          block
+          @click="emit('back')"
+        />
+      </UForm>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { type } from 'arktype'
+import qs from 'qs'
+import { ref, reactive } from 'vue'
+import { useI18n } from 'vue-i18n'
+import $api from '@/helpers/axios'
+
+const { t } = useI18n()
+
+const emit = defineEmits<{
+  back: []
+  success: []
+}>()
+
+const toast = useToast()
+const isLoading = ref(false)
+const isSent = ref(false)
+
+const EmailSchema = type({
+  email: type('string.email').configure({ message: t('auth.invalidEmail') }),
+})
+
+type RecoveryResponse = {
+  sent: boolean
+}
+
+const state = reactive({
+  email: '',
+})
+
+async function onSubmit() {
+  isLoading.value = true
+
+  try {
+    const result = await $api.post<RecoveryResponse>(
+      '/module/auth/email/recovery',
+      qs.stringify({ email: state.email }),
+    )
+
+    if (result.data.sent) {
+      isSent.value = true
+      toast.add({
+        title: t('auth.emailSent'),
+        description: t('auth.checkInboxForReset'),
+        color: 'success',
+      })
+      emit('success')
+    } else {
+      toast.add({
+        title: t('auth.error'),
+        description: t('auth.failedToSendResetLink'),
+        color: 'error',
+      })
+    }
+  } catch {
+    toast.add({
+      title: t('auth.error'),
+      description: t('auth.failedToSendResetLink'),
+      color: 'error',
+    })
+  } finally {
+    isLoading.value = false
+  }
+}
+</script>

web/src/components/features/auth/LoginByCode.vue

@@ -0,0 +1,211 @@
+<template>
+  <div class="space-y-4">
+    <UForm
+      :state="state"
+      :schema="activeSchema"
+      class="space-y-4"
+      @submit="handleSubmit"
+    >
+      <UFormField
+        :label="t('auth.email')"
+        name="email"
+      >
+        <UInput
+          v-model="state.email"
+          type="email"
+          :placeholder="t('auth.emailPlaceholder')"
+          icon="i-lucide-mail"
+          class="w-full"
+        />
+      </UFormField>
+
+      <UFormField
+        v-if="showCodeField"
+        :label="t('auth.verificationCode')"
+        name="code"
+      >
+        <UInput
+          v-model="state.code"
+          placeholder="000000"
+          icon="i-lucide-key-round"
+          class="w-full text-center tracking-widest"
+        />
+      </UFormField>
+
+      <p
+        v-if="showCodeField"
+        class="text-sm text-muted"
+      >
+        {{ t('auth.enterCode') }}
+        <span class="font-medium">{{ state.email }}</span>
+      </p>
+
+      <UButton
+        :label="showCodeField ? t('auth.verifyAndSignIn') : t('auth.sendCode')"
+        type="submit"
+        color="primary"
+        block
+        :loading="isLoading"
+      />
+
+      <div
+        v-if="showCodeField"
+        class="flex items-center justify-between text-sm"
+      >
+        <UButton
+          :label="t('auth.back')"
+          variant="link"
+          color="neutral"
+          size="sm"
+          @click="goBack"
+        />
+        <UButton
+          :label="t('auth.resendCode')"
+          variant="link"
+          color="neutral"
+          size="sm"
+          :loading="isLoading"
+          @click="resendCode"
+        />
+      </div>
+    </UForm>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { type } from 'arktype'
+import { ref, reactive, computed, onMounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+import $api from '@/helpers/axios'
+import { $ls } from '@/plugins/axios'
+import { redirectToUser } from './auth.helper'
+
+const { t } = useI18n()
+const router = useRouter()
+
+const emit = defineEmits<{
+  success: [token: string]
+}>()
+
+const toast = useToast()
+
+const showCodeField = ref(false)
+const isLoading = ref(false)
+
+const emailType = type('string.email').configure({ message: t('auth.invalidEmail') })
+const codeType = type('string > 0').configure({ message: t('auth.codeMustBe6') })
+
+const EmailSchema = type({
+  email: emailType,
+})
+
+const CodeSchema = type({
+  email: emailType,
+  code: codeType,
+})
+
+const activeSchema = computed(() => showCodeField.value ? CodeSchema : EmailSchema)
+
+type LoginResponse = {
+  access: string
+  refresh: string
+}
+
+const state = reactive({
+  email: '',
+  code: '',
+})
+
+onMounted(async () => {
+  const savedEmail = await $ls.getValue('user-email')
+  if (savedEmail) {
+    state.email = savedEmail
+  }
+})
+
+async function handleSubmit() {
+  isLoading.value = true
+
+  try {
+    if (showCodeField.value) {
+      const result = await $api.post<LoginResponse>('/module/auth/login-by-code', {
+        code: state.code,
+        email: state.email,
+      })
+
+      if (result.data.access) {
+        $ls.setToken(result.data.access)
+        $ls.setRefreshToken(result.data.refresh)
+        await $ls.updateUserStoreByToken()
+
+        toast.add({
+          title: t('auth.success'),
+          description: t('auth.loggedIn'),
+          color: 'success',
+        })
+
+        emit('success', result.data.access)
+        redirectToUser(router)
+      }
+    } else {
+      await $api.post('/module/auth/send-login-code', { email: state.email })
+      await $ls.setValue('user-email', state.email)
+
+      toast.add({
+        title: t('auth.codeSent'),
+        description: t('auth.checkInbox', { email: state.email }),
+        color: 'success',
+      })
+
+      showCodeField.value = true
+    }
+  } catch (error: unknown) {
+    const axiosError = error as { response?: { status?: number } }
+    if (showCodeField.value) {
+      toast.add({
+        title: t('auth.error'),
+        description: axiosError.response?.status === 403 ? t('auth.invalidCode') : t('auth.loginFailed'),
+        color: 'error',
+      })
+    } else {
+      toast.add({
+        title: t('auth.error'),
+        description: t('auth.failedToSendCode'),
+        color: 'error',
+      })
+    }
+  } finally {
+    isLoading.value = false
+  }
+}
+
+function goBack() {
+  showCodeField.value = false
+  state.code = ''
+}
+
+async function resendCode() {
+  if (!state.email) return
+
+  isLoading.value = true
+
+  try {
+    await $api.post('/module/auth/send-login-code', { email: state.email })
+
+    toast.add({
+      title: t('auth.codeResent'),
+      description: t('auth.newCodeSent', { email: state.email }),
+      color: 'success',
+    })
+  } catch {
+    toast.add({
+      title: t('auth.error'),
+      description: t('auth.failedToResendCode'),
+      color: 'error',
+    })
+  } finally {
+    isLoading.value = false
+  }
+}
+</script>

web/src/components/features/auth/LoginByPassword.vue

@@ -0,0 +1,147 @@
+<template>
+  <UForm
+    :state="state"
+    :schema="LoginSchema"
+    class="space-y-4"
+    @submit="onSubmit"
+  >
+    <UFormField
+      :label="t('auth.login')"
+      name="login"
+    >
+      <UInput
+        v-model="state.login"
+        :placeholder="t('auth.loginPlaceholder')"
+        icon="i-lucide-user"
+        class="w-full"
+        data-testid="login-input"
+      />
+    </UFormField>
+
+    <UFormField
+      :label="t('auth.passwordLabel')"
+      name="password"
+    >
+      <UInput
+        v-model="state.password"
+        :type="showPassword ? 'text' : 'password'"
+        :placeholder="t('auth.passwordPlaceholder')"
+        icon="i-lucide-lock"
+        class="w-full"
+        data-testid="password-input"
+      >
+        <template #trailing>
+          <UButton
+            :icon="showPassword ? 'i-lucide-eye-off' : 'i-lucide-eye'"
+            color="neutral"
+            variant="link"
+            size="sm"
+            :padded="false"
+            @click="showPassword = !showPassword"
+          />
+        </template>
+      </UInput>
+    </UFormField>
+
+    <div class="flex justify-end">
+      <UButton
+        :label="t('auth.forgotPassword')"
+        variant="link"
+        color="neutral"
+        size="sm"
+        @click="emit('forgotPassword')"
+      />
+    </div>
+
+    <UButton
+      :label="t('auth.signIn')"
+      type="submit"
+      color="primary"
+      block
+      :loading="isLoading"
+      data-testid="sign-in-button"
+    />
+  </UForm>
+</template>
+
+<script setup lang="ts">
+import { type } from 'arktype'
+import qs from 'qs'
+import { ref, reactive } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+import $api from '@/helpers/axios'
+import { $ls } from '@/plugins/axios'
+import { redirectToUser } from './auth.helper'
+
+const { t } = useI18n()
+const router = useRouter()
+
+const emit = defineEmits<{
+  success: [token: string]
+  forgotPassword: []
+}>()
+
+const toast = useToast()
+const isLoading = ref(false)
+const showPassword = ref(false)
+
+const LoginSchema = type({
+  login: type('string > 0').configure({ message: t('auth.loginRequired') }),
+  password: type('string > 0').configure({ message: t('auth.passwordRequired') }),
+})
+
+type LoginState = typeof LoginSchema.infer
+
+type LoginResponse = {
+  access: string
+  refresh: string
+}
+
+const state = reactive<LoginState>({
+  login: '',
+  password: '',
+})
+
+async function onSubmit() {
+  isLoading.value = true
+
+  try {
+    const { login, password } = state
+    const result = await $api.post<LoginResponse>('/module/auth/login', qs.stringify({ login, password }))
+
+    if (result.data.access) {
+      $ls.setToken(result.data.access)
+      $ls.setRefreshToken(result.data.refresh)
+      await $ls.updateUserStoreByToken()
+
+      toast.add({
+        title: t('auth.success'),
+        description: t('auth.loggedIn'),
+        color: 'success',
+      })
+
+      emit('success', result.data.access)
+
+      redirectToUser(router)
+    }
+  } catch (error: unknown) {
+    const axiosError = error as { response?: { status?: number } }
+    if (axiosError.response?.status === 403) {
+      toast.add({
+        title: t('auth.error'),
+        description: t('auth.invalidCredentials'),
+        color: 'error',
+      })
+    } else {
+      toast.add({
+        title: t('auth.error'),
+        description: t('auth.loginFailed'),
+        color: 'error',
+      })
+    }
+  } finally {
+    isLoading.value = false
+  }
+}
+</script>

web/src/components/features/auth/LoginForm.vue

@@ -0,0 +1,127 @@
+<template>
+  <div class="w-full max-w-sm mx-auto space-y-6">
+    <!-- Header -->
+    <div class="text-center">
+      <h1 class="text-2xl font-bold">
+        {{ t('auth.welcome') }}
+      </h1>
+      <p class="text-muted mt-1">
+        {{ t('auth.signInToAccount') }}
+      </p>
+    </div>
+
+    <!-- Forgot Password View -->
+    <template v-if="currentView === 'forgot'">
+      <ForgotPassword
+        @back="currentView = 'password'"
+        @success="currentView = 'password'"
+      />
+    </template>
+
+    <!-- Login Views -->
+    <template v-else>
+      <SocialButtons />
+
+      <!-- Divider -->
+      <div class="relative">
+        <div class="absolute inset-0 flex items-center">
+          <div class="w-full border-t border-default" />
+        </div>
+        <div class="relative flex justify-center text-xs uppercase">
+          <span class="bg-default px-2 text-muted">{{ t('auth.orContinueWith') }}</span>
+        </div>
+      </div>
+
+      <!-- Tabs -->
+      <UTabs
+        v-model="currentView"
+        :items="tabs"
+        class="w-full"
+        @update:model-value="onTabChange"
+      >
+        <template #code>
+          <div class="pt-4">
+            <LoginByCode @success="handleSuccess" />
+          </div>
+        </template>
+
+        <template #password>
+          <div class="pt-4">
+            <LoginByPassword
+              @success="handleSuccess"
+              @forgot-password="currentView = 'forgot'"
+            />
+          </div>
+        </template>
+      </UTabs>
+    </template>
+    
+    <!-- Server Selector -->
+    <UCollapsible class="flex flex-col gap-2">
+      <UButton
+        class="group"
+        :label="t('server.selectServer')"
+        color="neutral"
+        variant="ghost"
+        icon="i-lucide-server"
+        trailing-icon="i-lucide-chevron-down"
+        :ui="{
+          trailingIcon: 'group-data-[state=open]:rotate-180 transition-transform duration-200'
+        }"
+        block
+      />
+
+      <template #content>
+        <ServerSelector class="p-2 border border-default rounded-lg" />
+      </template>
+    </UCollapsible>
+
+    <!-- Footer -->
+    <p class="text-center text-xs text-muted">
+      {{ t('auth.termsText') }}
+      <a
+        href="#"
+        class="underline hover:text-foreground"
+      >{{ t('auth.termsOfService') }}</a>
+      {{ t('auth.and') }}
+      <a
+        href="#"
+        class="underline hover:text-foreground"
+      >{{ t('auth.privacyPolicy') }}</a>.
+    </p>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import LoginByCode from './LoginByCode.vue'
+import LoginByPassword from './LoginByPassword.vue'
+import ForgotPassword from './ForgotPassword.vue'
+import SocialButtons from './SocialButtons.vue'
+import ServerSelector from './ServerSelector.vue'
+
+const { t } = useI18n()
+
+const emit = defineEmits<{
+  success: [token: string]
+}>()
+
+type View = 'code' | 'password' | 'forgot'
+
+const currentView = ref<View>('code')
+
+const tabs = computed(() => [
+  { value: 'code', label: t('auth.magicLink'), slot: 'code' as const },
+  { value: 'password', label: t('auth.password'), slot: 'password' as const },
+])
+
+function onTabChange(value: string | number) {
+  currentView.value = value as View
+}
+
+function handleSuccess(token: string) {
+  emit('success', token)
+}
+
+</script>

web/src/components/features/auth/ResetPassword.vue

@@ -0,0 +1,231 @@
+<template>
+  <div class="space-y-4">
+    <!-- Success state -->
+    <template v-if="isReset">
+      <div class="text-center space-y-4">
+        <div class="mx-auto w-12 h-12 rounded-full bg-success/10 flex items-center justify-center">
+          <UIcon
+            name="i-lucide-check-circle"
+            class="w-6 h-6 text-success"
+          />
+        </div>
+        <div>
+          <h3 class="font-medium">
+            {{ t('auth.passwordReset') }}
+          </h3>
+          <p class="text-sm text-muted mt-1">
+            {{ t('auth.passwordResetSuccess') }}
+          </p>
+        </div>
+        <UButton
+          :label="t('auth.backToLogin')"
+          color="primary"
+          block
+          @click="goToLogin"
+        />
+      </div>
+    </template>
+
+    <!-- Error state - invalid reset link -->
+    <template v-else-if="!isValidLink">
+      <div class="text-center space-y-4">
+        <div class="mx-auto w-12 h-12 rounded-full bg-error/10 flex items-center justify-center">
+          <UIcon
+            name="i-lucide-alert-circle"
+            class="w-6 h-6 text-error"
+          />
+        </div>
+        <div>
+          <h3 class="font-medium">
+            {{ t('auth.invalidResetLink') }}
+          </h3>
+          <p class="text-sm text-muted mt-1">
+            {{ t('auth.invalidResetLinkDescription') }}
+          </p>
+        </div>
+        <UButton
+          :label="t('auth.backToLogin')"
+          variant="outline"
+          color="neutral"
+          block
+          @click="goToLogin"
+        />
+      </div>
+    </template>
+
+    <!-- Form -->
+    <template v-else>
+      <div class="text-center mb-4">
+        <h3 class="font-medium">
+          {{ t('auth.setNewPassword') }}
+        </h3>
+        <p class="text-sm text-muted mt-1">
+          {{ t('auth.setNewPasswordDescription') }}
+        </p>
+      </div>
+
+      <UForm
+        :state="state"
+        :schema="PasswordSchema"
+        :validate="validatePasswordsMatch"
+        class="space-y-4"
+        @submit="onSubmit"
+      >
+        <UFormField
+          :label="t('auth.newPassword')"
+          name="password"
+        >
+          <UInput
+            v-model="state.password"
+            :type="showPassword ? 'text' : 'password'"
+            :placeholder="t('auth.newPasswordPlaceholder')"
+            icon="i-lucide-lock"
+            class="w-full"
+          >
+            <template #trailing>
+              <UButton
+                :icon="showPassword ? 'i-lucide-eye-off' : 'i-lucide-eye'"
+                color="neutral"
+                variant="link"
+                size="sm"
+                :padded="false"
+                @click="showPassword = !showPassword"
+              />
+            </template>
+          </UInput>
+        </UFormField>
+
+        <UFormField
+          :label="t('auth.confirmPassword')"
+          name="passwordRepeat"
+        >
+          <UInput
+            v-model="state.passwordRepeat"
+            :type="showPasswordRepeat ? 'text' : 'password'"
+            :placeholder="t('auth.confirmPasswordPlaceholder')"
+            icon="i-lucide-lock"
+            class="w-full"
+          >
+            <template #trailing>
+              <UButton
+                :icon="showPasswordRepeat ? 'i-lucide-eye-off' : 'i-lucide-eye'"
+                color="neutral"
+                variant="link"
+                size="sm"
+                :padded="false"
+                @click="showPasswordRepeat = !showPasswordRepeat"
+              />
+            </template>
+          </UInput>
+        </UFormField>
+
+        <UButton
+          :label="t('auth.resetPassword')"
+          type="submit"
+          color="primary"
+          block
+          :loading="isLoading"
+        />
+
+        <UButton
+          :label="t('auth.backToLogin')"
+          variant="link"
+          color="neutral"
+          block
+          @click="goToLogin"
+        />
+      </UForm>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { type } from 'arktype'
+import qs from 'qs'
+import { ref, reactive, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useRoute, useRouter } from 'vue-router'
+import $api from '@/helpers/axios'
+
+const { t } = useI18n()
+const route = useRoute()
+const router = useRouter()
+
+const toast = useToast()
+
+const isLoading = ref(false)
+const isReset = ref(false)
+const showPassword = ref(false)
+const showPasswordRepeat = ref(false)
+
+const resetCode = computed(() => route.query.resetCode as string | undefined)
+const login = computed(() => route.query.login as string | undefined)
+const isValidLink = computed(() => !!resetCode.value && !!login.value)
+
+const PasswordSchema = type({
+  password: type('string >= 6').configure({ message: t('auth.passwordTooShort') }),
+  passwordRepeat: type('string >= 6').configure({ message: t('auth.passwordTooShort') }),
+})
+
+type ResetResponse = {
+  reset: boolean
+}
+
+const state = reactive({
+  password: '',
+  passwordRepeat: '',
+})
+
+function validatePasswordsMatch(state: Partial<{ password: string; passwordRepeat: string }>) {
+  const errors = []
+  if (state.password && state.passwordRepeat && state.password !== state.passwordRepeat) {
+    errors.push({ name: 'passwordRepeat', message: t('auth.passwordsDoNotMatch') })
+  }
+  return errors
+}
+
+async function onSubmit() {
+  if (!isValidLink.value) return
+
+  isLoading.value = true
+
+  try {
+    const result = await $api.post<ResetResponse>(
+      '/module/auth/password/reset',
+      qs.stringify({
+        code: resetCode.value,
+        login: login.value,
+        password: state.password,
+        passwordRepeat: state.passwordRepeat,
+      }),
+    )
+
+    if (result.data.reset) {
+      isReset.value = true
+      toast.add({
+        title: t('auth.success'),
+        description: t('auth.passwordResetSuccess'),
+        color: 'success',
+      })
+    } else {
+      toast.add({
+        title: t('auth.error'),
+        description: t('auth.canNotResetPassword'),
+        color: 'error',
+      })
+    }
+  } catch {
+    toast.add({
+      title: t('auth.error'),
+      description: t('auth.canNotResetPassword'),
+      color: 'error',
+    })
+  } finally {
+    isLoading.value = false
+  }
+}
+
+function goToLogin() {
+  router.push('/')
+}
+</script>

web/src/components/features/auth/ServerSelector.vue

@@ -0,0 +1,191 @@
+<template>
+  <div class="space-y-2">
+    <USelectMenu
+      v-model="selectedServer"
+      :items="serverOptions"
+      :placeholder="t('server.selectServer')"
+      value-key="value"
+      class="w-full"
+      variant="subtle"
+    >
+      <template #item="{ item }">
+        <div class="flex items-center justify-between w-full gap-2">
+          <div class="flex items-center gap-2 min-w-0">
+            <UIcon
+              :name="item.isSystem ? 'i-lucide-server' : 'i-lucide-cloud'"
+              class="size-4 shrink-0"
+            />
+            <span class="truncate">{{ item.label }}</span>
+          </div>
+          <UButton
+            v-if="!item.isSystem"
+            icon="i-lucide-trash-2"
+            color="error"
+            variant="ghost"
+            size="xs"
+            @click.stop="deleteServer(item.value)"
+          />
+        </div>
+      </template>
+    </USelectMenu>
+
+    <UButton
+      :label="t('server.addServer')"
+      icon="i-lucide-plus"
+      variant="ghost"
+      size="sm"
+      class="w-full"
+      @click="showAddDialog = true"
+    />
+
+    <UModal v-model:open="showAddDialog">
+      <template #content>
+        <UCard>
+          <template #header>
+            <div class="flex items-center justify-between">
+              <h3 class="text-lg font-semibold">
+                {{ t('server.addNewServer') }}
+              </h3>
+              <UButton
+                icon="i-lucide-x"
+                color="neutral"
+                variant="ghost"
+                @click="showAddDialog = false"
+              />
+            </div>
+          </template>
+
+          <div class="space-y-4">
+            <UFormField :label="t('server.serverUrl')">
+              <UInput
+                v-model="newServerUrl"
+                placeholder="https://api.example.com"
+                class="w-full"
+                @keyup.enter="handleAddServer"
+              />
+            </UFormField>
+            <p class="text-xs text-muted">
+              {{ t('server.serverUrlHint') }}
+            </p>
+          </div>
+
+          <template #footer>
+            <div class="flex justify-end gap-2">
+              <UButton
+                color="neutral"
+                variant="outline"
+                @click="showAddDialog = false"
+              >
+                {{ t('common.cancel') }}
+              </UButton>
+              <UButton
+                :disabled="!isValidUrl"
+                variant="outline"
+                @click="handleAddServer"
+              >
+                {{ t('common.add') }}
+              </UButton>
+            </div>
+          </template>
+        </UCard>
+      </template>
+    </UModal>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useAdditionalServer } from '@/composables/useAdditionalServer'
+
+const { t } = useI18n()
+
+const mainServer = ref('')
+const allServers = ref<string[]>([])
+const systemServer = ref('')
+const setMainServer = ref<(server: string) => void>(() => {})
+const addServerFn = ref<(server: string) => void>(() => {})
+const deleteServerFn = ref<(server: string) => void>(() => {})
+
+const showAddDialog = ref(false)
+const newServerUrl = ref('')
+const selectedServer = ref<string | undefined>(undefined)
+
+onMounted(async () => {
+  const serverApi = await useAdditionalServer()
+  mainServer.value = serverApi.mainServer.value
+  allServers.value = serverApi.allServers.value
+  systemServer.value = serverApi.systemServer.value
+  setMainServer.value = serverApi.setMainServer
+  addServerFn.value = serverApi.addServer
+  deleteServerFn.value = serverApi.deleteServer
+  selectedServer.value = mainServer.value
+})
+
+const serverOptions = computed(() => {
+  const options = [
+    {
+      label: systemServer.value || t('server.defaultServer'),
+      value: systemServer.value,
+      isSystem: true,
+    },
+  ]
+
+  allServers.value.forEach((server) => {
+    if (server !== systemServer.value) {
+      options.push({
+        label: server,
+        value: server,
+        isSystem: false,
+      })
+    }
+  })
+
+  return options
+})
+
+const isValidUrl = computed(() => {
+  if (!newServerUrl.value) return false
+  try {
+    const url = new URL(newServerUrl.value)
+    return url.protocol === 'http:' || url.protocol === 'https:'
+  } catch {
+    return false
+  }
+})
+
+watch(selectedServer, (newServer) => {
+  if (newServer && newServer !== mainServer.value) {
+    setMainServer.value(newServer)
+    mainServer.value = newServer
+  }
+})
+
+function handleAddServer() {
+  if (!isValidUrl.value) return
+
+  const url = newServerUrl.value.trim().replace(/\/$/, '')
+
+  if (!allServers.value.includes(url) && url !== systemServer.value) {
+    addServerFn.value(url)
+    allServers.value = [...allServers.value, url]
+  }
+
+  selectedServer.value = url
+  setMainServer.value(url)
+  mainServer.value = url
+
+  newServerUrl.value = ''
+  showAddDialog.value = false
+}
+
+function deleteServer(server: string) {
+  deleteServerFn.value(server)
+  allServers.value = allServers.value.filter((s) => s !== server)
+
+  if (selectedServer.value === server) {
+    selectedServer.value = systemServer.value
+    mainServer.value = systemServer.value
+  }
+}
+</script>

web/src/components/features/auth/SocialButtons.vue

@@ -0,0 +1,67 @@
+<template>
+  <div class="space-y-3">
+    <UButton
+      :label="t('auth.continueWithGoogle')"
+      icon="i-lucide-chrome"
+      color="neutral"
+      variant="outline"
+      block
+      :loading="isLoading === 'google'"
+      :disabled="isLoading !== null"
+      @click="handleLogin('google')"
+    />
+    <UButton
+      :label="t('auth.continueWithGithub')"
+      icon="i-lucide-github"
+      color="neutral"
+      variant="outline"
+      block
+      :loading="isLoading === 'github'"
+      :disabled="isLoading !== null"
+      @click="handleLogin('github')"
+    />
+    <UButton
+      :label="t('auth.continueWithApple')"
+      icon="i-lucide-apple"
+      color="neutral"
+      variant="outline"
+      block
+      :loading="isLoading === 'apple'"
+      :disabled="isLoading !== null"
+      @click="handleLogin('apple')"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { Capacitor } from '@capacitor/core'
+import { Browser } from '@capacitor/browser'
+import { useAdditionalServer } from '@/composables/useAdditionalServer'
+
+type Provider = 'google' | 'github' | 'apple'
+
+const { t } = useI18n()
+
+const isLoading = ref<Provider | null>(null)
+
+async function handleLogin(provider: Provider) {
+  isLoading.value = provider
+
+  setTimeout(() => {
+    isLoading.value = null
+  }, 2000)
+
+  const { mainServer } = await useAdditionalServer()
+
+  const platform = Capacitor.isNativePlatform() ? 'mobile' : 'web'
+  const url = `${mainServer.value}/module/auth/provider/${provider}?platform=${platform}`
+
+  if (Capacitor.isNativePlatform()) {
+    await Browser.open({ url })
+  } else {
+    window.location.href = url
+  }
+}
+</script>

web/src/components/features/auth/auth.helper.ts

@@ -0,0 +1,9 @@
+import { useUserStore } from '@/stores/user.store'
+import { Router } from 'vue-router'
+
+export const redirectToUser = async (router: Router) => {
+  const userStore: ReturnType<typeof useUserStore> = useUserStore()
+  if (userStore.accessToken) {
+    await router.push({ name: 'user', params: { user: userStore.login } })
+  }
+}

web/src/components/features/base/TvCollapseSidebarDesktop.vue

@@ -0,0 +1,19 @@
+<template>
+  <UButton
+    :icon="isSidebarCollapsed ? 'i-lucide-panel-right' : 'i-lucide-panel-left'"
+    color="neutral"
+    variant="soft"
+    class="lg:flex hidden cursor-pointer"
+    @click="toggleSidebar"
+  />
+</template>
+
+<script setup lang="ts">
+import { useDashboard } from '@/composables/useDashboard'
+
+const { isSidebarCollapsed } = useDashboard()
+
+function toggleSidebar() {
+  isSidebarCollapsed.value = !isSidebarCollapsed.value
+}
+</script>

web/src/components/features/base/TvContextMenu.vue

@@ -0,0 +1,64 @@
+<template>
+  <UPopover
+    v-model:open="isOpen"
+    :content="{ side: 'bottom', align: 'start', updatePositionStrategy: 'always' }"
+  >
+    <template #default>
+      <div
+        class="fixed pointer-events-none"
+        :style="anchorStyle"
+      />
+    </template>
+    <template #content>
+      <slot />
+    </template>
+  </UPopover>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, onMounted, onUnmounted } from 'vue'
+
+const isOpen = defineModel<boolean>('open', { default: false })
+
+const anchorPosition = ref({ x: 0, y: 0 })
+
+const anchorStyle = computed(() => ({
+  left: `${anchorPosition.value.x}px`,
+  top: `${anchorPosition.value.y}px`,
+  width: '1px',
+  height: '1px',
+}))
+
+function onScroll() {
+  if (isOpen.value) {
+    isOpen.value = false
+  }
+}
+
+onMounted(() => {
+  window.addEventListener('scroll', onScroll, true)
+})
+
+onUnmounted(() => {
+  window.removeEventListener('scroll', onScroll, true)
+})
+
+function openAt(event: MouseEvent) {
+  const target = event.currentTarget as HTMLElement
+  const rect = target.getBoundingClientRect()
+  anchorPosition.value = {
+    x: rect.right,
+    y: rect.bottom,
+  }
+  isOpen.value = true
+}
+
+function close() {
+  isOpen.value = false
+}
+
+defineExpose({
+  openAt,
+  close,
+})
+</script>

web/src/components/features/base/TvGoalLikeItem.vue

@@ -0,0 +1,19 @@
+<template>
+  <UPageCard
+    v-bind="{ ...props }"
+    class="shadow-sm"
+    :class="{ 'bg-primary/10 border border-primary/30': active }"
+  >
+    <div class="flex items-center justify-between">
+      <slot />
+    </div>
+  </UPageCard>
+</template>
+<script setup lang="ts">
+import type { RouteLocationRaw } from 'vue-router'
+
+const props = defineProps<{
+  to?: RouteLocationRaw
+  active?: boolean
+}>()
+</script>

web/src/components/features/base/TvMobileBottomNav.vue

@@ -0,0 +1,110 @@
+<template>
+  <nav class="fixed bottom-0 left-0 right-0 z-50 lg:hidden border-t border-default pb-safe">
+    <div class="flex items-center justify-between min-h-14">
+      <UButton
+        v-for="item in navItems"
+        :key="item.label"
+        :icon="item.icon"
+        :to="item.to"
+        color="neutral"
+        variant="ghost"
+        size="lg"
+        class="flex-1 h-full rounded-none"
+        :class="{ 'text-primary': item.active?.() }"
+        :ui="{
+          base: ' justify-center',
+        }"
+        @click="item.onClick?.()"
+      />
+    </div>
+  </nav>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+import { useI18n } from 'vue-i18n'
+import { useDashboard } from '@/composables/useDashboard'
+import { useAppRouteInfo } from '@/composables/useAppRouteInfo'
+import { ALL_TASKS_LIST_ID } from 'taskview-api'
+
+const route = useRoute()
+const { t } = useI18n()
+const { isSidebarOpen } = useDashboard()
+const { isUserRoute, isAccountRoute, hasProject, projectId, hasList } = useAppRouteInfo()
+
+const navItems = computed(() => {
+  if (isAccountRoute.value) {
+    return [
+      {
+        label: t('main'),
+        icon: 'i-lucide-house',
+        to: { name: 'user' },
+        active: (): boolean => false,
+      },
+    ]
+  }
+
+  if (isUserRoute.value && !hasProject.value) {
+    return [
+      {
+        label: t('projects.title'),
+        icon: 'i-lucide-folder',
+        active: (): boolean => isSidebarOpen.value,
+        onClick: () => { isSidebarOpen.value = !isSidebarOpen.value },
+      },
+      {
+        label: t('account.title'),
+        icon: 'i-lucide-settings',
+        to: { name: 'account' },
+        active: (): boolean => false,
+      },
+    ]
+  }
+
+  return [
+    {
+      label: t('main'),
+      icon: 'i-lucide-house',
+      to: { name: 'user' },
+      active: (): boolean => false,
+    },
+    {
+      label: t('projects.title'),
+      icon: 'i-lucide-folder',
+      active: (): boolean => isSidebarOpen.value,
+      onClick: () => { isSidebarOpen.value = !isSidebarOpen.value },
+    },
+    {
+      label: t('projects.kanban'),
+      icon: 'i-lucide-kanban',
+      to: { name: 'kanban', params: { projectId: projectId.value } },
+      active: (): boolean => route.name === 'kanban',
+    },
+    {
+      label: t('projects.graph'),
+      icon: 'i-lucide-git-fork',
+      to: { name: 'graph', params: { projectId: projectId.value } },
+      active: (): boolean => route.name === 'graph',
+    },
+    {
+      label: t('projects.collaboration'),
+      icon: 'i-lucide-users',
+      to: { name: 'collaboration', params: { projectId: projectId.value } },
+      active: (): boolean => route.name === 'collaboration',
+    },
+    {
+      label: t('lists.title'),
+      icon: 'i-lucide-list',
+      to: { name: 'user', params: { projectId: projectId.value } },
+      active: (): boolean => isUserRoute.value && hasProject.value && !hasList.value,
+    },
+    {
+      label: t('tasks.allTasks'),
+      icon: 'i-lucide-list-checks',
+      to: { name: 'user', params: { projectId: projectId.value, listId: ALL_TASKS_LIST_ID } },
+      active: (): boolean => isUserRoute.value && hasList.value,
+    },
+  ]
+})
+</script>

web/src/components/features/collaboration/CollaborationPanel.vue

@@ -0,0 +1,163 @@
+<template>
+  <div class="p-4">
+    <div
+      v-if="!hasGoalSelected"
+      class="flex flex-col items-center justify-center h-64 text-muted"
+    >
+      <UIcon
+        name="i-lucide-users"
+        class="size-12 mb-4"
+      />
+      <p>{{ t('collaboration.selectProject') }}</p>
+    </div>
+
+    <template v-else>
+      <h2 class="text-lg font-semibold mb-4">
+        {{ projectName }}
+      </h2>
+      <UTabs
+        v-model="activeTab"
+        :items="tabs"
+        class="w-full"
+      >
+        <template #members>
+          <MembersList
+            :members="users"
+            :roles="roles"
+            :goal-id="projectId"
+            :loading="loading"
+            @invite="handleInvite"
+            @update-roles="handleUpdateMemberRoles"
+            @remove="handleRemoveMember"
+          />
+        </template>
+
+        <template #roles>
+          <RolesList
+            :roles="roles"
+            :permissions="permissions"
+            :roles-permissions="rolesPermissions"
+            :goal-id="projectId"
+            :loading="loading"
+            @create="handleCreateRole"
+            @toggle-permission="handleTogglePermission"
+            @delete="handleDeleteRole"
+          />
+        </template>
+      </UTabs>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+// import { useRoute } from 'vue-router'
+import { storeToRefs } from 'pinia'
+import { useCollaborationStore } from '@/stores/collaboration.store'
+import { useCollaborationRolesStore } from '@/stores/collaboration-roles.store'
+import { useCollaborationPermissionsStore } from '@/stores/collaboration-permissions.store'
+import MembersList from './parts/members/MembersList.vue'
+import RolesList from './parts/roles/RolesList.vue'
+import { useAppRouteInfo } from '@/composables/useAppRouteInfo'
+import { useGoalsStore } from '@/stores/goals.store'
+
+const { t } = useI18n()
+const { projectId } = useAppRouteInfo()
+const goalsStore = useGoalsStore()
+
+const projectName = computed(() => {
+  const goal = goalsStore.goalMap.get(projectId.value)
+  return goal?.name ?? ''
+})
+const collaborationStore = useCollaborationStore()
+const rolesStore = useCollaborationRolesStore()
+const permissionsStore = useCollaborationPermissionsStore()
+
+const { users } = storeToRefs(collaborationStore)
+const { roles, rolesPermissions } = storeToRefs(rolesStore)
+const { permissions } = storeToRefs(permissionsStore)
+
+const activeTab = ref('members')
+const loading = ref(false)
+
+const hasGoalSelected = computed(() => projectId.value > 0)
+
+const tabs = computed(() => [
+  {
+    label: t('collaboration.tabs.members'),
+    slot: 'members',
+    value: 'members',
+  },
+  {
+    label: t('collaboration.tabs.roles'),
+    slot: 'roles',
+    value: 'roles',
+  },
+])
+
+async function fetchData() {
+  if (!hasGoalSelected.value) {
+    return
+  }
+
+  loading.value = true
+  try {
+    await Promise.all([
+      collaborationStore.fetchCollaborationUsersForGoal(projectId.value),
+      rolesStore.fetchCollaborationRolesForGoal(projectId.value),
+      permissionsStore.fetchAllPermissions(),
+      rolesStore.fetchAllRolePermissionsForGoal(projectId.value),
+    ])
+  } finally {
+    loading.value = false
+  }
+}
+
+watch(projectId, () => {
+  fetchData()
+}, { immediate: true })
+
+async function handleInvite(email: string) {
+  await collaborationStore.addCollaborationUser({
+    goalId: projectId.value,
+    email,
+  })
+}
+
+async function handleUpdateMemberRoles(data: { userId: number; roles: number[] }) {
+  await collaborationStore.toggleUserRole({
+    userId: data.userId,
+    goalId: projectId.value,
+    roles: data.roles,
+  })
+}
+
+async function handleRemoveMember(userId: number) {
+  await collaborationStore.deleteUserFromCollaboration({
+    id: userId,
+    goalId: projectId.value,
+  })
+}
+
+async function handleCreateRole(roleName: string) {
+  await rolesStore.addCollaborationRole({
+    goalId: projectId.value,
+    roleName,
+  })
+}
+
+async function handleTogglePermission(data: { roleId: number; permissionId: number }) {
+  await rolesStore.togglePermissionForRole({
+    roleId: data.roleId,
+    permissionId: data.permissionId,
+  })
+}
+
+async function handleDeleteRole(roleId: number) {
+  await rolesStore.deleteCollaborationRole({
+    id: roleId,
+    goalId: projectId.value,
+  })
+}
+</script>

web/src/components/features/collaboration/parts/members/MemberAddInput.vue

@@ -0,0 +1,63 @@
+<template>
+  <UInput
+    v-model="email"
+    type="email"
+    :placeholder="t('collaboration.members.emailPlaceholder')"
+    size="xl"
+    variant="soft"
+    class="w-full"
+    :ui="{
+      base: 'bg-tv-ui-bg-elevated',
+    }"
+    @keydown.enter="addMember"
+  >
+    <template #trailing>
+      <UButton
+        v-if="isValid"
+        icon="i-lucide-corner-down-left"
+        color="primary"
+        variant="ghost"
+        size="xs"
+        :aria-label="t('collaboration.members.add')"
+        @click="addMember"
+      />
+      <UIcon
+        v-else
+        name="i-lucide-keyboard"
+        class="size-4 text-dimmed"
+      />
+    </template>
+  </UInput>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { type } from 'arktype'
+
+defineProps<{
+  loading?: boolean
+}>()
+
+const emit = defineEmits<{
+  add: [email: string]
+}>()
+
+const { t } = useI18n()
+
+const emailSchema = type('string.email')
+
+const email = ref('')
+
+const isValid = computed(() => {
+  const result = emailSchema(email.value)
+  return !(result instanceof type.errors)
+})
+
+function addMember() {
+  if (isValid.value) {
+    emit('add', email.value)
+    email.value = ''
+  }
+}
+</script>

web/src/components/features/collaboration/parts/members/MemberEditModal.vue

@@ -0,0 +1,111 @@
+<template>
+  <UModal
+    v-model:open="isOpen"
+    :title="t('collaboration.members.assignRoles')"
+  >
+    <template #body>
+      <div class="space-y-4">
+        <div class="flex items-center gap-3 p-3 bg-elevated rounded-lg">
+          <UAvatar
+            :alt="member?.email"
+            size="sm"
+          >
+            {{ member?.email?.slice(0, 2).toUpperCase() }}
+          </UAvatar>
+          <div>
+            <p class="text-sm font-medium">
+              {{ member?.email }}
+            </p>
+          </div>
+        </div>
+
+        <UFormField :label="t('collaboration.members.selectRoles')">
+          <div class="space-y-2">
+            <label
+              v-for="role in roles"
+              :key="role.id"
+              class="flex items-center gap-3 p-2 rounded hover:bg-elevated cursor-pointer"
+            >
+              <UCheckbox
+                :model-value="selectedRoleIds.includes(role.id)"
+                @update:model-value="toggleRole(role.id, $event)"
+              />
+              <div class="flex-1">
+                <p class="text-sm font-medium">
+                  {{ role.name }}
+                </p>
+              </div>
+            </label>
+          </div>
+        </UFormField>
+      </div>
+    </template>
+
+    <template #footer>
+      <div class="flex justify-end gap-2 w-full">
+        <UButton
+          :label="t('common.cancel')"
+          color="neutral"
+          variant="outline"
+          @click="isOpen = false"
+        />
+        <UButton
+          :label="t('common.save')"
+          color="primary"
+          variant="outline"
+          @click="handleSave"
+        />
+      </div>
+    </template>
+  </UModal>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import type { CollaborationResponseFetchAllUsers } from 'taskview-api'
+import type { CollaborationRole } from '@/types/collaboration-roles.types'
+
+const props = defineProps<{
+  member: CollaborationResponseFetchAllUsers | null
+  roles: CollaborationRole[]
+}>()
+
+const emit = defineEmits<{
+  save: [data: { userId: number; roles: number[] }]
+}>()
+
+const isOpen = defineModel<boolean>('open', { required: true })
+
+const { t } = useI18n()
+
+const selectedRoleIds = ref<number[]>([])
+
+watch(
+  () => props.member,
+  (member) => {
+    if (member) {
+      selectedRoleIds.value = [...member.roles]
+    }
+  },
+  { immediate: true },
+)
+
+function toggleRole(roleId: number, enabled: boolean | string) {
+  if (enabled) {
+    selectedRoleIds.value = [...selectedRoleIds.value, roleId]
+  } else {
+    selectedRoleIds.value = selectedRoleIds.value.filter(id => id !== roleId)
+  }
+}
+
+function handleSave() {
+  if (props.member) {
+    emit('save', {
+      userId: props.member.id,
+      roles: selectedRoleIds.value,
+    })
+    isOpen.value = false
+  }
+}
+</script>