Fix JSDoc errors: remove unsupported @constant tags and correct @param names

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

.env

@@ -0,0 +1,15 @@
+# The Lucia project.
+# Copyright 2023-2026 DSP, inc.  All rights reserved.
+# Authors:
+#   chiayin.kuo@dsp.im (chiayin), 2023/1/31
+#   imacat.yang@dsp.im (imacat), 2026/3/6
+#
+# Default environment variables.
+# Override in .env.local for local development.
+
+# Backend API URL for the dev server proxy.
+VUE_APP_API_URL = ""
+
+# Custom Vite cache directory (default: node_modules/.vite).
+# Set to /tmp/vite-cache for systemd deployment with PrivateTmp.
+VITE_CACHE_DIR = ""

.eslintrc.cjs

@@ -1,20 +0,0 @@
-/* eslint-env node */
-require("@rushstack/eslint-patch/modern-module-resolution");
-
-module.exports = {
-  root: true,
-  extends: [
-    "plugin:vue/vue3-essential",
-    "eslint:recommended",
-    "@vue/eslint-config-prettier",
-  ],
-  overrides: [
-    {
-      files: ["cypress/e2e/**/*.{cy,spec}.{js,ts,jsx,tsx}"],
-      extends: ["plugin:cypress/recommended"],
-    },
-  ],
-  parserOptions: {
-    ecmaVersion: "latest",
-  },
-};

.gitignore

@@ -32,11 +32,16 @@ vscode
 *.njsproj
 *.sln
 *.sw?
+.claude
 
 # local env files
-.env.demo
 .env.local
 .env.*.local
 
+# TypeDoc generated documentation
+/docs
+
 .scannerwork
 sonar-project.properties
+
+excludes

README.md

@@ -1,57 +1,174 @@
-# frontend
+# The Lucia Project Frontend
 
-This template should help get you started developing with Vue 3 in Vite.
+The frontend of the Lucia project, a process mining platform for
+analyzing, discovering, and comparing business process workflows.
 
-## Recommended IDE Setup
+Built with [Vue 3][vue], [Vite][vite], [Pinia][pinia],
+and [Tailwind CSS][tailwind].
 
-[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
 
-## Customize configuration
+## Features
 
-See [Vite Configuration Reference](https://vitejs.dev/config/).
+- **Files** -- Upload, browse, and manage event log files (CSV).
+- **Discover** -- Visualize process maps ([Cytoscape.js][cytoscape]),
+  analyze performance metrics ([Chart.js][chartjs]), and run
+  conformance checking against user-defined rules.
+- **Compare** -- Side-by-side comparison of process maps and
+  dashboards.
+- **Account Management** -- User account CRUD with role-based
+  access control.
 
-## Project Setup
+
+## Tech Stack
+
+| Category | Technologies |
+|----------|-------------|
+| Framework | Vue 3.5, Vue Router 5, Pinia 3 |
+| Build | Vite 7, TypeScript 5, Tailwind CSS 4 |
+| UI | PrimeVue 4, PrimeIcons, SweetAlert2 |
+| Visualization | Cytoscape.js (process maps), Chart.js (charts) |
+| HTTP | Axios with JWT refresh token handling |
+| Testing | Vitest 4 (unit/component), Cypress 15 (E2E) |
+| Linting | ESLint, Prettier |
+
+
+## Prerequisites
+
+- [Node.js][nodejs] (v18 or later)
+- npm
+
+
+## Getting Started
+
+### Install dependencies
 
 ```sh
-npm install
+npm ci
 ```
 
-### Compile and Hot-Reload for Development
+### Configure environment
+
+Copy `.env` to `.env.local` and set the backend API URL:
+
+```sh
+cp .env .env.local
+```
+
+```dotenv
+# .env.local
+VUE_APP_API_URL = "http://localhost:8000"
+```
+
+The dev server proxies `/api` requests to this URL.
+
+### Start development server
 
 ```sh
 npm run dev
 ```
 
-### Compile and Minify for Production
+The app will be available at `http://localhost:58249`.
+
+
+## Testing
+
+### Run unit and component tests
 
 ```sh
-npm run build
+npx vitest run
 ```
 
-### Run Unit Tests with [Vitest](https://vitest.dev/)
+### Run E2E tests
 
-```sh
-npm run test:unit
-```
-
-### Run End-to-End Tests with [Cypress](https://www.cypress.io/)
-
-```sh
-npm run test:e2e:dev
-```
-
-This runs the end-to-end tests against the Vite development server.
-It is much faster than the production build.
-
-But it's still recommended to test the production build with `test:e2e` before deploying (e.g. in CI environments):
+Build first, then run [Cypress][cypress] against the preview
+server:
 
 ```sh
 npm run build
 npm run test:e2e
 ```
 
-### Lint with [ESLint](https://eslint.org/)
+For interactive E2E development with the Vite dev server:
 
 ```sh
-npm run lint
+npm run test:e2e:dev
 ```
+
+
+## Documentation
+
+Generate API documentation with [TypeDoc][typedoc]:
+
+```sh
+npm run docs
+```
+
+Output is in the `docs/` directory. Open `docs/index.html` in a
+browser to view.
+
+
+## Build for Production
+
+```sh
+npm run build
+```
+
+Output is in the `dist/` directory. Preview locally with:
+
+```sh
+npm run preview
+```
+
+
+## Project Structure
+
+```
+src/
+├── api/            # Axios client with JWT interceptors
+├── assets/         # CSS (Tailwind), static assets
+├── components/     # Reusable Vue components
+│   ├── Discover/   #   Map, Conformance, Performance
+│   ├── Compare/    #   Comparison sidebar
+│   └── File/       #   Upload modal
+├── module/         # Business logic (alerts, charts, sorting)
+├── router/         # Vue Router configuration
+├── stores/         # Pinia stores (state management)
+├── utils/          # Utility functions (emitter, escaping)
+└── views/          # Page-level route components
+    ├── Discover/   #   Map, Performance, Conformance
+    ├── Compare/    #   Dashboard, MapCompare
+    ├── Files/      #   File browser
+    ├── Upload/     #   File upload
+    └── Login/      #   Authentication
+```
+
+
+## Copyright
+
+Copyright 2022-2026 DSP, inc. All rights reserved.
+
+This software is proprietary. You may obtain, use, copy, edit or
+update this software with written agreements from DSP, inc.
+
+
+## Authors
+
+- Chia-Yin Kuo (chiayin.kuo@dsp.im)
+- imacat (imacat.yang@dsp.im)
+
+
+## Acknowledgments
+
+Code quality improvements assisted by [Claude Code][claude-code].
+
+
+[vue]: https://vuejs.org/
+[vite]: https://vitejs.dev/
+[pinia]: https://pinia.vuejs.org/
+[tailwind]: https://tailwindcss.com/
+[cytoscape]: https://js.cytoscape.org/
+[chartjs]: https://www.chartjs.org/
+[nodejs]: https://nodejs.org/
+[cypress]: https://www.cypress.io/
+[typedoc]: https://typedoc.org/
+[claude-code]: https://claude.ai/claude-code

cypress.config.js

@@ -1,8 +1,25 @@
-/* eslint-env node */
+// The Lucia project.
+// Copyright 2023-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   chiayin.kuo@dsp.im (chiayin), 2023/1/31
+//   cindy.chang@dsp.im (Cindy Chang), 2024/8/12
+//   imacat.yang@dsp.im (imacat), 2026/3/5
+/**
+ * @module cypress.config
+ *   Cypress E2E test configuration with viewport
+ *   settings and base URL.
+ */
+
 const { defineConfig } = require("cypress");
 
 module.exports = defineConfig({
+  defaultCommandTimeout: 6000,
+  viewportWidth: 1280,
+  viewportHeight: 720,
   e2e: {
+    baseUrl: "http://localhost:4173",
     specPattern: "cypress/e2e/**/*.{cy,spec}.{js,jsx,ts,tsx}",
   },
+  includeShadowDom: true,
+  env: {},
 });

cypress/e2e/accountAdmin.cy.js

@@ -0,0 +1,34 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Account Management", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+  });
+
+  it("displays user list on account admin page", () => {
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+    // Should display users from fixture
+    cy.contains("Test Admin").should("exist");
+    cy.contains("Alice Wang").should("exist");
+    cy.contains("Bob Chen").should("exist");
+  });
+
+  it("shows active/inactive status badges", () => {
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+    // The user list should show status indicators
+    cy.contains("testadmin").should("exist");
+  });
+
+  it("navigates to my-account page", () => {
+    cy.visit("/my-account");
+    cy.wait("@getMyAccount");
+    cy.url().should("include", "/my-account");
+  });
+});

cypress/e2e/accountAdmin/accountDuplicationCheck.cy.js

@@ -0,0 +1,64 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   cindy.chang@dsp.im (Cindy Chang), 2024/07/03
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../../support/intercept";
+
+const MSG_ACCOUNT_NOT_UNIQUE = "Account has already been registered.";
+
+describe("Account duplication check.", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+  });
+
+  it("When an account already exists, show error message on confirm.", () => {
+    const testAccountName = "000000";
+
+    // First creation: account doesn't exist yet
+    cy.intercept("GET", "/api/users/000000", {
+      statusCode: 404,
+      body: { detail: "Not found" },
+    }).as("checkNewUser");
+
+    cy.contains("button", "Create New").should("be.visible").click();
+    cy.get("#input_account_field").type(testAccountName);
+    cy.get("#input_name_field").type(testAccountName);
+    cy.get("#input_first_pwd").type(testAccountName);
+    cy.get(".checkbox-and-text").first().find("div").first().click();
+
+    cy.contains("button", "Confirm")
+      .should("be.visible")
+      .and("be.enabled")
+      .click();
+    cy.wait("@postUser");
+    cy.contains("Account added").should("be.visible");
+
+    // Second creation: now account exists — override to return 200
+    cy.intercept("GET", "/api/users/000000", {
+      statusCode: 200,
+      body: {
+        username: "000000",
+        name: "000000",
+        is_admin: false,
+        is_active: true,
+        roles: [],
+      },
+    }).as("checkExistingUser");
+
+    cy.contains("button", "Create New").should("be.visible").click();
+    cy.get("#input_account_field").type(testAccountName);
+    cy.get("#input_name_field").type(testAccountName);
+    cy.get("#input_first_pwd").type(testAccountName);
+    cy.get(".checkbox-and-text").first().find("div").first().click();
+
+    cy.contains("button", "Confirm")
+      .should("be.visible")
+      .and("be.enabled")
+      .click();
+    cy.contains(MSG_ACCOUNT_NOT_UNIQUE).should("be.visible");
+  });
+});

cypress/e2e/accountAdmin/confirmPasswordMessage.cy.js

@@ -0,0 +1,36 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   cindy.chang@dsp.im (Cindy Chang), 2024/07/02
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../../support/intercept";
+
+describe("Password validation on create account.", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+  });
+
+  it("When password is too short, confirm button stays disabled.", () => {
+    cy.contains("button", "Create New").should("be.visible").click();
+
+    cy.get("#input_account_field").type("unit-test-0001");
+    cy.get("#input_name_field").type("unit-test-0001");
+    // Password shorter than 6 characters
+    cy.get("#input_first_pwd").type("aaa");
+
+    cy.contains("button", "Confirm").should("be.disabled");
+  });
+
+  it("When password meets minimum length, confirm button enables.", () => {
+    cy.contains("button", "Create New").should("be.visible").click();
+
+    cy.get("#input_account_field").type("unit-test-0001");
+    cy.get("#input_name_field").type("unit-test-0001");
+    cy.get("#input_first_pwd").type("aaaaaa");
+
+    cy.contains("button", "Confirm").should("be.enabled");
+  });
+});

cypress/e2e/accountAdmin/createAccount.cy.js

@@ -0,0 +1,42 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   cindy.chang@dsp.im (Cindy Chang), 2024/07/02
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../../support/intercept";
+
+describe("Create an Account", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    // Override: new usernames should return 404 (account doesn't exist yet)
+    cy.intercept("GET", "/api/users/unit-test-*", {
+      statusCode: 404,
+      body: { detail: "Not found" },
+    }).as("checkNewUser");
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+  });
+
+  it("Create a new account with admin role; should show saved message.", () => {
+    cy.contains("button", "Create New").should("be.visible").click();
+
+    cy.get("#input_account_field").type("unit-test-0001");
+    cy.get("#input_name_field").type("unit-test-0001");
+    cy.get("#input_first_pwd").type("aaaaaa");
+    cy.get(".checkbox-and-text").first().find("div").first().click();
+
+    cy.contains("button", "Confirm")
+      .should("be.visible")
+      .and("be.enabled")
+      .click();
+    cy.wait("@postUser");
+    cy.contains("Account added").should("be.visible");
+  });
+
+  it("Confirm button is disabled when required fields are empty.", () => {
+    cy.contains("button", "Create New").should("be.visible").click();
+    cy.get("#input_account_field").type("test");
+    cy.contains("button", "Confirm").should("be.disabled");
+  });
+});

cypress/e2e/accountAdmin/deleteAccount.cy.js

@@ -0,0 +1,30 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   cindy.chang@dsp.im (Cindy Chang), 2024/07/03
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../../support/intercept";
+
+describe("Delete an Account", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+  });
+
+  it("Delete button opens confirmation modal and deletes on confirm.", () => {
+    cy.get("img.delete-account").first().click();
+    cy.contains("ARE YOU SURE TO DELETE").should("be.visible");
+    cy.get("#sure_to_delete_acct_btn").click();
+    cy.wait("@deleteUser");
+    cy.contains("Account deleted").should("be.visible");
+  });
+
+  it("Cancel button closes the delete confirmation modal.", () => {
+    cy.get("img.delete-account").first().click();
+    cy.contains("ARE YOU SURE TO DELETE").should("be.visible");
+    cy.get("#calcel_delete_acct_btn").click();
+    cy.contains("ARE YOU SURE TO DELETE").should("not.exist");
+  });
+});

cypress/e2e/accountAdmin/editAccount.cy.js

@@ -0,0 +1,32 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   cindy.chang@dsp.im (Cindy Chang), 2024/07/03
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../../support/intercept";
+
+const MODAL_TITLE_ACCOUNT_EDIT = "Account Edit";
+const MSG_ACCOUNT_EDITED = "Saved";
+
+describe("Edit an account", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+  });
+
+  it("Edit an account; modify name and see saved message.", () => {
+    cy.get(".btn-edit").first().click();
+    cy.wait("@getUserDetail");
+
+    cy.contains("h1", MODAL_TITLE_ACCOUNT_EDIT).should("exist");
+    cy.get("#input_name_field").clear();
+    cy.get("#input_name_field").type("Updated Name");
+
+    cy.contains("button", "Confirm").should("be.visible").and("be.enabled");
+    cy.contains("button", "Confirm").click();
+    cy.wait("@putUser");
+    cy.contains(MSG_ACCOUNT_EDITED).should("be.visible");
+  });
+});

cypress/e2e/accountCrud.cy.js

@@ -0,0 +1,96 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Account Management CRUD", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+  });
+
+  it("shows Create New button", () => {
+    cy.get("#create_new_acct_btn").should("exist");
+    cy.get("#create_new_acct_btn").should("contain", "Create New");
+  });
+
+  it("opens create new account modal", () => {
+    cy.get("#create_new_acct_btn").click();
+    cy.get("#modal_container").should("be.visible");
+    cy.get("#modal_account_edit_or_create_new").should("be.visible");
+    // Should show account, name, password fields
+    cy.get("#input_account_field").should("exist");
+    cy.get("#input_name_field").should("exist");
+    cy.get("#input_first_pwd").should("exist");
+  });
+
+  it("create account confirm is disabled when fields are empty", () => {
+    cy.get("#create_new_acct_btn").click();
+    cy.get(".confirm-btn").should("be.disabled");
+  });
+
+  it("create account confirm enables when fields are filled", () => {
+    cy.get("#create_new_acct_btn").click();
+    cy.get("#input_account_field").type("newuser");
+    cy.get("#input_name_field").type("New User");
+    cy.get("#input_first_pwd").type("password1234");
+    cy.get(".confirm-btn").should("not.be.disabled");
+  });
+
+  it("cancel button closes the modal", () => {
+    cy.get("#create_new_acct_btn").click();
+    cy.get("#modal_container").should("be.visible");
+    cy.get(".cancel-btn").click();
+    cy.get("#modal_container").should("not.exist");
+  });
+
+  it("close (X) button closes the modal", () => {
+    cy.get("#create_new_acct_btn").click();
+    cy.get("#modal_container").should("be.visible");
+    cy.get('img[alt="X"]').click();
+    cy.get("#modal_container").should("not.exist");
+  });
+
+  it("double-click username opens account info modal", () => {
+    // Double-click on the first account username
+    cy.get(".account-cell").first().dblclick();
+    cy.get("#modal_container").should("be.visible");
+  });
+
+  it("delete button opens delete confirmation modal", () => {
+    // Click the delete icon for a non-current user
+    cy.get(".delete-account").first().click();
+    cy.get("#modal_container").should("be.visible");
+    cy.get("#modal_delete_acct_alert").should("be.visible");
+  });
+
+  it("delete modal has Yes and No buttons", () => {
+    cy.get(".delete-account").first().click();
+    cy.get("#calcel_delete_acct_btn").should("exist");
+    cy.get("#sure_to_delete_acct_btn").should("exist");
+  });
+
+  it("delete modal No button closes the modal", () => {
+    cy.get(".delete-account").first().click();
+    cy.get("#calcel_delete_acct_btn").click();
+    cy.get("#modal_container").should("not.exist");
+  });
+
+  it("shows checkboxes for Set as Admin and Activate in create modal", () => {
+    cy.get("#create_new_acct_btn").click();
+    cy.get("#account_create_checkboxes_section").should("be.visible");
+    cy.contains("Set as admin.").should("exist");
+    cy.contains("Activate now.").should("exist");
+  });
+
+  it("search bar filters user list", () => {
+    // Search filters by username, not display name
+    cy.get("#input_search").type("user1");
+    cy.get('img[alt="search"]').click();
+    // Should only show user1 (Alice Wang)
+    cy.contains("user1").should("exist");
+  });
+});

cypress/e2e/accountInfo.cy.js

@@ -0,0 +1,40 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Account Info Modal", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/account-admin");
+    cy.wait("@getUsers");
+  });
+
+  it("double-click username opens info modal with user data", () => {
+    cy.get(".account-cell").first().dblclick();
+    cy.get("#modal_container").should("be.visible");
+    cy.get("#acct_info_user_name").should("exist");
+  });
+
+  it("info modal shows Account Information header", () => {
+    cy.get(".account-cell").first().dblclick();
+    cy.get("#modal_container").should("be.visible");
+    cy.contains("Account Information").should("exist");
+  });
+
+  it("info modal shows account visit info", () => {
+    cy.get(".account-cell").first().dblclick();
+    cy.get("#modal_container").should("be.visible");
+    cy.get("#account_visit_info").should("exist");
+    cy.get("#account_visit_info").should("contain", "Account:");
+  });
+
+  it("info modal can be closed via X button", () => {
+    cy.get(".account-cell").first().dblclick();
+    cy.get("#modal_container").should("be.visible");
+    cy.get('img[alt="X"]').click();
+    cy.get("#modal_container").should("not.exist");
+  });
+});

cypress/e2e/compare.cy.js

@@ -0,0 +1,90 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   chiayin.kuo@dsp.im (chiayin), 2024/02/22
+//   cindy.chang@dsp.im (Cindy Chang), 2024/05/30
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Compare", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/files");
+    cy.wait("@getFiles");
+    cy.contains("li", "COMPARE").click();
+  });
+
+  it("Compare dropdown sorting options", () => {
+    const expectedOptions = [
+      "By File Name (A to Z)",
+      "By File Name (Z to A)",
+      "By Dependency (A to Z)",
+      "By Dependency (Z to A)",
+      "By File Type (A to Z)",
+      "By File Type (Z to A)",
+      "By Last Update (A to Z)",
+      "By Last Update (Z to A)",
+    ];
+
+    cy.get(".p-select").click();
+    cy.get(".p-select-list")
+      .find(".p-select-option")
+      .then(($options) => {
+        const actualOptions = $options
+          .map((index, elem) =>
+            Cypress.$(elem).find(".p-select-option-label").text(),
+          )
+          .get();
+        expect(actualOptions).to.deep.equal(expectedOptions);
+      });
+  });
+
+  it("Grid cards are rendered for compare file selection", () => {
+    cy.get("#compareGridCards").find("li").should("have.length.greaterThan", 0);
+  });
+
+  it("Compare button is disabled until two files are dragged", () => {
+    cy.contains("button", "Compare").should("be.disabled");
+    cy.get("#compareFile0").drag("#primaryDragCard");
+    cy.get("#compareFile1").drag("#secondaryDragCard");
+    cy.contains("button", "Compare").should("be.enabled");
+  });
+
+  it("Enter Compare dashboard and see charts", () => {
+    cy.get("#compareFile0").drag("#primaryDragCard");
+    cy.get("#compareFile1").drag("#secondaryDragCard");
+    cy.contains("button", "Compare").click();
+    cy.wait("@getCompare");
+    cy.url().should("include", "compare");
+
+    // Assert chart title spans are visible
+    cy.contains("span", "Average Cycle Time").should("exist");
+    cy.contains("span", "Cycle Efficiency").should("exist");
+    cy.contains("span", "Average Processing Time").should("exist");
+    cy.contains("span", "Average Processing Time by Activity").should("exist");
+    cy.contains("span", "Average Waiting Time").should("exist");
+    cy.contains("span", "Average Waiting Time between Activity").should(
+      "exist",
+    );
+  });
+
+  it("Compare State button exists on dashboard", () => {
+    cy.get("#compareFile0").drag("#primaryDragCard");
+    cy.get("#compareFile1").drag("#secondaryDragCard");
+    cy.contains("button", "Compare").click();
+    cy.wait("@getCompare");
+
+    cy.get("#compareState").should("exist").and("be.visible");
+  });
+
+  it("Sidebar shows time usage and frequency sections", () => {
+    cy.get("#compareFile0").drag("#primaryDragCard");
+    cy.get("#compareFile1").drag("#secondaryDragCard");
+    cy.contains("button", "Compare").click();
+    cy.wait("@getCompare");
+
+    cy.get("aside").should("exist");
+    cy.get("aside li").should("have.length.greaterThan", 0);
+  });
+});

cypress/e2e/discoverConformance.cy.js

@@ -0,0 +1,55 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Discover Conformance Page", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/discover/log/297310264/conformance");
+    cy.wait("@getLogCheckParams");
+  });
+
+  it("page loads and loading overlay disappears", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+  });
+
+  it("displays Rule Settings sidebar", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Rule Settings").should("be.visible");
+  });
+
+  it("displays Conformance Checking Results heading", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Conformance Checking Results").should("be.visible");
+  });
+
+  it("displays rule type radio options", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Have activity").should("be.visible");
+    cy.contains("Activity sequence").should("be.visible");
+    cy.contains("Activity duration").should("be.visible");
+    cy.contains("Processing time").should("be.visible");
+    cy.contains("Waiting time").should("be.visible");
+    cy.contains("Cycle time").should("be.visible");
+  });
+
+  it("displays Clear and Apply buttons", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("button", "Clear").should("be.visible");
+    cy.contains("button", "Apply").should("exist");
+  });
+
+  it("displays Activity list area", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Activity list").should("be.visible");
+  });
+
+  it("displays default placeholder values in results", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Conformance Rate").should("be.visible");
+    cy.contains("Cases").should("be.visible");
+  });
+});

cypress/e2e/discoverMap.cy.js

@@ -0,0 +1,55 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Discover Map Page", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/discover/log/297310264/map");
+    cy.wait("@getDiscover");
+  });
+
+  it("page loads and cytoscape container exists", () => {
+    cy.get("#cy").should("exist");
+  });
+
+  it("displays left sidebar buttons", () => {
+    // Visualization Setting, Filter, Traces buttons
+    cy.get(".material-symbols-outlined")
+      .contains("track_changes")
+      .should("exist");
+    cy.get(".material-symbols-outlined").contains("tornado").should("exist");
+    cy.get(".material-symbols-outlined").contains("rebase").should("exist");
+  });
+
+  it("displays right sidebar Summary button", () => {
+    cy.get("#sidebar_state").should("exist");
+    cy.get("#iconState").should("exist");
+  });
+
+  it("clicking Visualization Setting button toggles sidebar", () => {
+    // Click the track_changes icon (Visualization Setting)
+    cy.contains("span.material-symbols-outlined", "track_changes")
+      .parent("li")
+      .click();
+    // SidebarView should open
+    cy.contains("Visualization Setting").should("be.visible");
+  });
+
+  it("clicking Summary button toggles sidebar", () => {
+    cy.get("#iconState").click();
+    // SidebarState should open with insights/stats
+    cy.contains("Summary").should("be.visible");
+  });
+
+  it("clicking Traces button toggles sidebar", () => {
+    cy.contains("span.material-symbols-outlined", "rebase")
+      .parent("li")
+      .click();
+    // SidebarTraces should open
+    cy.contains("Traces").should("be.visible");
+  });
+});

cypress/e2e/discoverPerformance.cy.js

@@ -0,0 +1,66 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Discover Performance Page", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/discover/log/297310264/performance");
+    cy.wait("@getPerformance");
+  });
+
+  it("page loads and loading overlay disappears", () => {
+    // Loading overlay should not be visible after data loads
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+  });
+
+  it("displays Time Usage sidebar section", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Time Usage").should("be.visible");
+  });
+
+  it("displays Frequency sidebar section", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Frequency").should("be.visible");
+  });
+
+  it("displays sidebar navigation items", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Cycle Time & Efficiency").should("be.visible");
+    cy.contains("Processing Time").should("be.visible");
+    cy.contains("Waiting Time").should("be.visible");
+    cy.contains("Number of Cases").should("be.visible");
+  });
+
+  it("displays chart titles", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("Average Cycle Time").should("be.visible");
+    cy.contains("Cycle Efficiency").should("be.visible");
+    cy.contains("Average Processing Time").should("be.visible");
+    cy.contains("Average Processing Time by Activity").should("be.visible");
+    cy.contains("Average Waiting Time").should("be.visible");
+  });
+
+  it("displays frequency chart titles", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    cy.contains("New Cases").should("be.visible");
+    cy.contains("Number of Cases by Activity").should("be.visible");
+  });
+
+  it("renders canvas elements for charts", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    // Chart.js renders into canvas elements
+    cy.get("canvas").should("have.length.at.least", 5);
+  });
+
+  it("sidebar navigation scrolls to section", () => {
+    cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    // Click on "Waiting Time" in sidebar
+    cy.contains("li", "Waiting Time").click();
+    // The Waiting Time section should be in view
+    cy.get("#waitingTime").should("exist");
+  });
+});

cypress/e2e/discoverTabs.cy.js

@@ -0,0 +1,94 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Discover Tab Navigation", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+  });
+
+  describe("navigating from Map page", () => {
+    beforeEach(() => {
+      cy.visit("/discover/log/297310264/map");
+      cy.wait("@getDiscover");
+    });
+
+    it("shows DISCOVER heading and MAP/CONFORMANCE/PERFORMANCE tabs", () => {
+      cy.get("#nav_bar").contains("DISCOVER").should("be.visible");
+      cy.get(".nav-item").should("have.length", 3);
+      cy.get(".nav-item").eq(0).should("contain", "MAP");
+      cy.get(".nav-item").eq(1).should("contain", "CONFORMANCE");
+      cy.get(".nav-item").eq(2).should("contain", "PERFORMANCE");
+    });
+
+    it("clicking PERFORMANCE tab navigates to performance page", () => {
+      cy.get(".nav-item").contains("PERFORMANCE").click();
+      cy.url().should("include", "/performance");
+      cy.wait("@getPerformance");
+      cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+      cy.contains("Time Usage").should("be.visible");
+    });
+
+    it("clicking CONFORMANCE tab navigates to conformance page", () => {
+      cy.get(".nav-item").contains("CONFORMANCE").click();
+      cy.url().should("include", "/conformance");
+      cy.wait("@getLogCheckParams");
+      cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+      cy.contains("Rule Settings").should("be.visible");
+    });
+
+    it("shows back arrow to return to Files", () => {
+      cy.get("#backPage").should("exist");
+      cy.get("#backPage").should("have.attr", "href", "/files");
+    });
+  });
+
+  describe("navigating from Performance page", () => {
+    beforeEach(() => {
+      cy.visit("/discover/log/297310264/performance");
+      cy.wait("@getPerformance");
+      cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    });
+
+    it("clicking MAP tab navigates to map page", () => {
+      cy.get(".nav-item").contains("MAP").click();
+      cy.url().should("include", "/map");
+      cy.wait("@getDiscover");
+      cy.get("#cy").should("exist");
+    });
+
+    it("clicking CONFORMANCE tab navigates to conformance page", () => {
+      cy.get(".nav-item").contains("CONFORMANCE").click();
+      cy.url().should("include", "/conformance");
+      cy.wait("@getLogCheckParams");
+      cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+      cy.contains("Rule Settings").should("be.visible");
+    });
+  });
+
+  describe("navigating from Conformance page", () => {
+    beforeEach(() => {
+      cy.visit("/discover/log/297310264/conformance");
+      cy.wait("@getLogCheckParams");
+      cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+    });
+
+    it("clicking MAP tab navigates to map page", () => {
+      cy.get(".nav-item").contains("MAP").click();
+      cy.url().should("include", "/map");
+      cy.wait("@getDiscover");
+      cy.get("#cy").should("exist");
+    });
+
+    it("clicking PERFORMANCE tab navigates to performance page", () => {
+      cy.get(".nav-item").contains("PERFORMANCE").click();
+      cy.url().should("include", "/performance");
+      cy.wait("@getPerformance");
+      cy.get(String.raw`.z-\[9999\]`, { timeout: 10000 }).should("not.exist");
+      cy.contains("Time Usage").should("be.visible");
+    });
+  });
+});

cypress/e2e/edgeCases.cy.js

@@ -0,0 +1,94 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Edge Cases", () => {
+  describe("Empty states", () => {
+    it("files page handles empty file list", () => {
+      loginWithFixtures();
+      // Override files intercept with empty array
+      cy.intercept("GET", "/api/files", {
+        statusCode: 200,
+        body: [],
+      }).as("getEmptyFiles");
+      cy.visit("/files");
+      cy.wait("@getEmptyFiles");
+      // Table should exist but have no file data
+      cy.get("table").should("exist");
+      cy.contains("sample-process.xes").should("not.exist");
+    });
+
+    it("account admin handles empty user list", () => {
+      loginWithFixtures();
+      cy.intercept("GET", "/api/users", {
+        statusCode: 200,
+        body: [],
+      }).as("getEmptyUsers");
+      cy.visit("/account-admin");
+      cy.wait("@getEmptyUsers");
+      // Create New button should still work
+      cy.get("#create_new_acct_btn").should("exist");
+    });
+  });
+
+  describe("Authentication guard", () => {
+    it("unauthenticated user is redirected to login", () => {
+      // No loginWithFixtures - not logged in
+      cy.visit("/files");
+      cy.url().should("include", "/login");
+    });
+
+    it("unauthenticated user cannot access account-admin", () => {
+      cy.visit("/account-admin");
+      cy.url().should("include", "/login");
+    });
+
+    it("unauthenticated user cannot access my-account", () => {
+      cy.visit("/my-account");
+      cy.url().should("include", "/login");
+    });
+  });
+
+  describe("Login validation", () => {
+    it("shows error on failed login", () => {
+      cy.intercept("POST", "/api/oauth/token", {
+        statusCode: 401,
+        body: { detail: "Invalid credentials" },
+      }).as("failedLogin");
+      cy.visit("/login");
+      cy.get("#account").type("wrong");
+      cy.get("#password").type("wrong");
+      cy.get("form").submit();
+      cy.wait("@failedLogin");
+      // Should stay on login page
+      cy.url().should("include", "/login");
+    });
+  });
+
+  describe("Account creation validation", () => {
+    beforeEach(() => {
+      loginWithFixtures();
+      cy.visit("/account-admin");
+      cy.wait("@getUsers");
+      cy.get("#create_new_acct_btn").click();
+    });
+
+    it("confirm stays disabled with only account field filled", () => {
+      cy.get("#input_account_field").type("newuser");
+      cy.get(".confirm-btn").should("be.disabled");
+    });
+
+    it("confirm stays disabled with only name field filled", () => {
+      cy.get("#input_name_field").type("New User");
+      cy.get(".confirm-btn").should("be.disabled");
+    });
+
+    it("confirm stays disabled with only password field filled", () => {
+      cy.get("#input_first_pwd").type("password1234");
+      cy.get(".confirm-btn").should("be.disabled");
+    });
+  });
+});

cypress/e2e/fileOperations.cy.js

@@ -0,0 +1,74 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("File Operations", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/files");
+    cy.wait("@getFiles");
+  });
+
+  it("file list table has sortable columns", () => {
+    // Check that table headers exist with expected columns
+    cy.get("table").within(() => {
+      cy.contains("th", "Name").should("exist");
+      cy.contains("th", "Dependency").should("exist");
+      cy.contains("th", "File Type").should("exist");
+      cy.contains("th", "Owner").should("exist");
+      cy.contains("th", "Last Update").should("exist");
+    });
+  });
+
+  it("clicking column header sorts the table", () => {
+    // Click "Name" header to sort
+    cy.contains("th", "Name").click();
+    // After sorting, table should still have data
+    cy.get("table tbody tr").should("have.length.greaterThan", 0);
+  });
+
+  it("table rows show file data from fixture", () => {
+    cy.get("table tbody").within(() => {
+      cy.contains("sample-process.xes").should("exist");
+      cy.contains("filtered-sample").should("exist");
+      cy.contains("production-log.csv").should("exist");
+    });
+  });
+
+  it("table shows owner names", () => {
+    cy.get("table tbody").within(() => {
+      cy.contains("Test Admin").should("exist");
+      cy.contains("Alice Wang").should("exist");
+    });
+  });
+
+  it("table shows file types", () => {
+    cy.get("table tbody").within(() => {
+      cy.contains("log").should("exist");
+    });
+  });
+
+  it("right-click on file row shows context menu", () => {
+    // PrimeVue DataTable with contextmenu
+    cy.get("table tbody tr").first().rightclick();
+    // Context menu behavior depends on implementation
+    // Just verify the right-click doesn't break anything
+    cy.get("table tbody tr").should("have.length.greaterThan", 0);
+  });
+
+  it("grid view shows file cards", () => {
+    // Switch to grid view
+    cy.get("svg").parent("li.cursor-pointer").last().click();
+    // Grid cards should be visible
+    cy.get("li[title]").should("have.length.greaterThan", 0);
+  });
+
+  it("Import button opens upload modal", () => {
+    cy.get("#import_btn").click();
+    // Upload modal should appear
+    cy.get("#import_btn").should("exist");
+  });
+});

cypress/e2e/files.cy.js

@@ -0,0 +1,60 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Files Page", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/files");
+  });
+
+  it("displays the file list after login", () => {
+    cy.wait("@getFiles");
+    cy.contains("h2", "All Files").should("exist");
+    // Should display file names from fixture
+    cy.contains("sample-process.xes").should("exist");
+    cy.contains("filtered-sample").should("exist");
+    cy.contains("production-log.csv").should("exist");
+  });
+
+  it("shows Recently Used section", () => {
+    cy.wait("@getFiles");
+    cy.contains("h2", "Recently Used").should("exist");
+  });
+
+  it("switches to DISCOVER tab", () => {
+    cy.wait("@getFiles");
+    cy.contains(".nav-item", "DISCOVER").click();
+    // DISCOVER tab shows filtered file types
+    cy.contains("h2", "All Files").should("exist");
+  });
+
+  it("switches to COMPARE tab and shows drag zones", () => {
+    cy.wait("@getFiles");
+    cy.contains(".nav-item", "COMPARE").click();
+    cy.contains("Performance Comparison").should("exist");
+    cy.contains("Drag and drop a file here").should("exist");
+  });
+
+  it("shows Import button on FILES tab", () => {
+    cy.wait("@getFiles");
+    cy.get("#import_btn").should("contain", "Import");
+  });
+
+  it("can switch between list and grid view", () => {
+    cy.wait("@getFiles");
+    // DataTable (list view) should be visible by default
+    cy.get("table").should("exist");
+  });
+
+  it("double-click file navigates to discover page", () => {
+    cy.wait("@getFiles");
+    // Double-click the first file row in the table
+    // The actual route depends on file type (log→map, log-check→conformance, etc.)
+    cy.get("table tbody tr").first().dblclick();
+    cy.url().should("include", "/discover");
+  });
+});

cypress/e2e/filesCompare.cy.js

@@ -0,0 +1,49 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Files Page - COMPARE Tab", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/files");
+    cy.wait("@getFiles");
+    // Switch to COMPARE tab
+    cy.contains("li", "COMPARE").click();
+  });
+
+  it("shows Performance Comparison heading", () => {
+    cy.contains("h2", "Performance Comparison").should("be.visible");
+  });
+
+  it("shows two drag-and-drop slots", () => {
+    cy.get("#primaryDragCard").should("exist");
+    cy.get("#secondaryDragCard").should("exist");
+  });
+
+  it("drag slots show placeholder text", () => {
+    cy.get("#primaryDragCard").should("contain", "Drag and drop a file here");
+    cy.get("#secondaryDragCard").should("contain", "Drag and drop a file here");
+  });
+
+  it("Compare button is disabled when no files are dragged", () => {
+    cy.contains("button", "Compare").should("be.disabled");
+  });
+
+  it("shows sorting dropdown", () => {
+    cy.get(".p-select").should("exist");
+  });
+
+  it("grid cards display file names", () => {
+    cy.get("#compareGridCards").should("exist");
+    cy.get("#compareGridCards li").should("have.length.greaterThan", 0);
+  });
+
+  it("clicking sorting dropdown shows sort options", () => {
+    cy.get(".p-select").click();
+    cy.get(".p-select-list").should("be.visible");
+    cy.contains(".p-select-option", "By File Name").should("exist");
+  });
+});

cypress/e2e/filesToDiscover.cy.js

@@ -0,0 +1,72 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Files to Discover Entry Flow", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/files");
+    cy.wait("@getFiles");
+  });
+
+  describe("double-click table row to enter Discover", () => {
+    it("double-click log file navigates to Map page", () => {
+      // Target the Name column (has class .fileName) to avoid matching Dependency column
+      cy.contains("td.fileName", "sample-process.xes").parent("tr").dblclick();
+      cy.url().should("include", "/discover/log/1/map");
+      cy.wait("@getDiscover");
+      cy.get("#cy").should("exist");
+    });
+
+    it("double-click filter file navigates to Map page", () => {
+      cy.contains("td.fileName", "filtered-sample").parent("tr").dblclick();
+      cy.url().should("include", "/discover/filter/10/map");
+      cy.wait("@getFilterDiscover");
+      cy.get("#cy").should("exist");
+    });
+  });
+
+  describe("double-click grid card to enter Discover", () => {
+    beforeEach(() => {
+      // Switch to grid view
+      cy.get("svg").parent("li.cursor-pointer").last().click();
+    });
+
+    it("double-click log file grid card navigates to Map page", () => {
+      // Use last() to target the All Files grid section (not Recently Used)
+      cy.get('li[title="sample-process.xes"]').last().dblclick();
+      cy.url().should("include", "/discover/log/1/map");
+      cy.wait("@getDiscover");
+      cy.get("#cy").should("exist");
+    });
+  });
+
+  describe("DISCOVER tab filters files", () => {
+    it("clicking DISCOVER tab shows only Log, Filter, and Rule files", () => {
+      cy.get(".nav-item").contains("DISCOVER").click();
+      cy.contains("td.fileName", "sample-process.xes").should("exist");
+      cy.contains("td.fileName", "filtered-sample").should("exist");
+      cy.contains("td.fileName", "conformance-check-1").should("exist");
+    });
+  });
+
+  describe("Navbar state after entering Discover", () => {
+    it("shows DISCOVER heading and tabs after entering from Files", () => {
+      cy.contains("td.fileName", "sample-process.xes").parent("tr").dblclick();
+      cy.url().should("include", "/discover/");
+      cy.get("#nav_bar").contains("DISCOVER").should("be.visible");
+      cy.get(".nav-item").contains("MAP").should("exist");
+      cy.get(".nav-item").contains("CONFORMANCE").should("exist");
+      cy.get(".nav-item").contains("PERFORMANCE").should("exist");
+    });
+
+    it("shows back arrow pointing to /files", () => {
+      cy.contains("td.fileName", "sample-process.xes").parent("tr").dblclick();
+      cy.url().should("include", "/discover/");
+      cy.get("#backPage").should("have.attr", "href", "/files");
+    });
+  });
+});

cypress/e2e/jsconfig.json

@@ -4,5 +4,10 @@
     "lib": ["es5", "dom"],
     "types": ["cypress"]
   },
-  "include": ["./**/*", "../support/**/*"]
+  "include": [
+    "./**/*",
+    "../support/**/*",
+    "/node_modules/cypress",
+    "cypress/**/*.js",],
+    "experimentalShadowDomSupport": true
 }

cypress/e2e/login.cy.js

@@ -0,0 +1,76 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { setupApiIntercepts } from "../support/intercept";
+
+describe("Login Flow", () => {
+  beforeEach(() => {
+    setupApiIntercepts();
+  });
+
+  it("renders the login form", () => {
+    cy.visit("/login");
+    cy.get("h2").should("contain", "LOGIN");
+    cy.get("#account").should("exist");
+    cy.get("#password").should("exist");
+    cy.get("#login_btn_main_btn").should("be.disabled");
+  });
+
+  it("login button is disabled when fields are empty", () => {
+    cy.visit("/login");
+    cy.get("#login_btn_main_btn").should("be.disabled");
+
+    // Only username filled — still disabled
+    cy.get("#account").type("testuser");
+    cy.get("#login_btn_main_btn").should("be.disabled");
+  });
+
+  it("login button enables when both fields are filled", () => {
+    cy.visit("/login");
+    cy.get("#account").type("testadmin");
+    cy.get("#password").type("password123");
+    cy.get("#login_btn_main_btn").should("not.be.disabled");
+  });
+
+  it("successful login redirects to /files", () => {
+    cy.visit("/login");
+    cy.get("#account").type("testadmin");
+    cy.get("#password").type("password123");
+    cy.get("#login_btn_main_btn").click();
+
+    cy.wait("@postToken");
+    cy.url().should("include", "/files");
+  });
+
+  it("failed login shows error message", () => {
+    // Override the token intercept to return 401
+    cy.intercept("POST", "/api/oauth/token", {
+      statusCode: 401,
+      body: { detail: "Incorrect username or password" },
+    }).as("postTokenFail");
+
+    cy.visit("/login");
+    cy.get("#account").type("wronguser");
+    cy.get("#password").type("wrongpass");
+    cy.get("#login_btn_main_btn").click();
+
+    cy.wait("@postTokenFail");
+    cy.contains("Incorrect account or password").should("be.visible");
+  });
+
+  it("toggles password visibility", () => {
+    cy.visit("/login");
+    cy.get("#password").type("secret123");
+    cy.get("#password").should("have.attr", "type", "password");
+
+    // Click the eye icon to show password
+    cy.get('label[for="passwordt"] span.cursor-pointer').click();
+    cy.get("#password").should("have.attr", "type", "text");
+
+    // Click again to hide
+    cy.get('label[for="passwordt"] span.cursor-pointer').click();
+    cy.get("#password").should("have.attr", "type", "password");
+  });
+});

cypress/e2e/loginToLogout.cy.js

@@ -1,44 +0,0 @@
-// 之後要優化: 每一個測試步驟要分開寫，不寫在同一個 it 裡面、將測試寫成 report 輸出成 html(嘗試)、功能模組化
-const baseUrl = Cypress.env('baseUrl');
-
-describe("Login to Logout", () => {
-  before(() => {
-    cy.visit(baseUrl); // 測試可否進入網站
-    cy.contains("h2", "LOGIN"); // 是否轉址到 /login 並顯示畫面
-    cy.url().should('include', 'login') // url path 要有 'Login'，確定進入 login page
-  })
-
-  it("test login success and error", () => {
-    // 驗證帳密是否刪除前後空白、錯誤帳密是否顯示驗證、Button display
-    cy.fixture('users/id-not-exists').then(({username, password}) => {
-      cy.get('.btn-lg').should('be.disabled');
-      cy.get('#account').should('have.focus').type(username);
-      cy.get('.btn-lg').should('be.disabled');
-      cy.get('#password').type(password);
-      cy.get('.btn-lg').click();
-      cy.get('#account').should('have.value', 'test');
-      cy.get('#password').should('have.value', 'test');
-      cy.get('form').submit();
-      cy.contains("p", "Incorrect account or password.");
-      cy.url().should('include', 'login');
-    });
-
-    // 正確帳密登入
-    cy.get('#account').clear().type(`   ${Cypress.env('user').username}   `);
-    cy.get('#password').clear().type(`   ${Cypress.env('user').password}   `);
-    cy.get('.btn-lg').click();
-    cy.get('#account').should('have.value', Cypress.env('user').username);
-    cy.get('#password').should('have.value', Cypress.env('user').password);
-    cy.get('form').submit(); // 選取 form 表單並發送
-
-    // 轉址到 files 頁
-    cy.url().should('include', 'files');
-    cy.get('a #iconMember').scrollIntoView().click();
-
-    // 轉址到會員頁
-    cy.url().should('include', 'member-area');
-
-    // 登出
-    cy.get('.btn-sm').contains('log out').click();
-  });
-});

cypress/e2e/logout.cy.js

@@ -0,0 +1,67 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Logout Flow", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+  });
+
+  it("shows account menu when head icon is clicked", () => {
+    cy.visit("/files");
+    cy.wait("@getFiles");
+
+    // Click the head icon to open account menu
+    cy.get("#acct_mgmt_button").click();
+    cy.get("#account_menu").should("be.visible");
+    cy.get("#greeting").should("contain", "Test Admin");
+  });
+
+  it("account menu shows admin management link for admin user", () => {
+    cy.visit("/files");
+    cy.wait("@getFiles");
+
+    cy.get("#acct_mgmt_button").click();
+    cy.get("#account_menu").should("be.visible");
+    // Admin user should see account management option
+    cy.get("#btn_acct_mgmt").should("exist");
+  });
+
+  it("account menu has logout button", () => {
+    cy.visit("/files");
+    cy.wait("@getFiles");
+
+    cy.get("#acct_mgmt_button").click();
+    cy.get("#btn_logout_in_menu").should("exist");
+  });
+
+  it("clicking My Account navigates to /my-account", () => {
+    cy.visit("/files");
+    cy.wait("@getFiles");
+
+    cy.get("#acct_mgmt_button").click();
+    cy.get("#btn_mang_ur_acct").click();
+    cy.url().should("include", "/my-account");
+  });
+
+  it("clicking Account Management navigates to /account-admin", () => {
+    cy.visit("/files");
+    cy.wait("@getFiles");
+
+    cy.get("#acct_mgmt_button").click();
+    cy.get("#btn_acct_mgmt").click();
+    cy.url().should("include", "/account-admin");
+  });
+
+  it("logout redirects to login page", () => {
+    cy.visit("/files");
+    cy.wait("@getFiles");
+
+    cy.get("#acct_mgmt_button").click();
+    cy.get("#btn_logout_in_menu").click();
+    cy.url().should("include", "/login");
+  });
+});

cypress/e2e/myAccount.cy.js

@@ -0,0 +1,73 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("My Account Page", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/my-account");
+    cy.wait("@getUserDetail");
+  });
+
+  it("displays user name heading", () => {
+    cy.get("#general_acct_info_user_name").should("exist");
+    cy.get("#general_acct_info_user_name").should("contain", "Test Admin");
+  });
+
+  it("shows Admin badge for admin user", () => {
+    cy.contains("Admin").should("exist");
+  });
+
+  it("shows visit count info", () => {
+    cy.get("#general_account_visit_info").should("exist");
+    cy.get("#general_account_visit_info").should("contain", "Total visits");
+  });
+
+  it("displays account username (read-only)", () => {
+    cy.contains("Test Admin").should("exist");
+  });
+
+  it("shows Edit button for name field", () => {
+    cy.contains("button", "Edit").should("exist");
+  });
+
+  it("clicking Edit shows input field and Save/Cancel buttons", () => {
+    cy.contains("button", "Edit").first().click();
+    cy.get("#input_name_field").should("exist");
+    cy.contains("button", "Save").should("exist");
+    cy.contains("button", "Cancel").should("exist");
+  });
+
+  it("clicking Cancel reverts name field to read-only", () => {
+    cy.contains("button", "Edit").first().click();
+    cy.get("#input_name_field").should("exist");
+    cy.contains("button", "Cancel").click();
+    cy.get("#input_name_field").should("not.exist");
+  });
+
+  it("shows Reset button for password field", () => {
+    cy.contains("button", "Reset").should("exist");
+  });
+
+  it("clicking Reset shows password input and Save/Cancel", () => {
+    cy.contains("button", "Reset").click();
+    cy.get('input[type="password"]').should("exist");
+    cy.contains("button", "Save").should("exist");
+    cy.contains("button", "Cancel").should("exist");
+  });
+
+  it("clicking Cancel on password field hides the input", () => {
+    cy.contains("button", "Reset").click();
+    cy.get('input[type="password"]').should("exist");
+    // The Cancel button for password is the second one
+    cy.get(".cancel-btn").click();
+    cy.get('input[type="password"]').should("not.exist");
+  });
+
+  it("shows Session section", () => {
+    cy.contains("Session").should("exist");
+  });
+});

cypress/e2e/navigation.cy.js

@@ -0,0 +1,62 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures, setupApiIntercepts } from "../support/intercept";
+
+describe("Navigation and Routing", () => {
+  it("redirects / to /files when logged in", () => {
+    loginWithFixtures();
+    cy.visit("/");
+    cy.url().should("include", "/files");
+  });
+
+  it("shows 404 page for unknown routes", () => {
+    loginWithFixtures();
+    cy.visit("/nonexistent-page");
+    cy.contains("404").should("exist");
+  });
+
+  it("navbar shows correct view name", () => {
+    loginWithFixtures();
+    cy.visit("/files");
+    cy.wait("@getFiles");
+    cy.get("#nav_bar").should("exist");
+    cy.get("#nav_bar h2").should("contain", "FILES");
+  });
+
+  it("navbar shows back arrow on non-files pages", () => {
+    loginWithFixtures();
+    cy.visit("/discover/log/1/map");
+    // Back arrow should be visible on discover pages
+    cy.get("#backPage").should("exist");
+  });
+
+  it("navbar tabs are clickable on discover page", () => {
+    loginWithFixtures();
+    cy.visit("/discover/log/1/map");
+    // Discover navbar should show MAP, CONFORMANCE, PERFORMANCE tabs
+    cy.contains(".nav-item", "MAP").should("exist");
+    cy.contains(".nav-item", "CONFORMANCE").should("exist");
+    cy.contains(".nav-item", "PERFORMANCE").should("exist");
+
+    // Click CONFORMANCE tab
+    cy.contains(".nav-item", "CONFORMANCE").click();
+    cy.url().should("include", "/conformance");
+
+    // Click PERFORMANCE tab
+    cy.contains(".nav-item", "PERFORMANCE").click();
+    cy.url().should("include", "/performance");
+
+    // Click MAP tab to go back
+    cy.contains(".nav-item", "MAP").click();
+    cy.url().should("include", "/map");
+  });
+
+  it("login page is accessible at /login", () => {
+    setupApiIntercepts();
+    cy.visit("/login");
+    cy.get("h2").should("contain", "LOGIN");
+  });
+});

cypress/e2e/notFound404.cy.js

@@ -0,0 +1,36 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("404 Not Found Page", () => {
+  it("displays 404 page for non-existent route", () => {
+    loginWithFixtures();
+    cy.visit("/this-page-does-not-exist");
+    cy.contains("404").should("be.visible");
+    cy.contains("The page you are looking for does not exist.").should(
+      "be.visible",
+    );
+  });
+
+  it("has a link back to Files page", () => {
+    loginWithFixtures();
+    cy.visit("/some/random/path");
+    cy.contains("a", "Go to Files")
+      .should("be.visible")
+      .should("have.attr", "href", "/files");
+  });
+
+  it("displays 404 for unauthenticated user on invalid route", () => {
+    cy.visit("/not-a-real-page");
+    cy.url().then((url) => {
+      if (url.includes("/login")) {
+        cy.url().should("include", "/login");
+      } else {
+        cy.contains("404").should("be.visible");
+      }
+    });
+  });
+});

cypress/e2e/pageAdmin.cy.js

@@ -0,0 +1,38 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   cindy.chang@dsp.im (Cindy Chang), 2024/06/03
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("Discover page navigation tabs", () => {
+  beforeEach(() => {
+    loginWithFixtures();
+    cy.visit("/files");
+    cy.wait("@getFiles");
+  });
+
+  it("Double-clicking a log file enters the MAP page.", () => {
+    cy.contains("td.fileName", "sample-process.xes").dblclick();
+    cy.url().should("include", "map");
+    // MAP tab should exist in the navbar
+    cy.contains(".nav-item", "MAP").should("exist");
+  });
+
+  it("Clicking CONFORMANCE tab switches active page.", () => {
+    cy.contains("td.fileName", "sample-process.xes").dblclick();
+    cy.url().should("include", "map");
+    cy.contains(".nav-item", "CONFORMANCE").click();
+    cy.url().should("include", "conformance");
+    cy.contains(".nav-item", "CONFORMANCE").should("have.class", "active");
+  });
+
+  it("Clicking PERFORMANCE tab switches active page.", () => {
+    cy.contains("td.fileName", "sample-process.xes").dblclick();
+    cy.url().should("include", "map");
+    cy.contains(".nav-item", "PERFORMANCE").click();
+    cy.url().should("include", "performance");
+    cy.contains(".nav-item", "PERFORMANCE").should("have.class", "active");
+  });
+});

cypress/e2e/pasteUrlLoginRedirect.cy.js

@@ -0,0 +1,58 @@
+// The Lucia project.
+// Copyright 2024-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   cindy.chang@dsp.im (Cindy Chang), 2024/06/11
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { setupApiIntercepts } from "../support/intercept";
+
+describe("Paste URL login redirect", () => {
+  it("After login with return-to param, redirects to the remembered page", () => {
+    setupApiIntercepts();
+
+    // Visit login page with a return-to query param (base64-encoded URL)
+    const targetUrl =
+      "http://localhost:4173/discover/conformance/log/1/conformance";
+    const encodedUrl = btoa(targetUrl);
+    cy.visit(`/login?return-to=${encodedUrl}`);
+
+    // Fill in login form
+    cy.get("#account").type("testadmin");
+    cy.get("#password").type("password123");
+    cy.get("form").submit();
+    cy.wait("@postToken");
+
+    // After login, the app should attempt to redirect to the return-to URL.
+    // Since window.location.href is used (not router.push), we verify the
+    // login form disappears and the token cookie is set.
+    cy.getCookie("luciaToken").should("exist");
+  });
+
+  it("Login without return-to param redirects to /files", () => {
+    setupApiIntercepts();
+    cy.visit("/login");
+
+    cy.get("#account").type("testadmin");
+    cy.get("#password").type("password123");
+    cy.get("form").submit();
+    cy.wait("@postToken");
+
+    cy.url().should("include", "/files");
+  });
+
+  it("Unauthenticated user cannot access inner pages", () => {
+    setupApiIntercepts();
+    // Override my-account to return 401 (simulate logged-out state)
+    cy.intercept("GET", "/api/my-account", {
+      statusCode: 401,
+      body: { detail: "Not authenticated" },
+    }).as("getMyAccountUnauth");
+
+    cy.visit("/files");
+
+    // Should be redirected to login page
+    cy.url().should("include", "/login");
+    cy.get("#account").should("exist");
+    cy.get("#password").should("exist");
+  });
+});

cypress/e2e/sweetAlertModals.cy.js

@@ -0,0 +1,116 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+import { loginWithFixtures } from "../support/intercept";
+
+describe("SweetAlert2 Modals", () => {
+  describe("File Context Menu - Rename", () => {
+    beforeEach(() => {
+      loginWithFixtures();
+      cy.visit("/files");
+      cy.wait("@getFiles");
+    });
+
+    it("right-click on table row shows context menu with Rename", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Rename").should("be.visible");
+    });
+
+    it("right-click context menu shows Download option", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Download").should("be.visible");
+    });
+
+    it("right-click context menu shows Delete option", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Delete").should("be.visible");
+    });
+
+    it("clicking Rename opens SweetAlert rename dialog", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Rename").click();
+      // SweetAlert popup should appear with RENAME title
+      cy.get(".swal2-popup").should("be.visible");
+      cy.get(".swal2-title").should("contain", "RENAME");
+      cy.get(".swal2-input").should("exist");
+    });
+
+    it("rename dialog has pre-filled file name", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Rename").click();
+      cy.get(".swal2-input").should("not.have.value", "");
+    });
+
+    it("rename dialog can be cancelled", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Rename").click();
+      cy.get(".swal2-popup").should("be.visible");
+      cy.get(".swal2-cancel").click();
+      cy.get(".swal2-popup").should("not.exist");
+    });
+
+    it("clicking Delete opens SweetAlert delete confirmation", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Delete").click();
+      // SweetAlert popup should appear with CONFIRM DELETION
+      cy.get(".swal2-popup").should("be.visible");
+      cy.get(".swal2-title").should("contain", "CONFIRM DELETION");
+    });
+
+    it("delete confirmation shows file name", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Delete").click();
+      cy.get(".swal2-popup").should("be.visible");
+      cy.get(".swal2-html-container").should("contain", "delete");
+    });
+
+    it("delete confirmation can be cancelled", () => {
+      cy.get("table tbody tr").first().rightclick();
+      cy.contains("Delete").click();
+      cy.get(".swal2-popup").should("be.visible");
+      cy.get(".swal2-cancel").click();
+      cy.get(".swal2-popup").should("not.exist");
+    });
+  });
+
+  describe("File Context Menu on Grid View", () => {
+    beforeEach(() => {
+      loginWithFixtures();
+      cy.visit("/files");
+      cy.wait("@getFiles");
+      // Switch to grid view
+      cy.get("svg").parent("li.cursor-pointer").last().click();
+    });
+
+    it("right-click on grid card shows context menu", () => {
+      cy.get("li[title]").first().rightclick();
+      cy.contains("Rename").should("be.visible");
+      cy.contains("Delete").should("be.visible");
+    });
+
+    it("grid card rename opens SweetAlert dialog", () => {
+      cy.get("li[title]").first().rightclick();
+      cy.contains("Rename").click();
+      cy.get(".swal2-popup").should("be.visible");
+      cy.get(".swal2-title").should("contain", "RENAME");
+    });
+  });
+
+  describe("Account Delete Confirmation", () => {
+    beforeEach(() => {
+      loginWithFixtures();
+      cy.visit("/account-admin");
+      cy.wait("@getUsers");
+    });
+
+    it("delete confirmation Yes button triggers delete API", () => {
+      cy.get(".delete-account").first().click();
+      cy.get("#modal_container").should("be.visible");
+      cy.get("#sure_to_delete_acct_btn").click();
+      cy.wait("@deleteUser");
+      // Modal should close after deletion
+    });
+  });
+});

cypress/fixtures/api/compare.json

@@ -0,0 +1,92 @@
+{
+  "time": {
+    "avg_cycle_time": {
+      "primary": [
+        { "date": "2022-01-15", "value": 500000 },
+        { "date": "2022-06-15", "value": 600000 },
+        { "date": "2022-12-15", "value": 550000 }
+      ],
+      "secondary": [
+        { "date": "2022-01-15", "value": 480000 },
+        { "date": "2022-06-15", "value": 520000 },
+        { "date": "2022-12-15", "value": 510000 }
+      ]
+    },
+    "avg_cycle_efficiency": {
+      "primary": [
+        { "label": "File A", "value": 0.75 }
+      ],
+      "secondary": [
+        { "label": "File B", "value": 0.68 }
+      ]
+    },
+    "avg_process_time": {
+      "primary": [
+        { "date": "2022-01-15", "value": 300000 },
+        { "date": "2022-06-15", "value": 350000 },
+        { "date": "2022-12-15", "value": 320000 }
+      ],
+      "secondary": [
+        { "date": "2022-01-15", "value": 280000 },
+        { "date": "2022-06-15", "value": 310000 },
+        { "date": "2022-12-15", "value": 290000 }
+      ]
+    },
+    "avg_process_time_by_task": {
+      "primary": [
+        { "label": ["Activity", "A"], "value": 120000 },
+        { "label": ["Activity", "B"], "value": 80000 }
+      ],
+      "secondary": [
+        { "label": ["Activity", "A"], "value": 110000 },
+        { "label": ["Activity", "B"], "value": 95000 }
+      ]
+    },
+    "avg_waiting_time": {
+      "primary": [
+        { "date": "2022-01-15", "value": 200000 },
+        { "date": "2022-06-15", "value": 250000 },
+        { "date": "2022-12-15", "value": 230000 }
+      ],
+      "secondary": [
+        { "date": "2022-01-15", "value": 200000 },
+        { "date": "2022-06-15", "value": 210000 },
+        { "date": "2022-12-15", "value": 220000 }
+      ]
+    },
+    "avg_waiting_time_by_edge": {
+      "primary": [
+        { "label": ["A", "B"], "value": 150000 },
+        { "label": ["B", "C"], "value": 100000 }
+      ],
+      "secondary": [
+        { "label": ["A", "B"], "value": 140000 },
+        { "label": ["B", "C"], "value": 110000 }
+      ]
+    }
+  },
+  "freq": {
+    "cases": {
+      "primary": [
+        { "count": 100 },
+        { "count": 120 },
+        { "count": 110 }
+      ],
+      "secondary": [
+        { "count": 95 },
+        { "count": 105 },
+        { "count": 100 }
+      ]
+    },
+    "cases_by_task": {
+      "primary": [
+        { "label": ["Activity", "A"], "value": 200 },
+        { "label": ["Activity", "B"], "value": 150 }
+      ],
+      "secondary": [
+        { "label": ["Activity", "A"], "value": 180 },
+        { "label": ["Activity", "B"], "value": 160 }
+      ]
+    }
+  }
+}

cypress/fixtures/api/files.json

@@ -0,0 +1,42 @@
+[
+  {
+    "type": "log",
+    "id": 1,
+    "name": "sample-process.xes",
+    "parent": null,
+    "owner": { "username": "testadmin", "name": "Test Admin" },
+    "updated_at": "2025-06-10T14:30:00Z",
+    "accessed_at": "2025-06-12T09:00:00Z",
+    "is_deleted": false
+  },
+  {
+    "type": "filter",
+    "id": 10,
+    "name": "filtered-sample",
+    "parent": { "type": "log", "id": 1, "name": "sample-process.xes" },
+    "owner": { "username": "testadmin", "name": "Test Admin" },
+    "updated_at": "2025-06-11T08:00:00Z",
+    "accessed_at": "2025-06-12T10:00:00Z",
+    "is_deleted": false
+  },
+  {
+    "type": "log",
+    "id": 2,
+    "name": "production-log.csv",
+    "parent": null,
+    "owner": { "username": "user1", "name": "Alice Wang" },
+    "updated_at": "2025-06-09T16:00:00Z",
+    "accessed_at": null,
+    "is_deleted": false
+  },
+  {
+    "type": "log-check",
+    "id": 100,
+    "name": "conformance-check-1",
+    "parent": { "type": "log", "id": 1, "name": "sample-process.xes" },
+    "owner": { "username": "testadmin", "name": "Test Admin" },
+    "updated_at": "2025-06-11T12:00:00Z",
+    "accessed_at": null,
+    "is_deleted": false
+  }
+]

cypress/fixtures/api/filter-params.json

@@ -0,0 +1,249 @@
+{
+    "tasks": [
+        {
+            "label": "a",
+            "occurrences": 187,
+            "occurrence_ratio": 0.10048361096184846,
+            "cases": 184,
+            "case_ratio": 0.7301587301587301
+        },
+        {
+            "label": "d",
+            "occurrences": 241,
+            "occurrence_ratio": 0.12950026867275657,
+            "cases": 241,
+            "case_ratio": 0.9563492063492064
+        },
+        {
+            "label": "e",
+            "occurrences": 249,
+            "occurrence_ratio": 0.1337990327780763,
+            "cases": 249,
+            "case_ratio": 0.9880952380952381
+        },
+        {
+            "label": "f",
+            "occurrences": 249,
+            "occurrence_ratio": 0.1337990327780763,
+            "cases": 249,
+            "case_ratio": 0.9880952380952381
+        },
+        {
+            "label": "g",
+            "occurrences": 253,
+            "occurrence_ratio": 0.13594841483073616,
+            "cases": 250,
+            "case_ratio": 0.9920634920634921
+        },
+        {
+            "label": "h",
+            "occurrences": 163,
+            "occurrence_ratio": 0.08758731864588931,
+            "cases": 163,
+            "case_ratio": 0.6468253968253969
+        },
+        {
+            "label": "i",
+            "occurrences": 185,
+            "occurrence_ratio": 0.09940891993551854,
+            "cases": 175,
+            "case_ratio": 0.6944444444444444
+        },
+        {
+            "label": "l",
+            "occurrences": 182,
+            "occurrence_ratio": 0.09779688339602365,
+            "cases": 182,
+            "case_ratio": 0.7222222222222222
+        },
+        {
+            "label": "c",
+            "occurrences": 48,
+            "occurrence_ratio": 0.025792584631918324,
+            "cases": 48,
+            "case_ratio": 0.19047619047619047
+        },
+        {
+            "label": "k",
+            "occurrences": 48,
+            "occurrence_ratio": 0.025792584631918324,
+            "cases": 48,
+            "case_ratio": 0.19047619047619047
+        },
+        {
+            "label": "b",
+            "occurrences": 34,
+            "occurrence_ratio": 0.018269747447608814,
+            "cases": 32,
+            "case_ratio": 0.12698412698412698
+        },
+        {
+            "label": "j",
+            "occurrences": 22,
+            "occurrence_ratio": 0.011821601289629231,
+            "cases": 22,
+            "case_ratio": 0.0873015873015873
+        }
+    ],
+    "sources": [
+        {
+            "label": "a",
+            "occurrences": 175,
+            "occurrence_ratio": 0.6944444444444444,
+            "sinks": [
+                "k",
+                "l"
+            ]
+        },
+        {
+            "label": "c",
+            "occurrences": 45,
+            "occurrence_ratio": 0.17857142857142858,
+            "sinks": [
+                "k"
+            ]
+        },
+        {
+            "label": "b",
+            "occurrences": 32,
+            "occurrence_ratio": 0.12698412698412698,
+            "sinks": [
+                "k",
+                "j",
+                "l"
+            ]
+        }
+    ],
+    "sinks": [
+        {
+            "label": "l",
+            "occurrences": 182,
+            "occurrence_ratio": 0.7222222222222222,
+            "sources": [
+                "a",
+                "b"
+            ]
+        },
+        {
+            "label": "k",
+            "occurrences": 48,
+            "occurrence_ratio": 0.19047619047619047,
+            "sources": [
+                "a",
+                "b",
+                "c"
+            ]
+        },
+        {
+            "label": "j",
+            "occurrences": 22,
+            "occurrence_ratio": 0.0873015873015873,
+            "sources": [
+                "b"
+            ]
+        }
+    ],
+    "timeframe": {
+        "data": [
+            {
+                "x": "2022-01-21T03:21:48",
+                "y": 347
+            },
+            {
+                "x": "2022-02-26T08:13:24",
+                "y": 426
+            },
+            {
+                "x": "2022-04-03T13:05:00",
+                "y": 394
+            },
+            {
+                "x": "2022-05-09T17:56:36",
+                "y": 375
+            },
+            {
+                "x": "2022-06-14T22:48:12",
+                "y": 431
+            },
+            {
+                "x": "2022-07-21T03:39:48",
+                "y": 393
+            },
+            {
+                "x": "2022-08-26T08:31:24",
+                "y": 284
+            },
+            {
+                "x": "2022-10-01T13:23:00",
+                "y": 359
+            },
+            {
+                "x": "2022-11-06T18:14:36",
+                "y": 386
+            },
+            {
+                "x": "2022-12-12T23:06:12",
+                "y": 327
+            }
+        ],
+        "x_axis": {
+            "min": "2022-01-03T00:56:00",
+            "max": "2022-12-31T01:32:00"
+        },
+        "y_axis": {
+            "min": 0,
+            "max": 431
+        }
+    },
+    "traces": [
+        {
+            "id": 1,
+            "count": 95
+        },
+        {
+            "id": 2,
+            "count": 74
+        },
+        {
+            "id": 3,
+            "count": 45
+        },
+        {
+            "id": 4,
+            "count": 22
+        },
+        {
+            "id": 5,
+            "count": 8
+        },
+        {
+            "id": 6,
+            "count": 2
+        },
+        {
+            "id": 7,
+            "count": 1
+        },
+        {
+            "id": 8,
+            "count": 1
+        },
+        {
+            "id": 9,
+            "count": 1
+        },
+        {
+            "id": 10,
+            "count": 1
+        },
+        {
+            "id": 11,
+            "count": 1
+        },
+        {
+            "id": 12,
+            "count": 1
+        }
+    ],
+    "attrs": []
+}

cypress/fixtures/api/my-account.json

@@ -0,0 +1,9 @@
+{
+  "username": "testadmin",
+  "name": "Test Admin",
+  "is_sso": false,
+  "created_at": "2025-01-15T10:00:00Z",
+  "roles": [
+    { "code": "admin", "name": "Administrator" }
+  ]
+}

cypress/fixtures/api/performance.json

@@ -0,0 +1,928 @@
+{
+    "time": {
+        "avg_cycle_time": {
+            "data": [
+                {
+                    "x": "2022-01-21T03:21:48",
+                    "y": 980220.0
+                },
+                {
+                    "x": "2022-02-26T08:13:24",
+                    "y": 1000376.129032
+                },
+                {
+                    "x": "2022-04-03T13:05:00",
+                    "y": 911990.0
+                },
+                {
+                    "x": "2022-05-09T17:56:36",
+                    "y": 1041860.0
+                },
+                {
+                    "x": "2022-06-14T22:48:12",
+                    "y": 985415.625
+                },
+                {
+                    "x": "2022-07-21T03:39:48",
+                    "y": 938079.130435
+                },
+                {
+                    "x": "2022-08-26T08:31:24",
+                    "y": 1074680.0
+                },
+                {
+                    "x": "2022-10-01T13:23:00",
+                    "y": 1061848.695652
+                },
+                {
+                    "x": "2022-11-06T18:14:36",
+                    "y": 970119.230769
+                },
+                {
+                    "x": "2022-12-12T23:06:12",
+                    "y": 1060703.076923
+                }
+            ],
+            "x_axis": {
+                "min": "2022-01-03T00:56:00",
+                "max": "2022-12-31T01:32:00"
+            },
+            "y_axis": {
+                "min": 0.0,
+                "max": 1074680.0
+            }
+        },
+        "avg_cycle_efficiency": {
+            "data": [
+                {
+                    "x": "2022-01-21T03:21:48",
+                    "y": 0.9527980523449506
+                },
+                {
+                    "x": "2022-02-26T08:13:24",
+                    "y": 0.9516493513262202
+                },
+                {
+                    "x": "2022-04-03T13:05:00",
+                    "y": 0.9475330648076836
+                },
+                {
+                    "x": "2022-05-09T17:56:36",
+                    "y": 0.9537265449333607
+                },
+                {
+                    "x": "2022-06-14T22:48:12",
+                    "y": 0.9528919667258132
+                },
+                {
+                    "x": "2022-07-21T03:39:48",
+                    "y": 0.9489804015433904
+                },
+                {
+                    "x": "2022-08-26T08:31:24",
+                    "y": 0.9538748758272698
+                },
+                {
+                    "x": "2022-10-01T13:23:00",
+                    "y": 0.9548679615433759
+                },
+                {
+                    "x": "2022-11-06T18:14:36",
+                    "y": 0.9469965631092006
+                },
+                {
+                    "x": "2022-12-12T23:06:12",
+                    "y": 0.9505469198562757
+                }
+            ],
+            "x_axis": {
+                "min": "2022-01-03T00:56:00",
+                "max": "2022-12-31T01:32:00"
+            },
+            "y_axis": {
+                "min": 0.0,
+                "max": 1.0
+            }
+        },
+        "avg_process_time": {
+            "data": [
+                {
+                    "x": "2022-01-21T03:21:48",
+                    "y": 937067.368421
+                },
+                {
+                    "x": "2022-02-26T08:13:24",
+                    "y": 953767.741935
+                },
+                {
+                    "x": "2022-04-03T13:05:00",
+                    "y": 865780.0
+                },
+                {
+                    "x": "2022-05-09T17:56:36",
+                    "y": 994600.0
+                },
+                {
+                    "x": "2022-06-14T22:48:12",
+                    "y": 939795.0
+                },
+                {
+                    "x": "2022-07-21T03:39:48",
+                    "y": 890947.826087
+                },
+                {
+                    "x": "2022-08-26T08:31:24",
+                    "y": 1026345.714286
+                },
+                {
+                    "x": "2022-10-01T13:23:00",
+                    "y": 1016363.478261
+                },
+                {
+                    "x": "2022-11-06T18:14:36",
+                    "y": 923626.153846
+                },
+                {
+                    "x": "2022-12-12T23:06:12",
+                    "y": 1011540.0
+                }
+            ],
+            "x_axis": {
+                "min": "2022-01-03T00:56:00",
+                "max": "2022-12-31T01:32:00"
+            },
+            "y_axis": {
+                "min": 0.0,
+                "max": 1026345.714286
+            }
+        },
+        "avg_process_time_by_task": {
+            "data": [
+                {
+                    "x": "a",
+                    "y": 131147.486631
+                },
+                {
+                    "x": "b",
+                    "y": 136627.058824
+                },
+                {
+                    "x": "c",
+                    "y": 133261.25
+                },
+                {
+                    "x": "d",
+                    "y": 132697.095436
+                },
+                {
+                    "x": "e",
+                    "y": 124442.891566
+                },
+                {
+                    "x": "f",
+                    "y": 127175.180723
+                },
+                {
+                    "x": "g",
+                    "y": 127627.826087
+                },
+                {
+                    "x": "h",
+                    "y": 128163.680982
+                },
+                {
+                    "x": "i",
+                    "y": 125588.756757
+                },
+                {
+                    "x": "j",
+                    "y": 101290.909091
+                },
+                {
+                    "x": "k",
+                    "y": 142543.75
+                },
+                {
+                    "x": "l",
+                    "y": 138070.879121
+                }
+            ],
+            "x_axis": {
+                "labels": [
+                    "a",
+                    "b",
+                    "c",
+                    "d",
+                    "e",
+                    "f",
+                    "g",
+                    "h",
+                    "i",
+                    "j",
+                    "k",
+                    "l"
+                ]
+            },
+            "y_axis": {
+                "min": 0.0,
+                "max": 142543.75
+            }
+        },
+        "avg_waiting_time": {
+            "data": [
+                {
+                    "x": "2022-01-21T03:21:48",
+                    "y": 43152.631579
+                },
+                {
+                    "x": "2022-02-26T08:13:24",
+                    "y": 46608.387097
+                },
+                {
+                    "x": "2022-04-03T13:05:00",
+                    "y": 46210.0
+                },
+                {
+                    "x": "2022-05-09T17:56:36",
+                    "y": 47260.0
+                },
+                {
+                    "x": "2022-06-14T22:48:12",
+                    "y": 45620.625
+                },
+                {
+                    "x": "2022-07-21T03:39:48",
+                    "y": 47131.304348
+                },
+                {
+                    "x": "2022-08-26T08:31:24",
+                    "y": 48334.285714
+                },
+                {
+                    "x": "2022-10-01T13:23:00",
+                    "y": 45485.217391
+                },
+                {
+                    "x": "2022-11-06T18:14:36",
+                    "y": 46493.076923
+                },
+                {
+                    "x": "2022-12-12T23:06:12",
+                    "y": 49163.076923
+                }
+            ],
+            "x_axis": {
+                "min": "2022-01-03T00:56:00",
+                "max": "2022-12-31T01:32:00"
+            },
+            "y_axis": {
+                "min": 0.0,
+                "max": 49163.076923
+            }
+        },
+        "avg_waiting_time_by_edge": {
+            "data": [
+                {
+                    "x": [
+                        "a",
+                        "a"
+                    ],
+                    "y": 6420.0
+                },
+                {
+                    "x": [
+                        "a",
+                        "d"
+                    ],
+                    "y": 7506.352941
+                },
+                {
+                    "x": [
+                        "a",
+                        "f"
+                    ],
+                    "y": 5940.0
+                },
+                {
+                    "x": [
+                        "a",
+                        "g"
+                    ],
+                    "y": 5175.0
+                },
+                {
+                    "x": [
+                        "a",
+                        "i"
+                    ],
+                    "y": 6260.0
+                },
+                {
+                    "x": [
+                        "b",
+                        "a"
+                    ],
+                    "y": 6840.0
+                },
+                {
+                    "x": [
+                        "b",
+                        "b"
+                    ],
+                    "y": 3540.0
+                },
+                {
+                    "x": [
+                        "b",
+                        "g"
+                    ],
+                    "y": 7273.636364
+                },
+                {
+                    "x": [
+                        "b",
+                        "i"
+                    ],
+                    "y": 6288.0
+                },
+                {
+                    "x": [
+                        "c",
+                        "g"
+                    ],
+                    "y": 11460.0
+                },
+                {
+                    "x": [
+                        "c",
+                        "h"
+                    ],
+                    "y": 6821.73913
+                },
+                {
+                    "x": [
+                        "c",
+                        "k"
+                    ],
+                    "y": 13500.0
+                },
+                {
+                    "x": [
+                        "d",
+                        "c"
+                    ],
+                    "y": 11760.0
+                },
+                {
+                    "x": [
+                        "d",
+                        "e"
+                    ],
+                    "y": 7166.694915
+                },
+                {
+                    "x": [
+                        "d",
+                        "g"
+                    ],
+                    "y": 8080.0
+                },
+                {
+                    "x": [
+                        "d",
+                        "i"
+                    ],
+                    "y": 3600.0
+                },
+                {
+                    "x": [
+                        "e",
+                        "a"
+                    ],
+                    "y": 7260.0
+                },
+                {
+                    "x": [
+                        "e",
+                        "d"
+                    ],
+                    "y": 6780.0
+                },
+                {
+                    "x": [
+                        "e",
+                        "f"
+                    ],
+                    "y": 7288.474576
+                },
+                {
+                    "x": [
+                        "e",
+                        "g"
+                    ],
+                    "y": 14040.0
+                },
+                {
+                    "x": [
+                        "e",
+                        "k"
+                    ],
+                    "y": 13620.0
+                },
+                {
+                    "x": [
+                        "e",
+                        "l"
+                    ],
+                    "y": 3780.0
+                },
+                {
+                    "x": [
+                        "f",
+                        "d"
+                    ],
+                    "y": 10140.0
+                },
+                {
+                    "x": [
+                        "f",
+                        "e"
+                    ],
+                    "y": 3940.0
+                },
+                {
+                    "x": [
+                        "f",
+                        "g"
+                    ],
+                    "y": 6983.271028
+                },
+                {
+                    "x": [
+                        "f",
+                        "j"
+                    ],
+                    "y": 8170.909091
+                },
+                {
+                    "x": [
+                        "f",
+                        "l"
+                    ],
+                    "y": 6667.5
+                },
+                {
+                    "x": [
+                        "g",
+                        "c"
+                    ],
+                    "y": 2400.0
+                },
+                {
+                    "x": [
+                        "g",
+                        "e"
+                    ],
+                    "y": 11880.0
+                },
+                {
+                    "x": [
+                        "g",
+                        "f"
+                    ],
+                    "y": 5302.5
+                },
+                {
+                    "x": [
+                        "g",
+                        "g"
+                    ],
+                    "y": 11400.0
+                },
+                {
+                    "x": [
+                        "g",
+                        "h"
+                    ],
+                    "y": 7592.820513
+                },
+                {
+                    "x": [
+                        "g",
+                        "i"
+                    ],
+                    "y": 7140.0
+                },
+                {
+                    "x": [
+                        "g",
+                        "k"
+                    ],
+                    "y": 8116.0
+                },
+                {
+                    "x": [
+                        "g",
+                        "l"
+                    ],
+                    "y": 7457.368421
+                },
+                {
+                    "x": [
+                        "h",
+                        "i"
+                    ],
+                    "y": 7288.888889
+                },
+                {
+                    "x": [
+                        "h",
+                        "l"
+                    ],
+                    "y": 6960.0
+                },
+                {
+                    "x": [
+                        "i",
+                        "a"
+                    ],
+                    "y": 8910.0
+                },
+                {
+                    "x": [
+                        "i",
+                        "b"
+                    ],
+                    "y": 5880.0
+                },
+                {
+                    "x": [
+                        "i",
+                        "c"
+                    ],
+                    "y": 5460.0
+                },
+                {
+                    "x": [
+                        "i",
+                        "d"
+                    ],
+                    "y": 7710.447761
+                },
+                {
+                    "x": [
+                        "i",
+                        "e"
+                    ],
+                    "y": 9153.333333
+                },
+                {
+                    "x": [
+                        "i",
+                        "g"
+                    ],
+                    "y": 8640.0
+                },
+                {
+                    "x": [
+                        "i",
+                        "i"
+                    ],
+                    "y": 6324.0
+                },
+                {
+                    "x": [
+                        "i",
+                        "k"
+                    ],
+                    "y": 3240.0
+                },
+                {
+                    "x": [
+                        "i",
+                        "l"
+                    ],
+                    "y": 7188.75
+                }
+            ],
+            "x_axis": {
+                "labels": [
+                    [
+                        "a",
+                        "a"
+                    ],
+                    [
+                        "a",
+                        "d"
+                    ],
+                    [
+                        "a",
+                        "f"
+                    ],
+                    [
+                        "a",
+                        "g"
+                    ],
+                    [
+                        "a",
+                        "i"
+                    ],
+                    [
+                        "b",
+                        "a"
+                    ],
+                    [
+                        "b",
+                        "b"
+                    ],
+                    [
+                        "b",
+                        "g"
+                    ],
+                    [
+                        "b",
+                        "i"
+                    ],
+                    [
+                        "c",
+                        "g"
+                    ],
+                    [
+                        "c",
+                        "h"
+                    ],
+                    [
+                        "c",
+                        "k"
+                    ],
+                    [
+                        "d",
+                        "c"
+                    ],
+                    [
+                        "d",
+                        "e"
+                    ],
+                    [
+                        "d",
+                        "g"
+                    ],
+                    [
+                        "d",
+                        "i"
+                    ],
+                    [
+                        "e",
+                        "a"
+                    ],
+                    [
+                        "e",
+                        "d"
+                    ],
+                    [
+                        "e",
+                        "f"
+                    ],
+                    [
+                        "e",
+                        "g"
+                    ],
+                    [
+                        "e",
+                        "k"
+                    ],
+                    [
+                        "e",
+                        "l"
+                    ],
+                    [
+                        "f",
+                        "d"
+                    ],
+                    [
+                        "f",
+                        "e"
+                    ],
+                    [
+                        "f",
+                        "g"
+                    ],
+                    [
+                        "f",
+                        "j"
+                    ],
+                    [
+                        "f",
+                        "l"
+                    ],
+                    [
+                        "g",
+                        "c"
+                    ],
+                    [
+                        "g",
+                        "e"
+                    ],
+                    [
+                        "g",
+                        "f"
+                    ],
+                    [
+                        "g",
+                        "g"
+                    ],
+                    [
+                        "g",
+                        "h"
+                    ],
+                    [
+                        "g",
+                        "i"
+                    ],
+                    [
+                        "g",
+                        "k"
+                    ],
+                    [
+                        "g",
+                        "l"
+                    ],
+                    [
+                        "h",
+                        "i"
+                    ],
+                    [
+                        "h",
+                        "l"
+                    ],
+                    [
+                        "i",
+                        "a"
+                    ],
+                    [
+                        "i",
+                        "b"
+                    ],
+                    [
+                        "i",
+                        "c"
+                    ],
+                    [
+                        "i",
+                        "d"
+                    ],
+                    [
+                        "i",
+                        "e"
+                    ],
+                    [
+                        "i",
+                        "g"
+                    ],
+                    [
+                        "i",
+                        "i"
+                    ],
+                    [
+                        "i",
+                        "k"
+                    ],
+                    [
+                        "i",
+                        "l"
+                    ]
+                ]
+            },
+            "y_axis": {
+                "min": 0.0,
+                "max": 14040.0
+            }
+        }
+    },
+    "freq": {
+        "cases": {
+            "data": [
+                {
+                    "x": "2022-01-21T03:21:48",
+                    "y": 30
+                },
+                {
+                    "x": "2022-02-26T08:13:24",
+                    "y": 25
+                },
+                {
+                    "x": "2022-04-03T13:05:00",
+                    "y": 30
+                },
+                {
+                    "x": "2022-05-09T17:56:36",
+                    "y": 26
+                },
+                {
+                    "x": "2022-06-14T22:48:12",
+                    "y": 28
+                },
+                {
+                    "x": "2022-07-21T03:39:48",
+                    "y": 27
+                },
+                {
+                    "x": "2022-08-26T08:31:24",
+                    "y": 17
+                },
+                {
+                    "x": "2022-10-01T13:23:00",
+                    "y": 24
+                },
+                {
+                    "x": "2022-11-06T18:14:36",
+                    "y": 28
+                },
+                {
+                    "x": "2022-12-12T23:06:12",
+                    "y": 17
+                }
+            ],
+            "x_axis": {
+                "min": "2022-01-03T00:56:00",
+                "max": "2022-12-31T01:32:00"
+            },
+            "y_axis": {
+                "min": 0,
+                "max": 30
+            }
+        },
+        "cases_by_task": {
+            "data": [
+                {
+                    "x": "a",
+                    "y": 184
+                },
+                {
+                    "x": "b",
+                    "y": 32
+                },
+                {
+                    "x": "c",
+                    "y": 48
+                },
+                {
+                    "x": "d",
+                    "y": 241
+                },
+                {
+                    "x": "e",
+                    "y": 249
+                },
+                {
+                    "x": "f",
+                    "y": 249
+                },
+                {
+                    "x": "g",
+                    "y": 250
+                },
+                {
+                    "x": "h",
+                    "y": 163
+                },
+                {
+                    "x": "i",
+                    "y": 175
+                },
+                {
+                    "x": "j",
+                    "y": 22
+                },
+                {
+                    "x": "k",
+                    "y": 48
+                },
+                {
+                    "x": "l",
+                    "y": 182
+                }
+            ],
+            "x_axis": {
+                "labels": [
+                    "a",
+                    "b",
+                    "c",
+                    "d",
+                    "e",
+                    "f",
+                    "g",
+                    "h",
+                    "i",
+                    "j",
+                    "k",
+                    "l"
+                ]
+            },
+            "y_axis": {
+                "min": 0,
+                "max": 250
+            }
+        }
+    }
+}

cypress/fixtures/api/token.json

@@ -0,0 +1,6 @@
+{
+  "access_token": "fake-access-token-for-testing",
+  "token_type": "bearer",
+  "expires_in": 3600,
+  "refresh_token": "fake-refresh-token-for-testing"
+}

cypress/fixtures/api/trace-detail.json

@@ -0,0 +1,154 @@
+{
+    "task_seq": [
+        "a",
+        "d",
+        "e",
+        "f",
+        "g",
+        "h",
+        "i",
+        "l"
+    ],
+    "cases": [
+        {
+            "id": "H00564053",
+            "started_at": "2022-01-03T00:56:00",
+            "completed_at": "2022-01-12T02:29:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00723931",
+            "started_at": "2022-01-04T17:51:00",
+            "completed_at": "2022-01-17T10:00:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00542949",
+            "started_at": "2022-01-10T19:05:00",
+            "completed_at": "2022-01-28T09:38:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00320575",
+            "started_at": "2022-01-12T21:35:00",
+            "completed_at": "2022-01-24T19:38:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00565387",
+            "started_at": "2022-01-20T20:30:00",
+            "completed_at": "2022-02-06T10:57:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00832338",
+            "started_at": "2022-01-29T15:00:00",
+            "completed_at": "2022-02-13T17:46:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00525137",
+            "started_at": "2022-02-05T23:26:00",
+            "completed_at": "2022-02-14T19:47:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00093124",
+            "started_at": "2022-02-09T16:56:00",
+            "completed_at": "2022-02-28T17:38:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00657586",
+            "started_at": "2022-02-14T20:07:00",
+            "completed_at": "2022-02-28T15:21:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00141668",
+            "started_at": "2022-02-17T13:57:00",
+            "completed_at": "2022-03-06T00:01:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00493818",
+            "started_at": "2022-02-20T19:54:00",
+            "completed_at": "2022-03-05T05:06:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00488827",
+            "started_at": "2022-02-21T00:38:00",
+            "completed_at": "2022-03-03T16:24:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00874806",
+            "started_at": "2022-02-24T15:15:00",
+            "completed_at": "2022-03-12T01:12:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00395448",
+            "started_at": "2022-02-26T03:35:00",
+            "completed_at": "2022-03-08T23:11:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00414605",
+            "started_at": "2022-02-26T17:11:00",
+            "completed_at": "2022-03-10T08:50:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00564269",
+            "started_at": "2022-03-04T01:18:00",
+            "completed_at": "2022-03-16T08:14:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00729845",
+            "started_at": "2022-03-05T09:29:00",
+            "completed_at": "2022-03-17T15:25:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00194115",
+            "started_at": "2022-03-09T18:58:00",
+            "completed_at": "2022-03-23T09:01:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00517238",
+            "started_at": "2022-03-21T06:30:00",
+            "completed_at": "2022-04-05T05:27:00",
+            "attributes": [],
+            "facets": []
+        },
+        {
+            "id": "H00377237",
+            "started_at": "2022-03-24T12:06:00",
+            "completed_at": "2022-04-04T15:44:00",
+            "attributes": [],
+            "facets": []
+        }
+    ]
+}

cypress/fixtures/api/traces.json

@@ -0,0 +1,50 @@
+[
+    {
+        "id": 1,
+        "count": 95
+    },
+    {
+        "id": 2,
+        "count": 74
+    },
+    {
+        "id": 3,
+        "count": 45
+    },
+    {
+        "id": 4,
+        "count": 22
+    },
+    {
+        "id": 5,
+        "count": 8
+    },
+    {
+        "id": 6,
+        "count": 2
+    },
+    {
+        "id": 7,
+        "count": 1
+    },
+    {
+        "id": 8,
+        "count": 1
+    },
+    {
+        "id": 9,
+        "count": 1
+    },
+    {
+        "id": 10,
+        "count": 1
+    },
+    {
+        "id": 11,
+        "count": 1
+    },
+    {
+        "id": 12,
+        "count": 1
+    }
+]

cypress/fixtures/api/user-detail.json

@@ -0,0 +1,14 @@
+{
+  "username": "testadmin",
+  "name": "Test Admin",
+  "is_admin": true,
+  "is_active": true,
+  "is_sso": false,
+  "has_data": true,
+  "roles": [
+    { "code": "admin", "name": "Administrator" }
+  ],
+  "detail": {
+    "visits": 42
+  }
+}

cypress/fixtures/api/users.json

@@ -0,0 +1,26 @@
+[
+  {
+    "username": "testadmin",
+    "name": "Test Admin",
+    "is_admin": true,
+    "is_active": true,
+    "is_sso": false,
+    "has_data": true
+  },
+  {
+    "username": "user1",
+    "name": "Alice Wang",
+    "is_admin": false,
+    "is_active": true,
+    "is_sso": false,
+    "has_data": true
+  },
+  {
+    "username": "user2",
+    "name": "Bob Chen",
+    "is_admin": false,
+    "is_active": false,
+    "is_sso": true,
+    "has_data": false
+  }
+]

cypress/fixtures/csv/big5.csv

@@ -0,0 +1,5 @@
+ 時間,案號,居住區域,學區,事件名稱,事件序號,狀態 ,時段,溫度,數量,未知,完成,預期時間
+ 2022/05/13 09:25:21,案一,63,富山,事件甲,事件一,Start,早上,95,27,,TRUE,2022/5/14 09:25:21
+ 2022/05/13 09:25:21,案一,,,事件甲,事件一,Complete,中午,135,442,,false,2022/5/14 09:25:21
+ 2022/05/13 09:30:01,案一,,仁德,事件乙,事件四,Start,中午,110.6,-6, ,,2022/5/14 09:30:01
+ 2022/05/13 09:30:01,案一,,,事件乙,事件四,Complete,晚上,-65,4,,true ,2022/5/14 09:30:01

cypress/fixtures/csv/empty.csv

@@ -0,0 +1 @@
+timestamp,case id,name,instance,status

cypress/fixtures/csv/insufficient-columns.csv

@@ -0,0 +1,9 @@
+timestamp,case id,name,status
+2022/05/13 09:25:21,c1,a,1,start
+2022/05/13 09:25:21,c1,a,1,complete
+2022/05/13 09:30:01,c1,b,2,start
+2022/05/13 09:30:01,c1,b,2,complete
+2022/05/13 09:48:33,c2,a,6,start
+2022/05/13 09:48:33,c2,a,6,complete
+2022/05/13 09:54:27,c2,c,7,start
+2022/05/13 09:54:27,c2,c,7,complete

cypress/fixtures/csv/rightFile.csv

@@ -0,0 +1,30 @@
+CaseID,Activity,Timestamp,Status,Activity_Instance
+CID_1,檢傷,2023-01-12 15:32:31,start,1
+CID_1,檢傷,2023-01-12 15:32:31,complete,1
+CID_1,第一次醫囑,2023-01-12 15:49:01,start,2
+CID_1,第一次醫囑,2023-01-12 15:49:01,complete,2
+CID_1,出院,2023-01-13 03:32:00,start,3
+CID_1,出院,2023-01-13 03:32:00,complete,3
+CID_2,檢傷,2023-07-26 08:44:17,start,4
+CID_2,檢傷,2023-07-26 08:44:17,complete,4
+CID_2,第一次醫囑,2023-07-26 08:48:05,start,5
+CID_2,第一次醫囑,2023-07-26 08:48:05,complete,5
+CID_2,出院,2023-07-26 17:00:49,start,6
+CID_2,出院,2023-07-26 17:00:49,complete,6
+CID_3,檢傷,2023-11-27 06:20:48,start,7
+CID_3,檢傷,2023-11-27 06:20:48,complete,7
+CID_3,第一次醫囑,2023-11-27 06:40:30,start,8
+CID_3,第一次醫囑,2023-11-27 06:40:30,complete,8
+CID_3,出院,2023-11-27 07:21:53,start,9
+CID_3,出院,2023-11-27 07:21:53,complete,9
+CID_4,檢傷,2023-11-01 01:20:19,start,10
+CID_4,檢傷,2023-11-01 01:20:19,complete,10
+CID_4,第一次醫囑,2023-11-01 01:34:54,start,11
+CID_4,第一次醫囑,2023-11-01 01:34:54,complete,11
+CID_4,住院,2023-11-02 06:36:36,start,12
+CID_4,住院,2023-11-10 02:35:39,complete,12
+CID_4,出院,2023-11-10 02:35:39,start,13
+CID_4,出院,2023-11-10 02:35:39,complete,13
+CID_5,檢傷,2023-07-13 02:49:36,start,14
+CID_5,檢傷,2023-07-13 02:49:36,complete,14
+CID_5,第一次醫囑,2023-07-13 03:07:01,start,15

cypress/fixtures/csv/worngFile.csv

@@ -0,0 +1,9 @@
+timestamp,case id,name,instance,status
+2022/05/13 09:25:21,c1,a,1,start
+2022/05/13 09:25:21,c1,a,1,
+2022/05/13 09:30:01,c1,b,2,begin
+2022/05/13 09:30:01,c1,b,,complete
+2022/05/13 09:48:33,,,6,start
+2022;05;13 09;48;33,c2,a,6,complete
+2022/05/13 09:54:27,c2,c,7,start
+,c2,c,7,complete

cypress/support/commands.js

@@ -1,3 +1,9 @@
+// The Lucia project.
+// Copyright 2023-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   chiayin.kuo@dsp.im (chiayin), 2023/01/31
+//   imacat.yang@dsp.im (imacat), 2026/03/06
+
 // ***********************************************
 // This example commands.js shows you how to
 // create various custom commands and overwrite
@@ -7,19 +13,27 @@
 // commands please read more here:
 // https://on.cypress.io/custom-commands
 // ***********************************************
-//
-//
 // -- This is a parent command --
-// Cypress.Commands.add('login', (email, password) => { ... })
-//
-//
+import "@4tw/cypress-drag-drop";
+
+/**
+ * Sets authentication cookies to simulate a logged-in user.
+ *
+ * @returns {void}
+ */
+Cypress.Commands.add("login", () => {
+  cy.setCookie("luciaToken", "fake-access-token-for-testing");
+  cy.setCookie("isLuciaLoggedIn", "true");
+});
+// Usage: cy.login()
 // -- This is a child command --
-// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
-//
-//
-// -- This is a dual command --
-// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
-//
-//
-// -- This will overwrite an existing command --
-// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+// Click a blank area to close an opened modal: cy.closePopup()
+/**
+ * Closes the active popup by clicking the top-left area of the page.
+ *
+ * @returns {void}
+ */
+Cypress.Commands.add("closePopup", () => {
+  // Trigger a forced click to close modal overlays consistently.
+  cy.get("body").click({ position: "topLeft" });
+});

cypress/support/e2e.js

@@ -1,3 +1,8 @@
+// The Lucia project.
+// Copyright 2023-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   chiayin.kuo@dsp.im (chiayin), 2023/01/31
+
 // ***********************************************************
 // This example support/index.js is processed and
 // loaded automatically before your test files.
@@ -15,10 +20,7 @@
 
 // Import commands.js using ES2015 syntax:
 import "./commands";
-Cypress.on('uncaught:exception', (err, runnable) => {
-  // returning false here prevents Cypress from failing the test
-  return false
-})
 
 // Alternatively you can use CommonJS syntax:
 // require('./commands')
+require("cypress-xpath"); // Enables xpath helpers used in pointer event checks.

cypress/support/intercept.js

@@ -0,0 +1,190 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/03/05
+
+/**
+ * Sets up cy.intercept for all API endpoints using fixture files.
+ * Call setupApiIntercepts() in beforeEach to mock the entire backend.
+ */
+export function setupApiIntercepts() {
+  // Auth
+  cy.intercept("POST", "/api/oauth/token", {
+    fixture: "api/token.json",
+  }).as("postToken");
+
+  // User account
+  cy.intercept("GET", "/api/my-account", {
+    fixture: "api/my-account.json",
+  }).as("getMyAccount");
+
+  cy.intercept("PUT", "/api/my-account", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("putMyAccount");
+
+  // Files
+  cy.intercept("GET", "/api/files", {
+    fixture: "api/files.json",
+  }).as("getFiles");
+
+  // Users (account management)
+  cy.intercept("GET", "/api/users", {
+    fixture: "api/users.json",
+  }).as("getUsers");
+
+  cy.intercept("POST", "/api/users", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("postUser");
+
+  cy.intercept("DELETE", "/api/users/*", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("deleteUser");
+
+  cy.intercept("PUT", "/api/users/*", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("putUser");
+
+  // User detail (GET /api/users/:username)
+  cy.intercept("GET", "/api/users/*", {
+    fixture: "api/user-detail.json",
+  }).as("getUserDetail");
+
+  // User roles
+  cy.intercept("PUT", "/api/users/*/roles/*", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("putUserRole");
+
+  cy.intercept("DELETE", "/api/users/*/roles/*", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("deleteUserRole");
+
+  // Filter detail (for fetchFunnel when entering filter from Files)
+  cy.intercept("GET", /\/api\/filters\/\d+$/, {
+    statusCode: 200,
+    body: { rules: [], log: { id: 1 }, name: "filtered-sample" },
+  }).as("getFilterDetail");
+
+  // Discover (map data)
+  cy.intercept("GET", "/api/logs/*/discover", {
+    fixture: "api/discover.json",
+  }).as("getDiscover");
+
+  cy.intercept("GET", "/api/filters/*/discover", {
+    fixture: "api/discover.json",
+  }).as("getFilterDiscover");
+
+  // Performance
+  cy.intercept("GET", "/api/logs/*/performance", {
+    fixture: "api/performance.json",
+  }).as("getPerformance");
+
+  cy.intercept("GET", "/api/filters/*/performance", {
+    fixture: "api/performance.json",
+  }).as("getFilterPerformance");
+
+  // Traces
+  cy.intercept("GET", "/api/logs/*/traces", {
+    fixture: "api/traces.json",
+  }).as("getTraces");
+
+  cy.intercept("GET", "/api/filters/*/traces", {
+    fixture: "api/traces.json",
+  }).as("getFilterTraces");
+
+  // Trace detail (must be after traces list intercepts)
+  cy.intercept("GET", /\/api\/logs\/.*\/traces\/\d+/, {
+    fixture: "api/trace-detail.json",
+  }).as("getTraceDetail");
+
+  cy.intercept("GET", /\/api\/filters\/.*\/traces\/\d+/, {
+    fixture: "api/trace-detail.json",
+  }).as("getFilterTraceDetail");
+
+  // Temp filters
+  cy.intercept("GET", "/api/temp-filters/*/discover", {
+    fixture: "api/discover.json",
+  }).as("getTempFilterDiscover");
+
+  cy.intercept("GET", "/api/temp-filters/*/traces", {
+    fixture: "api/traces.json",
+  }).as("getTempFilterTraces");
+
+  // Filter params
+  cy.intercept("GET", "/api/filters/params*", {
+    statusCode: 200,
+    body: {},
+  }).as("getFilterParams");
+
+  cy.intercept("GET", "/api/filters/has-result*", {
+    statusCode: 200,
+    body: false,
+  }).as("getFilterHasResult");
+
+  // Conformance check params
+  cy.intercept("GET", "/api/log-checks/params*", {
+    fixture: "api/filter-params.json",
+  }).as("getLogCheckParams");
+
+  cy.intercept("GET", "/api/filter-checks/params*", {
+    fixture: "api/filter-params.json",
+  }).as("getFilterCheckParams");
+
+  // Compare dashboard
+  cy.intercept("GET", /\/api\/compare\?datasets=/, {
+    fixture: "api/compare.json",
+  }).as("getCompare");
+
+  // Dependents (for delete confirmation)
+  cy.intercept("GET", "/api/logs/*/dependents", {
+    statusCode: 200,
+    body: [],
+  }).as("getLogDependents");
+
+  cy.intercept("GET", "/api/filters/*/dependents", {
+    statusCode: 200,
+    body: [],
+  }).as("getFilterDependents");
+
+  cy.intercept("GET", "/api/log-checks/*/dependents", {
+    statusCode: 200,
+    body: [],
+  }).as("getLogCheckDependents");
+
+  cy.intercept("GET", "/api/filter-checks/*/dependents", {
+    statusCode: 200,
+    body: [],
+  }).as("getFilterCheckDependents");
+
+  // Rename
+  cy.intercept("PUT", "/api/logs/*/rename", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("renameLog");
+
+  cy.intercept("PUT", "/api/filters/*/rename", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("renameFilter");
+
+  // Deletion
+  cy.intercept("DELETE", "/api/deletion/*", {
+    statusCode: 200,
+    body: { success: true },
+  }).as("deleteDeletion");
+}
+
+/**
+ * Sets the luciaToken cookie and isLuciaLoggedIn cookie to simulate
+ * a logged-in state, then sets up all API intercepts.
+ */
+export function loginWithFixtures() {
+  setupApiIntercepts();
+  cy.setCookie("luciaToken", "fake-access-token-for-testing");
+  cy.setCookie("isLuciaLoggedIn", "true");
+}

doc/structure.txt

@@ -1,28 +0,0 @@
-hello-vite/
-├── index.html Vite的進入點
-├── node_modules
-├── package.json
-├── package-lock.json
-├── public 不被 JavaScript 引用的靜態資源
-│   └── favicon.ico 網頁標題欄 icon
-├── README.md
-├── src
-│   ├── App.vue 網頁根元件
-│   ├── main.js 程式進入點
-│   ├── assets 靜態資源 EX: 圖片, CSS
-│   │   ├── base.css
-│   │   ├── logo.svg
-│   │   └── main.css
-│   ├── components 元件檔
-│   │   ├── HelloWorld.vue
-│   │   ├── icons (略 - 放所有 icon 的 svg 檔)
-│   │   ├── TheWelcome.vue
-│   │   └── WelcomeItem.vue
-│   ├── router Vue Router 路由管理
-│   │   └── index.js
-│   ├── stores Pinia 狀態管理器
-│   │   └── counter.js
-│   └── views 路由元件
-│       ├── AboutView.vue
-│       └── HomeView.vue
-└── vite.config.js    vite 設定檔

eslint.config.mjs

@@ -0,0 +1,129 @@
+// The Lucia project.
+// Copyright 2026-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2026/3/6
+/**
+ * @module eslint.config
+ *   ESLint flat configuration for Vue, Cypress, and
+ *   Prettier integration.
+ */
+
+import js from "@eslint/js";
+import pluginVue from "eslint-plugin-vue";
+import pluginCypress from "eslint-plugin-cypress";
+import skipFormatting from "@vue/eslint-config-prettier";
+
+/** Browser runtime globals used across app and jsdom tests. */
+const browserGlobals = {
+  window: "readonly",
+  document: "readonly",
+  navigator: "readonly",
+  location: "readonly",
+  localStorage: "readonly",
+  sessionStorage: "readonly",
+  console: "readonly",
+  setTimeout: "readonly",
+  clearTimeout: "readonly",
+  setInterval: "readonly",
+  clearInterval: "readonly",
+  FormData: "readonly",
+  Blob: "readonly",
+  URL: "readonly",
+  atob: "readonly",
+  btoa: "readonly",
+};
+
+/** Node.js globals used in config files. */
+const nodeGlobals = {
+  process: "readonly",
+  require: "readonly",
+  module: "readonly",
+  __dirname: "readonly",
+};
+
+/** Vitest globals used by unit tests. */
+const vitestGlobals = {
+  describe: "readonly",
+  it: "readonly",
+  test: "readonly",
+  expect: "readonly",
+  beforeEach: "readonly",
+  afterEach: "readonly",
+  beforeAll: "readonly",
+  afterAll: "readonly",
+  vi: "readonly",
+};
+
+export default [
+  {
+    ignores: [
+      "node_modules/**",
+      "dist/**",
+      "coverage/**",
+      "cypress/videos/**",
+      "cypress/screenshots/**",
+      "excludes/**",
+      "**/*.ts",
+      "**/*.d.ts",
+    ],
+  },
+  {
+    files: ["**/*.{js,mjs,cjs,vue}"],
+    ...js.configs.recommended,
+    languageOptions: {
+      ecmaVersion: "latest",
+      sourceType: "module",
+      globals: {
+        ...browserGlobals,
+      },
+    },
+    rules: {
+      "vue/multi-word-component-names": "error",
+    },
+  },
+  ...pluginVue.configs["flat/essential"],
+  skipFormatting,
+  {
+    files: ["tests/**/*.{js,mjs,cjs}"],
+    languageOptions: {
+      globals: {
+        ...browserGlobals,
+        ...nodeGlobals,
+        ...vitestGlobals,
+      },
+    },
+  },
+  {
+    files: ["cypress/**/*.{js,mjs,cjs}"],
+    ...pluginCypress.configs.recommended,
+    languageOptions: {
+      globals: {
+        ...browserGlobals,
+        ...nodeGlobals,
+        cy: "readonly",
+        Cypress: "readonly",
+      },
+    },
+  },
+  {
+    files: ["*.{js,mjs,cjs}", "**/*.config.{js,mjs,cjs}"],
+    languageOptions: {
+      globals: {
+        ...nodeGlobals,
+      },
+    },
+  },
+  {
+    files: ["src/**/*.vue", "src/views/**/*.vue", "src/components/**/*.vue"],
+    rules: {
+      "vue/multi-word-component-names": "error",
+      "vue/no-side-effects-in-computed-properties": "error",
+      "vue/return-in-computed-property": "error",
+      "vue/no-parsing-error": "error",
+      "vue/valid-v-else": "error",
+      "vue/no-deprecated-v-on-native-modifier": "error",
+      "vue/require-valid-default-prop": "error",
+      "vue/no-unused-vars": "error",
+    },
+  },
+];

index.html

@@ -1,3 +1,10 @@
+<!-- The Lucia project.
+     Copyright 2023-2026 DSP, inc.  All rights reserved.
+     Authors:
+       chiayin.kuo@dsp.im (chiayin), 2023/1/31
+       cindy.chang@dsp.im (Cindy Chang), 2024/7/9
+
+     Application entry point HTML template. -->
 <!DOCTYPE html>
 <html lang="en">
   <head>
@@ -8,6 +15,6 @@
   </head>
   <body>
     <div id="app"></div>
-    <script type="module" src="/src/main.js"></script>
+    <script type="module" src="/src/main.ts"></script>
   </body>
 </html>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "frontend",
-  "version": "0.2.0",
+  "version": "1.0.0",
   "private": true,
   "scripts": {
     "dev": "vite",
@@ -8,50 +8,73 @@
     "preview": "vite preview",
     "test": "vitest",
     "coverage": "vitest run --coverage",
-    "test:unit": "vitest --environment jsdom --root src/",
+    "cy:run": "cypress run",
+    "test:unit": "vitest --environment jsdom",
     "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'",
-    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore"
+    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs",
+    "lint:fix": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix",
+    "docs": "typedoc"
   },
   "dependencies": {
-    "autoprefixer": "^10.4.13",
-    "axios": "^1.2.2",
-    "cytoscape": "^3.23.0",
+    "@primevue/themes": "^4.5.4",
+    "@tailwindcss/postcss": "^4.2.1",
+    "axios": "^1.13.6",
+    "chart.js": "^4.5.1",
+    "chartjs-adapter-moment": "^1.0.1",
+    "chartjs-plugin-datalabels": "^2.2.0",
+    "cytoscape": "^3.33.1",
+    "cytoscape-cola": "^2.5.1",
     "cytoscape-dagre": "^2.5.0",
-    "cytoscape-popper": "^2.0.0",
-    "javascript-color-gradient": "^2.4.4",
-    "mitt": "^3.0.0",
-    "moment": "^2.29.4",
-    "pinia": "^2.0.28",
-    "postcss": "^8.4.20",
-    "primeicons": "^6.0.1",
-    "primevue": "^3.23.0",
-    "tailwindcss": "^3.2.4",
+    "cytoscape-fcose": "^2.2.0",
+    "cytoscape-popper": "^4.0.1",
+    "cytoscape-spread": "^3.0.0",
+    "decimal.js": "^10.6.0",
+    "i18next": "^25.8.14",
+    "i18next-browser-languagedetector": "^8.2.1",
+    "javascript-color-gradient": "^2.5.0",
+    "lodash-es": "^4.17.23",
+    "mitt": "^3.0.1",
+    "moment": "^2.30.1",
+    "pinia": "^3.0.4",
+    "pinia-plugin-persistedstate": "^4.7.1",
+    "primeicons": "^7.0.0",
+    "primevue": "^4.5.4",
     "tippy.js": "^6.3.7",
-    "vue": "^3.2.45",
-    "vue-axios": "^3.5.2",
-    "vue-router": "^4.1.6",
-    "vue-toast-notification": "^3.0.4",
+    "vue": "^3.5.29",
+    "vue-chartjs": "^5.3.3",
+    "vue-router": "^5.0.3",
+    "vue-sweetalert2": "^5.0.11",
+    "vue-toast-notification": "^3.1.3",
     "vuedraggable": "^4.1.0"
   },
   "devDependencies": {
-    "@rushstack/eslint-patch": "^1.1.4",
-    "@vitejs/plugin-vue": "^4.0.0",
-    "@vue/eslint-config-prettier": "^7.0.0",
-    "@vue/test-utils": "^2.2.6",
-    "autoprefixer": "^10.4.13",
-    "cypress": "^12.0.2",
-    "eslint": "^8.22.0",
-    "eslint-plugin-cypress": "^2.12.1",
-    "eslint-plugin-vue": "^9.3.0",
-    "html-webpack-plugin": "^5.5.0",
-    "jsdom": "^20.0.3",
-    "postcss": "^8.4.20",
-    "prettier": "^2.7.1",
-    "sass": "^1.57.1",
-    "start-server-and-test": "^1.15.2",
-    "tailwindcss": "^3.2.4",
-    "vite": "^4.0.0",
-    "vitest": "^0.25.6"
+    "@4tw/cypress-drag-drop": "^2.3.1",
+    "@eslint/js": "^10.0.1",
+    "@types/cytoscape": "^3.21.9",
+    "@types/cytoscape-dagre": "^2.3.4",
+    "@types/cytoscape-popper": "^2.0.4",
+    "@types/node": "^25.3.5",
+    "@vitejs/plugin-vue": "^6.0.4",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "@vue/test-utils": "^2.4.6",
+    "chartjs-plugin-dragdata": "^2.3.1",
+    "cypress": "^15.11.0",
+    "cypress-xpath": "^2.0.1",
+    "eslint": "^10.0.2",
+    "eslint-plugin-cypress": "^6.1.0",
+    "eslint-plugin-vue": "^10.8.0",
+    "jsdom": "^28.1.0",
+    "postcss": "^8.5.8",
+    "prettier": "^3.8.1",
+    "sass": "^1.97.3",
+    "start-server-and-test": "^2.1.5",
+    "tailwindcss": "^4.2.1",
+    "ts-node": "^10.9.2",
+    "typedoc": "^0.28.17",
+    "typescript": "^5.9.3",
+    "vite": "^7.3.1",
+    "vitest": "^4.0.18",
+    "vue-eslint-parser": "^10.4.0"
   }
 }

postcss.config.cjs

@@ -1,6 +1,15 @@
+// The Lucia project.
+// Copyright 2023-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   chiayin.kuo@dsp.im (chiayin), 2023/1/31
+//   imacat.yang@dsp.im (imacat), 2026/3/6
+/**
+ * @module postcss.config
+ *   PostCSS configuration with Tailwind CSS plugin.
+ */
+
 module.exports = {
   plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
+    "@tailwindcss/postcss": {},
   },
 };

src/App.vue

@@ -2,8 +2,15 @@
   <RouterView />
 </template>
 
-<style scoped></style>
+<script setup lang="ts">
+// The Lucia project.
+// Copyright 2023-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   chiayin.kuo@dsp.im (chiayin), 2023/1/31
+//   cindy.chang@dsp.im (Cindy Chang), 2024/5/30
+/**
+ * @module App Root application component that renders the router view.
+ */
 
-<script setup>
-import { RouterLink, RouterView } from "vue-router";
+import { RouterView } from "vue-router";
 </script>

src/api/auth.js

@@ -0,0 +1,53 @@
+// The Lucia project.
+// Copyright 2023-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2023/9/23
+/** @module auth Authentication token refresh utilities. */
+
+import axios from "axios";
+import {
+  getCookie,
+  setCookie,
+  setCookieWithoutExpiration,
+} from "@/utils/cookieUtil.js";
+
+/**
+ * Refreshes the access token using the stored refresh token cookie.
+ *
+ * Uses plain axios (not apiClient) to avoid interceptor loops. Updates
+ * both the access token (session cookie) and refresh token (6-month
+ * expiry) cookies.
+ *
+ * @returns {Promise<string>} The new access token.
+ * @throws {Error} If the refresh request fails.
+ */
+export async function refreshTokenAndGetNew() {
+  const api = "/api/oauth/token";
+  const config = {
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded",
+    },
+  };
+  const data = {
+    grant_type: "refresh_token",
+    refresh_token: getCookie("luciaRefreshToken"),
+  };
+
+  const response = await axios.post(api, data, config);
+  const newAccessToken = response.data?.access_token;
+  const newRefreshToken = response.data?.refresh_token;
+  if (!newAccessToken || !newRefreshToken) {
+    throw new Error("Invalid token response structure");
+  }
+
+  setCookieWithoutExpiration("luciaToken", newAccessToken);
+  // Expire in ~6 months
+  const expiredMs = new Date();
+  expiredMs.setMonth(expiredMs.getMonth() + 6);
+  const days = Math.ceil(
+    (expiredMs.getTime() - Date.now()) / (24 * 60 * 60 * 1000),
+  );
+  setCookie("luciaRefreshToken", newRefreshToken, days);
+
+  return newAccessToken;
+}

src/api/client.js

@@ -0,0 +1,99 @@
+// The Lucia project.
+// Copyright 2023-2026 DSP, inc.  All rights reserved.
+// Authors:
+//   imacat.yang@dsp.im (imacat), 2023/9/23
+/**
+ * @module apiClient Centralized axios instance with request/response
+ *   interceptors for authentication token management and automatic
+ *   401 token refresh with request queuing.
+ */
+
+import axios from "axios";
+import { getCookie, deleteCookie } from "@/utils/cookieUtil.js";
+
+/** Axios instance configured with auth interceptors. */
+const apiClient = axios.create();
+
+// Request interceptor: automatically attach Authorization header
+apiClient.interceptors.request.use((config) => {
+  const token = getCookie("luciaToken");
+  if (token) {
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+  return config;
+});
+
+// Response interceptor: handle 401 by attempting token refresh
+let isRefreshing = false;
+let pendingRequests = [];
+
+/**
+ * Resolves all pending requests with the new access token.
+ * @param {string} newToken - The refreshed access token.
+ */
+function onRefreshSuccess(newToken) {
+  pendingRequests.forEach((cb) => cb(newToken));
+  pendingRequests = [];
+}
+
+/**
+ * Rejects all pending requests with the refresh error.
+ * @param {Error} error - The token refresh error.
+ */
+function onRefreshFailure(error) {
+  pendingRequests.forEach((cb) => cb(null, error));
+  pendingRequests = [];
+}
+
+apiClient.interceptors.response.use(
+  (response) => response,
+  async (error) => {
+    const originalRequest = error.config;
+
+    // Only attempt refresh on 401, and not for auth endpoints or already-retried requests
+    if (
+      error.response?.status !== 401 ||
+      originalRequest._retried ||
+      originalRequest.url === "/api/oauth/token"
+    ) {
+      throw error;
+    }
+
+    if (isRefreshing) {
+      // Queue this request until the refresh completes
+      return new Promise((resolve, reject) => {
+        pendingRequests.push((newToken, err) => {
+          if (err) return reject(err);
+          originalRequest.headers.Authorization = `Bearer ${newToken}`;
+          originalRequest._retried = true;
+          resolve(apiClient(originalRequest));
+        });
+      });
+    }
+
+    isRefreshing = true;
+    originalRequest._retried = true;
+
+    try {
+      // Dynamic import to avoid circular dependency with login store
+      const { refreshTokenAndGetNew } = await import("@/api/auth.js");
+      const newToken = await refreshTokenAndGetNew();
+      isRefreshing = false;
+      onRefreshSuccess(newToken);
+      originalRequest.headers.Authorization = `Bearer ${newToken}`;
+      return apiClient(originalRequest);
+    } catch (refreshError) {
+      isRefreshing = false;
+      onRefreshFailure(refreshError);
+
+      // Refresh failed: clear auth and redirect to login
+      deleteCookie("luciaToken");
+      deleteCookie("luciaRefreshToken");
+      deleteCookie("isLuciaLoggedIn");
+      globalThis.location.href = "/login";
+      throw refreshError;
+    }
+  },
+);
+
+export default apiClient;

src/assets/base.css

@@ -1,4 +1,13 @@
-/* 全域字型 */
+/* The Lucia project.
+   Copyright 2023-2026 DSP, inc.  All rights reserved.
+   Authors:
+     chiayin.kuo@dsp.im (chiayin), 2023/4/18
+     cindy.chang@dsp.im (Cindy Chang), 2024/8/16
+
+   Base CSS layer with global font, validation, height,
+   and PrimeVue sidebar overrides. */
+
+/* Global font */
 @layer base {
   html {
     font-family: 'Roboto', sans-serif, system-ui;
@@ -18,3 +27,13 @@
 .h-screen-main {
   height: calc(100vh - 104px);
 }
+
+/* button */
+.disable-hover {
+  @apply pointer-events-none
+}
+
+/* Map i panel ; overwrite primevue style */
+.p-sidebar .p-sidebar-header {
+  padding: 8px;
+}

src/assets/capsule1-glow.svg

@@ -0,0 +1,6 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#0099FF"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="white"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#BFE5FF"/>
+</svg>

src/assets/capsule1.svg

@@ -0,0 +1,6 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#64748B"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="white"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#BFE5FF"/>
+</svg>

src/assets/capsule2-glow.svg

@@ -0,0 +1,7 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#0099FF"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="white"/>
+<rect x="14" y="14" width="20" height="20" rx="10" fill="#BFE5FF"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#80CCFF"/>
+</svg>

src/assets/capsule2.svg

@@ -0,0 +1,7 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#64748B"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="white"/>
+<rect x="14" y="14" width="20" height="20" rx="10" fill="#BFE5FF"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#80CCFF"/>
+</svg>

src/assets/capsule3-glow.svg

@@ -0,0 +1,8 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#0099FF"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="white"/>
+<rect x="9" y="9" width="30" height="30" rx="15" fill="#BFE5FF"/>
+<rect x="14" y="14" width="20" height="20" rx="10" fill="#80CCFF"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#0099FF"/>
+</svg>

src/assets/capsule3.svg

@@ -0,0 +1,8 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#64748B"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="white"/>
+<rect x="9" y="9" width="30" height="30" rx="15" fill="#BFE5FF"/>
+<rect x="14" y="14" width="20" height="20" rx="10" fill="#80CCFF"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#0099FF"/>
+</svg>

src/assets/capsule4-glow.svg

@@ -0,0 +1,8 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#0099FF"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="#BFE5FF"/>
+<rect x="9" y="9" width="30" height="30" rx="15" fill="#80CCFF"/>
+<rect x="14" y="14" width="20" height="20" rx="10" fill="#0099FF"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#0073BF"/>
+</svg>

src/assets/capsule4.svg

@@ -0,0 +1,8 @@
+<svg width="216" height="48" viewBox="0 0 216 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" fill="white"/>
+<rect x="0.5" y="0.5" width="215" height="47" rx="23.5" stroke="#64748B"/>
+<rect x="4" y="4" width="40" height="40" rx="20" fill="#BFE5FF"/>
+<rect x="9" y="9" width="30" height="30" rx="15" fill="#80CCFF"/>
+<rect x="14" y="14" width="20" height="20" rx="10" fill="#0099FF"/>
+<rect x="19" y="19" width="10" height="10" rx="5" fill="#0073BF"/>
+</svg>

src/assets/components.css

@@ -1,3 +1,11 @@
+/* The Lucia project.
+   Copyright 2023-2026 DSP, inc.  All rights reserved.
+   Authors:
+     chiayin.kuo@dsp.im (chiayin), 2023/2/17
+
+   Reusable component styles including loaders, scrollbar,
+   buttons, and toggle buttons. */
+
 /* loading */
 .loader {
   width: 64px;
@@ -30,62 +38,29 @@
     transform: rotate(360deg)
   }
 }
+/* loaderBar */
+/* <span class="loaderBar"></span> */
+.loaderBar {
+  width: 80%;
+  height: 16px;
+  display: inline-block;
+  background-color: #0099FF;
+  border: 1px solid #0099FF;
+  border-radius: 4px;
+  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+  font-size: 30px;
+  background-size: 1em 1em;
+  box-sizing: border-box;
+  animation: barStripe 1s linear infinite;
+}
 
-/* toggle */
-/* <div class="toggle">
-    <input type="checkbox"/>
-    <label></label>
-</div> */
-.toggle {
-  position: relative;
-}
-.toggle input[type="checkbox"] {
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 10;
-  width: 100%;
-  height: 100%;
-  cursor: pointer;
-  opacity: 0;
-}
-.toggle label {
-  position: relative;
-  display: flex;
-  align-items: center;
-}
-.toggle label:before {
-    content: '';
-    border: 5px solid #bbb;
-    height: 35px;
-    width: 70px;
-    position: relative;
-    display: inline-block;
-    border-radius: 46px;
-    transition: 0.2s ease-in;
-}
-.toggle label:after {
-    content: '';
-    position: absolute;
-    background: #555;
-    width: 28px;
-    height: 28px;
-    left: 8px;
-    top: 8px;
-    border-radius: 50%;
-    z-index: 2;
-    box-shadow: 0 0 5px #0002;
-    transition: 0.2s ease-in;
-}
-.toggle input[type="checkbox"]:hover + label:after  {
-    box-shadow: 0 2px 15px 0 #0002, 0 3px 8px 0 #0001;
-}
-.toggle input[type="checkbox"]:checked + label:before {
-  border-color: #77C2BB;
-}
-.toggle input[type="checkbox"]:checked + label:after {
-  background: #009688;
-  left: 44px;
+@keyframes barStripe {
+  0% {
+    background-position: 0 0;
+  }
+  100% {
+    background-position: 1em 0;
+  }
 }
 
 /* components */
@@ -100,11 +75,11 @@
   }
 
   .scrollbar::-webkit-scrollbar-thumb {
-    @apply bg-primary rounded-full
+    @apply bg-neutral-300 rounded-full
   }
 
   .scrollbar::-webkit-scrollbar-thumb:hover {
-    @apply bg-primary
+    @apply bg-neutral-400
   }
 }
 
@@ -119,7 +94,10 @@
   @apply px-4 py-2.5
 }
 .btn-c-primary {
-  @apply text-neutral-50 bg-primary border border-primary hover:bg-neutral-50 hover:text-primary hover:border  hover:border-primary active:border active:ring focus:outline-none focus:border-primary focus:ring
+  @apply hover:text-neutral-50 hover:bg-primary border border-primary bg-neutral-50 text-primary active:ring focus:outline-none active:ring-primary/50 focus:ring focus:ring-primary/50
+}
+.btn-cfm-secondary {
+  @apply  border border-cfm-secondary bg-neutral-50 text-cfm-secondary hover:text-neutral-50 hover:bg-cfm-secondary active:ring focus:outline-none  active:ring-cfm-secondary/50 focus:ring focus:ring-cfm-secondary/50
 }
 .btn-disable {
   @apply border border-neutral-200 bg-neutral-50 text-neutral-200

src/assets/icon-alert.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.78415 2.03878C9.62269 1.72766 9.36953 1.46508 9.05382 1.28129C8.73812 1.09751 8.37272 1 7.99974 1C7.62675 1 7.26135 1.09751 6.94565 1.28129C6.62994 1.46508 6.37678 1.72766 6.21532 2.03878L0.520353 12.4048C-0.160994 13.6423 0.699988 15.2857 2.30407 15.2857H13.6947C15.2995 15.2857 16.1591 13.643 15.4791 12.4048L9.78415 2.03878ZM7.99974 5.54628C8.18584 5.54628 8.36432 5.61468 8.49591 5.73645C8.6275 5.85822 8.70143 6.02337 8.70143 6.19557V9.44205C8.70143 9.61425 8.6275 9.77941 8.49591 9.90117C8.36432 10.0229 8.18584 10.0913 7.99974 10.0913C7.81363 10.0913 7.63516 10.0229 7.50356 9.90117C7.37197 9.77941 7.29804 9.61425 7.29804 9.44205V6.19557C7.29804 6.02337 7.37197 5.85822 7.50356 5.73645C7.63516 5.61468 7.81363 5.54628 7.99974 5.54628ZM7.99974 11.0653C8.18584 11.0653 8.36432 11.1337 8.49591 11.2555C8.6275 11.3772 8.70143 11.5424 8.70143 11.7146V12.0392C8.70143 12.2114 8.6275 12.3766 8.49591 12.4984C8.36432 12.6201 8.18584 12.6885 7.99974 12.6885C7.81363 12.6885 7.63516 12.6201 7.50356 12.4984C7.37197 12.3766 7.29804 12.2114 7.29804 12.0392V11.7146C7.29804 11.5424 7.37197 11.3772 7.50356 11.2555C7.63516 11.1337 7.81363 11.0653 7.99974 11.0653Z" fill="#FF3366"/>
+</svg>

src/assets/icon-blue-checkbox.svg

@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1" y="1" width="16" height="16" rx="2" fill="white" stroke="#0099FF" stroke-width="2"/>
+</svg>

src/assets/icon-checkbox-checked.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="11" viewBox="0 0 14 11" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 10.4999L0 5.53988L1.59 3.99988L5 7.34988L12.41 -0.00012207L14 1.57988L5 10.4999Z" fill="#0099FF"/>
+</svg>

src/assets/icon-checkbox-empty.svg

@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1" y="1" width="16" height="16" rx="2" fill="white" stroke="#CBD5E1" stroke-width="2"/>
+</svg>

src/assets/icon-crown.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="17" viewBox="0 0 22 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21.3782 3.89078C21.1637 3.7117 20.9032 3.59652 20.6263 3.5584C20.3495 3.52027 20.0675 3.56073 19.8126 3.67515L15.0688 5.78453L12.3126 0.815776C12.1809 0.583799 11.99 0.390881 11.7594 0.256672C11.5289 0.122463 11.2669 0.0517578 11.0001 0.0517578C10.7333 0.0517578 10.4713 0.122463 10.2408 0.256672C10.0102 0.390881 9.81934 0.583799 9.6876 0.815776L6.93135 5.78453L2.1876 3.67515C1.93214 3.5609 1.64981 3.52039 1.37252 3.5582C1.09524 3.59601 0.834067 3.71064 0.618523 3.88912C0.402979 4.0676 0.241662 4.30282 0.15281 4.56819C0.0639569 4.83356 0.0511114 5.11849 0.115725 5.39078L2.49697 15.5439C2.54251 15.7405 2.62747 15.9257 2.74672 16.0885C2.86597 16.2513 3.01702 16.3881 3.19072 16.4908C3.42589 16.6315 3.69477 16.7061 3.96885 16.7064C4.10208 16.7062 4.23462 16.6872 4.3626 16.6502C8.70306 15.4501 13.2878 15.4501 17.6282 16.6502C18.0245 16.7543 18.446 16.697 18.8001 16.4908C18.9749 16.3894 19.1267 16.253 19.2461 16.09C19.3655 15.927 19.4499 15.7411 19.4938 15.5439L21.8845 5.39078C21.9484 5.11841 21.9348 4.83361 21.8454 4.56855C21.7559 4.30349 21.5941 4.06872 21.3782 3.89078ZM18.0313 15.2064C13.4274 13.9314 8.56346 13.9314 3.95948 15.2064L1.57823 5.05328L6.32197 7.15328C6.66236 7.30802 7.04868 7.32831 7.4034 7.21007C7.75813 7.09182 8.05501 6.8438 8.23447 6.51578L11.0001 1.54703L13.7657 6.51578C13.9452 6.8438 14.2421 7.09182 14.5968 7.21007C14.9515 7.32831 15.3378 7.30802 15.6782 7.15328L20.422 5.05328L18.0313 15.2064ZM14.7501 12.2345C14.7294 12.4194 14.6417 12.5902 14.5034 12.7146C14.3652 12.839 14.1861 12.9084 14.0001 12.9095H13.9251C11.9801 12.7126 10.0201 12.7126 8.0751 12.9095C7.87745 12.9305 7.67955 12.8722 7.52486 12.7474C7.37017 12.6226 7.27135 12.4415 7.2501 12.2439C7.23172 12.0453 7.29222 11.8474 7.41852 11.6931C7.54482 11.5387 7.72679 11.4402 7.9251 11.4189C9.96943 11.2033 12.0308 11.2033 14.0751 11.4189C14.2716 11.4402 14.4521 11.5374 14.5782 11.6897C14.7042 11.842 14.7659 12.0375 14.7501 12.2345Z" fill="#0F172A"/>
+</svg>

src/assets/icon-delete-gray.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.5559 5.07692H16.667V4.30769C16.6644 3.69643 16.4178 3.11093 15.9807 2.6787C15.5437 2.24647 14.9517 2.00253 14.3337 2H9.66699C9.04894 2.00253 8.45694 2.24647 8.0199 2.6787C7.58287 3.11093 7.33622 3.69643 7.33366 4.30769V5.07692H3.44477C3.23849 5.07692 3.04066 5.15797 2.8948 5.30223C2.74894 5.44648 2.66699 5.64214 2.66699 5.84615C2.66699 6.05017 2.74894 6.24582 2.8948 6.39008C3.04066 6.53434 3.23849 6.61538 3.44477 6.61538H4.22255V20.4615C4.22255 20.8696 4.38644 21.2609 4.67816 21.5494C4.96988 21.8379 5.36554 22 5.7781 22H18.2225C18.6351 22 19.0308 21.8379 19.3225 21.5494C19.6142 21.2609 19.7781 20.8696 19.7781 20.4615V6.61538H20.5559C20.7622 6.61538 20.96 6.53434 21.1059 6.39008C21.2517 6.24582 21.3337 6.05017 21.3337 5.84615C21.3337 5.64214 21.2517 5.44648 21.1059 5.30223C20.96 5.15797 20.7622 5.07692 20.5559 5.07692ZM8.88921 4.30769C8.88921 4.10368 8.97116 3.90802 9.11702 3.76376C9.26288 3.61951 9.46071 3.53846 9.66699 3.53846H14.3337C14.5399 3.53846 14.7378 3.61951 14.8836 3.76376C15.0295 3.90802 15.1114 4.10368 15.1114 4.30769V5.07692H8.88921V4.30769ZM18.2225 20.4615H5.7781V6.61538H18.2225V20.4615ZM10.4448 10.4615V16.6154C10.4448 16.8194 10.3628 17.0151 10.217 17.1593C10.0711 17.3036 9.87327 17.3846 9.66699 17.3846C9.46071 17.3846 9.26288 17.3036 9.11702 17.1593C8.97116 17.0151 8.88921 16.8194 8.88921 16.6154V10.4615C8.88921 10.2575 8.97116 10.0619 9.11702 9.91761C9.26288 9.77335 9.46071 9.69231 9.66699 9.69231C9.87327 9.69231 10.0711 9.77335 10.217 9.91761C10.3628 10.0619 10.4448 10.2575 10.4448 10.4615ZM15.1114 10.4615V16.6154C15.1114 16.8194 15.0295 17.0151 14.8836 17.1593C14.7378 17.3036 14.5399 17.3846 14.3337 17.3846C14.1274 17.3846 13.9295 17.3036 13.7837 17.1593C13.6378 17.0151 13.5559 16.8194 13.5559 16.6154V10.4615C13.5559 10.2575 13.6378 10.0619 13.7837 9.91761C13.9295 9.77335 14.1274 9.69231 14.3337 9.69231C14.5399 9.69231 14.7378 9.77335 14.8836 9.91761C15.0295 10.0619 15.1114 10.2575 15.1114 10.4615Z" fill="#64748B"/>
+</svg>

src/assets/icon-delete-red.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.5559 5.07692H16.667V4.30769C16.6644 3.69643 16.4178 3.11093 15.9807 2.6787C15.5437 2.24647 14.9517 2.00253 14.3337 2H9.66699C9.04894 2.00253 8.45694 2.24647 8.0199 2.6787C7.58287 3.11093 7.33622 3.69643 7.33366 4.30769V5.07692H3.44477C3.23849 5.07692 3.04066 5.15797 2.8948 5.30223C2.74894 5.44648 2.66699 5.64214 2.66699 5.84615C2.66699 6.05017 2.74894 6.24582 2.8948 6.39008C3.04066 6.53434 3.23849 6.61538 3.44477 6.61538H4.22255V20.4615C4.22255 20.8696 4.38644 21.2609 4.67816 21.5494C4.96988 21.8379 5.36554 22 5.7781 22H18.2225C18.6351 22 19.0308 21.8379 19.3225 21.5494C19.6142 21.2609 19.7781 20.8696 19.7781 20.4615V6.61538H20.5559C20.7622 6.61538 20.96 6.53434 21.1059 6.39008C21.2517 6.24582 21.3337 6.05017 21.3337 5.84615C21.3337 5.64214 21.2517 5.44648 21.1059 5.30223C20.96 5.15797 20.7622 5.07692 20.5559 5.07692ZM8.88921 4.30769C8.88921 4.10368 8.97116 3.90802 9.11702 3.76376C9.26288 3.61951 9.46071 3.53846 9.66699 3.53846H14.3337C14.5399 3.53846 14.7378 3.61951 14.8836 3.76376C15.0295 3.90802 15.1114 4.10368 15.1114 4.30769V5.07692H8.88921V4.30769ZM18.2225 20.4615H5.7781V6.61538H18.2225V20.4615ZM10.4448 10.4615V16.6154C10.4448 16.8194 10.3628 17.0151 10.217 17.1593C10.0711 17.3036 9.87327 17.3846 9.66699 17.3846C9.46071 17.3846 9.26288 17.3036 9.11702 17.1593C8.97116 17.0151 8.88921 16.8194 8.88921 16.6154V10.4615C8.88921 10.2575 8.97116 10.0619 9.11702 9.91761C9.26288 9.77335 9.46071 9.69231 9.66699 9.69231C9.87327 9.69231 10.0711 9.77335 10.217 9.91761C10.3628 10.0619 10.4448 10.2575 10.4448 10.4615ZM15.1114 10.4615V16.6154C15.1114 16.8194 15.0295 17.0151 14.8836 17.1593C14.7378 17.3036 14.5399 17.3846 14.3337 17.3846C14.1274 17.3846 13.9295 17.3036 13.7837 17.1593C13.6378 17.0151 13.5559 16.8194 13.5559 16.6154V10.4615C13.5559 10.2575 13.6378 10.0619 13.7837 9.91761C13.9295 9.77335 14.1274 9.69231 14.3337 9.69231C14.5399 9.69231 14.7378 9.77335 14.8836 9.91761C15.0295 10.0619 15.1114 10.2575 15.1114 10.4615Z" fill="#FF3366"/>
+</svg>

src/assets/icon-detail-card.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18.75 10.5C18.75 10.6989 18.671 10.8897 18.5303 11.0303C18.3897 11.171 18.1989 11.25 18 11.25H14.25C14.0511 11.25 13.8603 11.171 13.7197 11.0303C13.579 10.8897 13.5 10.6989 13.5 10.5C13.5 10.3011 13.579 10.1103 13.7197 9.96967C13.8603 9.82902 14.0511 9.75 14.25 9.75H18C18.1989 9.75 18.3897 9.82902 18.5303 9.96967C18.671 10.1103 18.75 10.3011 18.75 10.5ZM18 12.75H14.25C14.0511 12.75 13.8603 12.829 13.7197 12.9697C13.579 13.1103 13.5 13.3011 13.5 13.5C13.5 13.6989 13.579 13.8897 13.7197 14.0303C13.8603 14.171 14.0511 14.25 14.25 14.25H18C18.1989 14.25 18.3897 14.171 18.5303 14.0303C18.671 13.8897 18.75 13.6989 18.75 13.5C18.75 13.3011 18.671 13.1103 18.5303 12.9697C18.3897 12.829 18.1989 12.75 18 12.75ZM12.2625 15.5625C12.2878 15.6573 12.2941 15.7562 12.2809 15.8535C12.2677 15.9507 12.2353 16.0444 12.1855 16.129C12.1358 16.2136 12.0698 16.2875 11.9912 16.3463C11.9127 16.4052 11.8233 16.4479 11.7281 16.4719C11.6327 16.4973 11.5332 16.5037 11.4353 16.4906C11.3374 16.4775 11.2431 16.4452 11.1578 16.3955C11.0724 16.3459 10.9977 16.2799 10.9379 16.2013C10.8781 16.1227 10.8344 16.033 10.8094 15.9375C10.6823 15.4576 10.4 15.0333 10.0067 14.7305C9.61326 14.4278 9.13079 14.2636 8.63437 14.2636C8.13796 14.2636 7.65549 14.4278 7.26209 14.7305C6.8687 15.0333 6.58648 15.4576 6.45938 15.9375C6.41615 16.0985 6.32112 16.2409 6.18896 16.3425C6.0568 16.4442 5.89486 16.4995 5.72812 16.5L5.54062 16.4719C5.44547 16.4479 5.35603 16.4052 5.2775 16.3463C5.19898 16.2875 5.13294 16.2136 5.08322 16.129C5.0335 16.0444 5.00109 15.9507 4.98788 15.8535C4.97466 15.7562 4.98091 15.6573 5.00625 15.5625C5.23456 14.676 5.77774 13.9028 6.53437 13.3875C6.10882 12.9704 5.81713 12.436 5.69649 11.8524C5.57586 11.2688 5.63175 10.6626 5.85703 10.1109C6.08232 9.55922 6.46679 9.08714 6.96143 8.75484C7.45608 8.42254 8.03848 8.24507 8.63437 8.24507C9.23027 8.24507 9.81267 8.42254 10.3073 8.75484C10.802 9.08714 11.1864 9.55922 11.4117 10.1109C11.637 10.6626 11.6929 11.2688 11.5723 11.8524C11.4516 12.436 11.1599 12.9704 10.7344 13.3875C11.491 13.9028 12.0342 14.676 12.2625 15.5625ZM8.63437 12.75C8.93105 12.75 9.22106 12.662 9.46773 12.4972C9.7144 12.3324 9.90666 12.0981 10.0202 11.824C10.1337 11.5499 10.1634 11.2483 10.1056 10.9574C10.0477 10.6664 9.90481 10.3991 9.69504 10.1893C9.48526 9.97956 9.21798 9.8367 8.92701 9.77882C8.63604 9.72094 8.33444 9.75065 8.06035 9.86418C7.78626 9.97771 7.55199 10.17 7.38717 10.4166C7.22235 10.6633 7.13438 10.9533 7.13437 11.25C7.13437 11.6478 7.29241 12.0294 7.57372 12.3107C7.85502 12.592 8.23655 12.75 8.63437 12.75ZM21.75 5.25V18.75C21.75 19.1478 21.592 19.5294 21.3107 19.8107C21.0294 20.092 20.6478 20.25 20.25 20.25H3.75C3.35218 20.25 2.97064 20.092 2.68934 19.8107C2.40804 19.5294 2.25 19.1478 2.25 18.75V5.25C2.25 4.85218 2.40804 4.47064 2.68934 4.18934C2.97064 3.90804 3.35218 3.75 3.75 3.75H20.25C20.6478 3.75 21.0294 3.90804 21.3107 4.18934C21.592 4.47064 21.75 4.85218 21.75 5.25ZM20.25 18.75V5.25H3.75V18.75H20.25Z" fill="#64748B"/>
+</svg>

src/assets/icon-detail-on.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18.75 10.5C18.75 10.6989 18.671 10.8897 18.5303 11.0303C18.3897 11.171 18.1989 11.25 18 11.25H14.25C14.0511 11.25 13.8603 11.171 13.7197 11.0303C13.579 10.8897 13.5 10.6989 13.5 10.5C13.5 10.3011 13.579 10.1103 13.7197 9.96967C13.8603 9.82902 14.0511 9.75 14.25 9.75H18C18.1989 9.75 18.3897 9.82902 18.5303 9.96967C18.671 10.1103 18.75 10.3011 18.75 10.5ZM18 12.75H14.25C14.0511 12.75 13.8603 12.829 13.7197 12.9697C13.579 13.1103 13.5 13.3011 13.5 13.5C13.5 13.6989 13.579 13.8897 13.7197 14.0303C13.8603 14.171 14.0511 14.25 14.25 14.25H18C18.1989 14.25 18.3897 14.171 18.5303 14.0303C18.671 13.8897 18.75 13.6989 18.75 13.5C18.75 13.3011 18.671 13.1103 18.5303 12.9697C18.3897 12.829 18.1989 12.75 18 12.75ZM12.2625 15.5625C12.2878 15.6573 12.2941 15.7562 12.2809 15.8535C12.2677 15.9507 12.2353 16.0444 12.1855 16.129C12.1358 16.2136 12.0698 16.2875 11.9912 16.3463C11.9127 16.4052 11.8233 16.4479 11.7281 16.4719C11.6327 16.4973 11.5332 16.5037 11.4353 16.4906C11.3374 16.4775 11.2431 16.4452 11.1578 16.3955C11.0724 16.3459 10.9977 16.2799 10.9379 16.2013C10.8781 16.1227 10.8344 16.033 10.8094 15.9375C10.6823 15.4576 10.4 15.0333 10.0067 14.7305C9.61326 14.4278 9.13079 14.2636 8.63437 14.2636C8.13796 14.2636 7.65549 14.4278 7.26209 14.7305C6.8687 15.0333 6.58648 15.4576 6.45938 15.9375C6.41615 16.0985 6.32112 16.2409 6.18896 16.3425C6.0568 16.4442 5.89486 16.4995 5.72812 16.5L5.54062 16.4719C5.44547 16.4479 5.35603 16.4052 5.2775 16.3463C5.19898 16.2875 5.13294 16.2136 5.08322 16.129C5.0335 16.0444 5.00109 15.9507 4.98788 15.8535C4.97466 15.7562 4.98091 15.6573 5.00625 15.5625C5.23456 14.676 5.77774 13.9028 6.53437 13.3875C6.10882 12.9704 5.81713 12.436 5.69649 11.8524C5.57586 11.2688 5.63175 10.6626 5.85703 10.1109C6.08232 9.55922 6.46679 9.08714 6.96143 8.75484C7.45608 8.42254 8.03848 8.24507 8.63437 8.24507C9.23027 8.24507 9.81267 8.42254 10.3073 8.75484C10.802 9.08714 11.1864 9.55922 11.4117 10.1109C11.637 10.6626 11.6929 11.2688 11.5723 11.8524C11.4516 12.436 11.1599 12.9704 10.7344 13.3875C11.491 13.9028 12.0342 14.676 12.2625 15.5625ZM8.63437 12.75C8.93105 12.75 9.22106 12.662 9.46773 12.4972C9.7144 12.3324 9.90666 12.0981 10.0202 11.824C10.1337 11.5499 10.1634 11.2483 10.1056 10.9574C10.0477 10.6664 9.90481 10.3991 9.69504 10.1893C9.48526 9.97956 9.21798 9.8367 8.92701 9.77882C8.63604 9.72094 8.33444 9.75065 8.06035 9.86418C7.78626 9.97771 7.55199 10.17 7.38717 10.4166C7.22235 10.6633 7.13438 10.9533 7.13437 11.25C7.13437 11.6478 7.29241 12.0294 7.57372 12.3107C7.85502 12.592 8.23655 12.75 8.63437 12.75ZM21.75 5.25V18.75C21.75 19.1478 21.592 19.5294 21.3107 19.8107C21.0294 20.092 20.6478 20.25 20.25 20.25H3.75C3.35218 20.25 2.97064 20.092 2.68934 19.8107C2.40804 19.5294 2.25 19.1478 2.25 18.75V5.25C2.25 4.85218 2.40804 4.47064 2.68934 4.18934C2.97064 3.90804 3.35218 3.75 3.75 3.75H20.25C20.6478 3.75 21.0294 3.90804 21.3107 4.18934C21.592 4.47064 21.75 4.85218 21.75 5.25ZM20.25 18.75V5.25H3.75V18.75H20.25Z" fill="#0099FF"/>
+</svg>

src/assets/icon-edit-off.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 19H6.4L15.025 10.375L13.625 8.975L5 17.6V19ZM19.3 8.925L15.05 4.725L16.45 3.325C16.8333 2.94167 17.3043 2.75 17.863 2.75C18.421 2.75 18.8917 2.94167 19.275 3.325L20.675 4.725C21.0583 5.10833 21.2583 5.571 21.275 6.113C21.2917 6.65433 21.1083 7.11667 20.725 7.5L19.3 8.925ZM4 21C3.71667 21 3.47933 20.904 3.288 20.712C3.096 20.5207 3 20.2833 3 20V17.175C3 17.0417 3.025 16.9127 3.075 16.788C3.125 16.6627 3.2 16.55 3.3 16.45L13.6 6.15L17.85 10.4L7.55 20.7C7.45 20.8 7.33767 20.875 7.213 20.925C7.08767 20.975 6.95833 21 6.825 21H4ZM14.325 9.675L13.625 8.975L15.025 10.375L14.325 9.675Z" fill="#64748B"/>
+</svg>

src/assets/icon-edit-on.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 19H6.4L15.025 10.375L13.625 8.975L5 17.6V19ZM19.3 8.925L15.05 4.725L16.45 3.325C16.8333 2.94167 17.3043 2.75 17.863 2.75C18.421 2.75 18.8917 2.94167 19.275 3.325L20.675 4.725C21.0583 5.10833 21.2583 5.571 21.275 6.113C21.2917 6.65433 21.1083 7.11667 20.725 7.5L19.3 8.925ZM4 21C3.71667 21 3.47933 20.904 3.288 20.712C3.096 20.5207 3 20.2833 3 20V17.175C3 17.0417 3.025 16.9127 3.075 16.788C3.125 16.6627 3.2 16.55 3.3 16.45L13.6 6.15L17.85 10.4L7.55 20.7C7.45 20.8 7.33767 20.875 7.213 20.925C7.08767 20.975 6.95833 21 6.825 21H4ZM14.325 9.675L13.625 8.975L15.025 10.375L14.325 9.675Z" fill="#0099FF"/>
+</svg>

src/assets/icon-eye-hide.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 5.27L3.28 4L20 20.72L18.73 22L15.65 18.92C14.5 19.3 13.28 19.5 12 19.5C7 19.5 2.73 16.39 1 12C1.69 10.24 2.79 8.69 4.19 7.46L2 5.27ZM12 9C12.7956 9 13.5587 9.31607 14.1213 9.87868C14.6839 10.4413 15 11.2044 15 12C15.0005 12.3406 14.943 12.6787 14.83 13L11 9.17C11.3213 9.05698 11.6594 8.99949 12 9ZM12 4.5C17 4.5 21.27 7.61 23 12C22.1839 14.0732 20.7969 15.8727 19 17.19L17.58 15.76C18.9629 14.8034 20.0782 13.5091 20.82 12C20.0116 10.3499 18.7564 8.95977 17.1973 7.9875C15.6381 7.01524 13.8375 6.49988 12 6.5C10.91 6.5 9.84 6.68 8.84 7L7.3 5.47C8.74 4.85 10.33 4.5 12 4.5ZM3.18 12C3.98844 13.6501 5.24357 15.0402 6.80273 16.0125C8.36189 16.9848 10.1625 17.5001 12 17.5C12.69 17.5 13.37 17.43 14 17.29L11.72 15C11.0242 14.9254 10.3748 14.6149 9.87997 14.12C9.38512 13.6252 9.07458 12.9758 9 12.28L5.6 8.87C4.61 9.72 3.78 10.78 3.18 12Z" fill="#64748B"/>
+</svg>

src/assets/icon-eye-open.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 9C12.7956 9 13.5587 9.31607 14.1213 9.87868C14.6839 10.4413 15 11.2044 15 12C15 12.7956 14.6839 13.5587 14.1213 14.1213C13.5587 14.6839 12.7956 15 12 15C11.2044 15 10.4413 14.6839 9.87868 14.1213C9.31607 13.5587 9 12.7956 9 12C9 11.2044 9.31607 10.4413 9.87868 9.87868C10.4413 9.31607 11.2044 9 12 9ZM12 4.5C17 4.5 21.27 7.61 23 12C21.27 16.39 17 19.5 12 19.5C7 19.5 2.73 16.39 1 12C2.73 7.61 7 4.5 12 4.5ZM3.18 12C3.98825 13.6503 5.24331 15.0407 6.80248 16.0133C8.36165 16.9858 10.1624 17.5013 12 17.5013C13.8376 17.5013 15.6383 16.9858 17.1975 16.0133C18.7567 15.0407 20.0117 13.6503 20.82 12C20.0117 10.3497 18.7567 8.95925 17.1975 7.98675C15.6383 7.01424 13.8376 6.49868 12 6.49868C10.1624 6.49868 8.36165 7.01424 6.80248 7.98675C5.24331 8.95925 3.98825 10.3497 3.18 12Z" fill="#64748B"/>
+</svg>

src/assets/icon-head-black.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20 10.0009C20.0001 8.33719 19.5851 6.69976 18.7926 5.23693C18.0002 3.7741 16.8554 2.5321 15.4618 1.62342C14.0683 0.714739 12.47 0.168101 10.8119 0.0330203C9.15382 -0.10206 7.48821 0.178686 5.96597 0.849826C4.44374 1.52097 3.11298 2.5613 2.09425 3.87657C1.07552 5.19185 0.401001 6.74052 0.131798 8.38229C-0.137405 10.0241 0.00721324 11.7071 0.552553 13.2788C1.09789 14.8506 2.02672 16.2615 3.2549 17.3837L3.37255 17.4817C5.19907 19.104 7.55712 20 10 20C12.4429 20 14.8009 19.104 16.6275 17.4817L16.7451 17.3837C17.7716 16.4474 18.5913 15.3071 19.1518 14.0359C19.7123 12.7646 20.0012 11.3903 20 10.0009ZM1.17647 10.0009C1.1745 8.56033 1.52523 7.1412 2.19802 5.86743C2.87081 4.59365 3.84521 3.50398 5.03612 2.69356C6.22703 1.88315 7.59822 1.37664 9.02997 1.21827C10.4617 1.0599 11.9104 1.25448 13.2497 1.78503C14.5889 2.31558 15.7779 3.16596 16.7127 4.26191C17.6476 5.35785 18.3 6.66602 18.6129 8.07219C18.9258 9.47835 18.8896 10.9397 18.5076 12.3287C18.1257 13.7177 17.4095 14.992 16.4216 16.0404C15.495 14.6071 14.114 13.5264 12.5 12.9716C13.3057 12.435 13.9174 11.6532 14.2445 10.7421C14.5716 9.83088 14.5969 8.83861 14.3166 7.91195C14.0362 6.9853 13.4652 6.17346 12.6878 5.59646C11.9105 5.01945 10.9681 4.70792 10 4.70792C9.03193 4.70792 8.08954 5.01945 7.31218 5.59646C6.53483 6.17346 5.96377 6.9853 5.68343 7.91195C5.40309 8.83861 5.42836 9.83088 5.7555 10.7421C6.08264 11.6532 6.69429 12.435 7.5 12.9716C5.88597 13.5264 4.50496 14.6071 3.57843 16.0404C2.03426 14.409 1.17458 12.2473 1.17647 10.0009ZM6.66667 9.21653C6.66667 8.55722 6.86217 7.91271 7.22844 7.36452C7.59471 6.81632 8.1153 6.38906 8.72439 6.13675C9.33348 5.88444 10.0037 5.81843 10.6503 5.94705C11.2969 6.07568 11.8909 6.39317 12.357 6.85937C12.8232 7.32557 13.1407 7.91955 13.2693 8.56619C13.3979 9.21283 13.3319 9.88309 13.0796 10.4922C12.8273 11.1013 12.4001 11.622 11.8519 11.9883C11.3037 12.3545 10.6593 12.5501 10 12.5501C9.11674 12.5475 8.2704 12.1954 7.64584 11.5708C7.02128 10.9462 6.66926 10.0998 6.66667 9.21653ZM4.45098 16.864C5.02766 15.908 5.84156 15.1171 6.81377 14.5681C7.78598 14.0191 8.88352 13.7307 10 13.7307C11.1165 13.7307 12.214 14.0191 13.1862 14.5681C14.1584 15.1171 14.9723 15.908 15.549 16.864C13.9778 18.1327 12.0194 18.8246 10 18.8246C7.98061 18.8246 6.02219 18.1327 4.45098 16.864Z" fill="#0F172A"/>
+</svg>

src/assets/icon-head-blue.svg

@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M32 16.0014C32.0001 13.3395 31.3361 10.7196 30.0682 8.37909C28.8003 6.03856 26.9685 4.05135 24.7389 2.59747C22.5092 1.14358 19.9521 0.268961 17.2991 0.0528324C14.6461 -0.163296 11.9811 0.285897 9.54556 1.35972C7.10998 2.43355 4.98077 4.09807 3.3508 6.20252C1.72083 8.30696 0.641601 10.7848 0.210876 13.4117C-0.219849 16.0385 0.0115412 18.7313 0.884085 21.2461C1.75663 23.761 3.24275 26.0184 5.20784 27.8139L5.39608 27.9707C8.31851 30.5664 12.0914 32 16 32C19.9086 32 23.6815 30.5664 26.6039 27.9707L26.7922 27.8139C28.4345 26.3158 29.7461 24.4914 30.6428 22.4574C31.5396 20.4233 32.0019 18.2244 32 16.0014ZM1.88236 16.0014C1.8792 13.6965 2.44036 11.4259 3.51683 9.38788C4.5933 7.34985 6.15233 5.60636 8.05779 4.3097C9.96324 3.01303 12.1572 2.20262 14.4479 1.94922C16.7387 1.69583 19.0567 2.00717 21.1995 2.85605C23.3422 3.70493 25.2446 5.06554 26.7404 6.81905C28.2362 8.57255 29.28 10.6656 29.7806 12.9155C30.2812 15.1654 30.2234 17.5036 29.6122 19.7259C29.0011 21.9483 27.8551 23.9873 26.2745 25.6647C24.7921 23.3713 22.5825 21.6422 20 20.7546C21.2891 19.8959 22.2678 18.6452 22.7912 17.1873C23.3146 15.7294 23.3551 14.1418 22.9065 12.6591C22.458 11.1765 21.5443 9.87753 20.3005 8.95433C19.0567 8.03112 17.5489 7.53267 16 7.53267C14.4511 7.53267 12.9433 8.03112 11.6995 8.95433C10.4557 9.87753 9.54202 11.1765 9.09348 12.6591C8.64494 14.1418 8.68537 15.7294 9.2088 17.1873C9.73222 18.6452 10.7109 19.8959 12 20.7546C9.41754 21.6422 7.20793 23.3713 5.72549 25.6647C3.25482 23.0543 1.87932 19.5957 1.88236 16.0014ZM10.6667 14.7464C10.6667 13.6915 10.9795 12.6603 11.5655 11.7832C12.1515 10.9061 12.9845 10.2225 13.959 9.8188C14.9336 9.41511 16.0059 9.30948 17.0405 9.51528C18.075 9.72108 19.0254 10.2291 19.7712 10.975C20.5171 11.7209 21.0251 12.6713 21.2309 13.7059C21.4366 14.7405 21.331 15.8129 20.9274 16.7875C20.5237 17.7621 19.8401 18.5951 18.963 19.1812C18.086 19.7673 17.0548 20.0801 16 20.0801C14.5868 20.0759 13.2326 19.5127 12.2333 18.5133C11.234 17.514 10.6708 16.1597 10.6667 14.7464ZM7.12157 26.9824C8.04426 25.4527 9.34649 24.1873 10.902 23.309C12.4576 22.4306 14.2136 21.9691 16 21.9691C17.7864 21.9691 19.5424 22.4306 21.098 23.309C22.6535 24.1873 23.9557 25.4527 24.8784 26.9824C22.3645 29.0122 19.231 30.1194 16 30.1194C12.769 30.1194 9.6355 29.0122 7.12157 26.9824Z" fill="#0099FF"/>
+</svg>

src/assets/icon-large-exclamation.svg

@@ -0,0 +1,3 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M39.1386 8.155C38.4927 6.91052 37.4801 5.8602 36.2172 5.12506C34.9544 4.38992 33.4928 3.99988 32.0009 3.99988C30.509 3.99988 29.0474 4.38992 27.7846 5.12506C26.5217 5.8602 25.5091 6.91052 24.8632 8.155L2.08337 49.619C-0.642023 54.5693 2.8019 61.1427 9.21822 61.1427H54.7808C61.1999 61.1427 64.6382 54.5719 61.9184 49.619L39.1386 8.155ZM32.0009 22.185C32.7453 22.185 33.4592 22.4586 33.9856 22.9457C34.512 23.4327 34.8077 24.0933 34.8077 24.7822V37.7681C34.8077 38.4569 34.512 39.1175 33.9856 39.6046C33.4592 40.0916 32.7453 40.3653 32.0009 40.3653C31.2565 40.3653 30.5426 40.0916 30.0162 39.6046C29.4898 39.1175 29.1941 38.4569 29.1941 37.7681V24.7822C29.1941 24.0933 29.4898 23.4327 30.0162 22.9457C30.5426 22.4586 31.2565 22.185 32.0009 22.185ZM32.0009 44.261C32.7453 44.261 33.4592 44.5347 33.9856 45.0217C34.512 45.5088 34.8077 46.1694 34.8077 46.8582V48.1568C34.8077 48.8456 34.512 49.5062 33.9856 49.9933C33.4592 50.4804 32.7453 50.754 32.0009 50.754C31.2565 50.754 30.5426 50.4804 30.0162 49.9933C29.4898 49.5062 29.1941 48.8456 29.1941 48.1568V46.8582C29.1941 46.1694 29.4898 45.5088 30.0162 45.0217C30.5426 44.5347 31.2565 44.261 32.0009 44.261Z" fill="#FF3366"/>
+</svg>

src/assets/icon-logout.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="18" viewBox="0 0 20 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M15 13L19 9M19 9L15 5M19 9H5M11 13V14C11 14.7956 10.6839 15.5587 10.1213 16.1213C9.55871 16.6839 8.79565 17 8 17H4C3.20435 17 2.44129 16.6839 1.87868 16.1213C1.31607 15.5587 1 14.7956 1 14V4C1 3.20435 1.31607 2.44129 1.87868 1.87868C2.44129 1.31607 3.20435 1 4 1H8C8.79565 1 9.55871 1.31607 10.1213 1.87868C10.6839 2.44129 11 3.20435 11 4V5" stroke="#0F172A" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/assets/icon-new.svg

@@ -0,0 +1,4 @@
+<svg width="35" height="16" viewBox="0 0 35 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M34.11 14.49L30.19 7.87L34.07 1.52C34.1621 1.36868 34.2124 1.1956 34.2157 1.01848C34.2189 0.841351 34.1751 0.666534 34.0886 0.511912C34.0022 0.35729 33.8762 0.228414 33.7236 0.138469C33.5709 0.0485231 33.3972 0.000737145 33.22 0H2C1.46957 0 0.960859 0.210714 0.585786 0.585787C0.210714 0.96086 0 1.46957 0 2L0 14C0 14.5304 0.210714 15.0391 0.585786 15.4142C0.960859 15.7893 1.46957 16 2 16H33.25C33.4265 16 33.5999 15.9532 33.7524 15.8645C33.905 15.7758 34.0314 15.6483 34.1188 15.4949C34.2061 15.3415 34.2513 15.1678 34.2498 14.9913C34.2482 14.8148 34.2 14.6418 34.11 14.49ZM10.51 11.18H9.39L6.13 6.84V11.19H5V5H6.13L9.4 9.35V5H10.52L10.51 11.18ZM16.84 6H13.31V7.49H16.51V8.49H13.31V10.1H16.84V11.1H12.18V5H16.83L16.84 6ZM25.13 11.16H24L22.45 6.57L20.9 11.18H19.78L17.78 5H19L20.32 9.43L21.84 5H23.06L24.52 9.43L25.85 5H27.08L25.13 11.16Z" fill="#FFCC44"/>
+<path d="M34.11 14.49L30.19 7.87L34.07 1.52C34.1621 1.36868 34.2124 1.1956 34.2157 1.01848C34.2189 0.841351 34.1751 0.666534 34.0886 0.511912C34.0022 0.35729 33.8762 0.228414 33.7236 0.138469C33.5709 0.0485231 33.3972 0.000737145 33.22 0H2C1.46957 0 0.960859 0.210714 0.585786 0.585787C0.210714 0.96086 0 1.46957 0 2L0 14C0 14.5304 0.210714 15.0391 0.585786 15.4142C0.960859 15.7893 1.46957 16 2 16H33.25C33.4265 16 33.5999 15.9532 33.7524 15.8645C33.905 15.7758 34.0314 15.6483 34.1188 15.4949C34.2061 15.3415 34.2513 15.1678 34.2498 14.9913C34.2482 14.8148 34.2 14.6418 34.11 14.49ZM10.51 11.18H9.39L6.13 6.84V11.19H5V5H6.13L9.4 9.35V5H10.52L10.51 11.18ZM16.84 6H13.31V7.49H16.51V8.49H13.31V10.1H16.84V11.1H12.18V5H16.83L16.84 6ZM25.13 11.16H24L22.45 6.57L20.9 11.18H19.78L17.78 5H19L20.32 9.43L21.84 5H23.06L24.52 9.43L25.85 5H27.08L25.13 11.16Z" fill="#FFAA44"/>
+</svg>

src/assets/icon-search.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.5 19C15.1944 19 19 15.1944 19 10.5C19 5.80558 15.1944 2 10.5 2C5.80558 2 2 5.80558 2 10.5C2 15.1944 5.80558 19 10.5 19Z" stroke="#4E5969" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M21 21L17 17" stroke="#4E5969" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/assets/icon-x.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.7081 18.2926C19.801 18.3855 19.8747 18.4958 19.9249 18.6172C19.9752 18.7386 20.0011 18.8687 20.0011 19.0001C20.0011 19.1315 19.9752 19.2616 19.9249 19.383C19.8747 19.5044 19.801 19.6147 19.7081 19.7076C19.6151 19.8005 19.5048 19.8742 19.3835 19.9245C19.2621 19.9747 19.132 20.0006 19.0006 20.0006C18.8692 20.0006 18.7391 19.9747 18.6177 19.9245C18.4963 19.8742 18.386 19.8005 18.2931 19.7076L10.0006 11.4138L1.70806 19.7076C1.52042 19.8952 1.26592 20.0006 1.00056 20.0006C0.735192 20.0006 0.480697 19.8952 0.293056 19.7076C0.105415 19.5199 5.23096e-09 19.2654 0 19.0001C-5.23096e-09 18.7347 0.105415 18.4802 0.293056 18.2926L8.58681 10.0001L0.293056 1.70757C0.105415 1.51993 -1.97712e-09 1.26543 0 1.00007C1.97712e-09 0.734704 0.105415 0.480208 0.293056 0.292568C0.480697 0.104927 0.735192 -0.000488279 1.00056 -0.000488281C1.26592 -0.000488283 1.52042 0.104927 1.70806 0.292568L10.0006 8.58632L18.2931 0.292568C18.4807 0.104927 18.7352 -0.000488286 19.0006 -0.000488281C19.2659 -0.000488276 19.5204 0.104927 19.7081 0.292568C19.8957 0.480208 20.0011 0.734704 20.0011 1.00007C20.0011 1.26543 19.8957 1.51993 19.7081 1.70757L11.4143 10.0001L19.7081 18.2926Z" fill="#64748B"/>
+</svg>

src/assets/layout.css

@@ -1,6 +1,16 @@
+/* The Lucia project.
+   Copyright 2023-2026 DSP, inc.  All rights reserved.
+   Authors:
+     chiayin.kuo@dsp.im (chiayin), 2023/4/18
+
+   Layout styles for navbar and heading elements. */
+
 /* Navbar */
 nav ul>li {
-  @apply px-2 py-3.5 duration-300 hover:bg-neutral-900 hover:text-neutral-10 active:bg-neutral-900 active:text-neutral-10;
+  @apply px-2 py-3.5 duration-300 hover:bg-neutral-900 hover:text-neutral-10 ;
+}
+nav ul>li.active {
+  @apply bg-neutral-900 text-neutral-10 duration-300;
 }
 
 /* Header */

src/assets/main.css

@@ -1,5 +1,14 @@
+/* The Lucia project.
+   Copyright 2023-2026 DSP, inc.  All rights reserved.
+   Authors:
+     chiayin.kuo@dsp.im (chiayin), 2023/1/31
+     cindy.chang@dsp.im (Cindy Chang), 2024/6/18
+
+   Main CSS entry point that imports all stylesheet modules. */
+
 @import './tailwind.css';
 @import './base.css';
 @import './components.css';
 @import './layout.css';
 @import './vendors.css';
+@import './zindex.css';

src/assets/radioOff.svg

@@ -0,0 +1,23 @@
+<svg width="40" height="24" viewBox="0 0 40 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_3442_4283)">
+<rect width="40" height="24" rx="12" fill="#C9CDD4"/>
+<g filter="url(#filter0_d_3442_4283)">
+<circle cx="12" cy="12" r="10" fill="white"/>
+</g>
+</g>
+<rect x="1" y="1" width="38" height="22" rx="11" stroke="#64748B" stroke-width="2"/>
+<defs>
+<filter id="filter0_d_3442_4283" x="0" y="2" width="24" height="24" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="2"/>
+<feGaussianBlur stdDeviation="1"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_3442_4283"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_3442_4283" result="shape"/>
+</filter>
+<clipPath id="clip0_3442_4283">
+<rect width="40" height="24" rx="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>