diff --git a/README.md b/README.md
index 4390707..261e612 100644
--- a/README.md
+++ b/README.md
@@ -4,5 +4,10 @@ This template is used in the [Building An Activity](https://discord.com/develope
 
 Read more about building Discord Activities with the Embedded App SDK at [https://discord.com/developers/docs/activities/overview](https://discord.com/developers/docs/activities/overview).
 
-# web-app
-# web-app
+# installation
+WIP
+
+run
+npm run dev in ./server and ./client
+cloudflared tunnel --url http://localhost:5173
+then fix the discord app and vite.config.js
diff --git a/Task.jsx b/Task.jsx
new file mode 100644
index 0000000..3fbcfea
--- /dev/null
+++ b/Task.jsx
@@ -0,0 +1,131 @@
+// Task.js (React Component)
+import React, { useState } from 'react';
+import TaskLabel from './client/components/TaskLabel';
+import Member from './client/components/Member';
+import '/styles/popup.css';
+import '/styles/task.css';
+
+const TaskPopup = ({
+  isVisible,
+  onClose,
+  onSave,
+  members,
+}) => {
+  const [taskName, setTaskName] = useState('');
+  const [taskDetails, setTaskDetails] = useState('');
+  const [startDate, setStartDate] = useState('');
+  const [dueDate, setDueDate] = useState('');
+  const [assignedMember, setAssignedMember] = useState(null);
+  const [selectedLabel, setSelectedLabel] = useState(null);
+
+  const handleSave = () => {
+    if (!taskName) {
+      alert('Task name is required.');
+      return;
+    }
+    const taskData = {
+      name: taskName,
+      details: taskDetails,
+      startDate,
+      dueDate,
+      assignedMember,
+      label: selectedLabel,
+    };
+    onSave(taskData);
+    handleClose();
+  };
+
+  const handleClose = () => {
+    setTaskName('');
+    setTaskDetails('');
+    setStartDate('');
+    setDueDate('');
+    setAssignedMember(null);
+    setSelectedLabel(null);
+    onClose();
+  };
+
+  if (!isVisible) return null;
+
+  return (
+    <div className="task-popup-overlay" onClick={handleClose}>
+      <div className="task-popup" onClick={(e) => e.stopPropagation()}>
+        <div className="popup-header">
+          <h3>Create Task</h3>
+          <button className="close-button" onClick={handleClose}>
+            ✖
+          </button>
+        </div>
+
+        <div className="popup-body">
+          <div className="form-group">
+            <label>Task Name</label>
+            <input
+              type="text"
+              value={taskName}
+              onChange={(e) => setTaskName(e.target.value)}
+              placeholder="Enter task name"
+            />
+          </div>
+
+          <div className="form-group">
+            <label>Task Details</label>
+            <textarea
+              value={taskDetails}
+              onChange={(e) => setTaskDetails(e.target.value)}
+              placeholder="Enter task details"
+            />
+          </div>
+
+          <div className="form-group date-inputs">
+            <div>
+              <label>Start Date</label>
+              <input
+                type="date"
+                value={startDate}
+                onChange={(e) => setStartDate(e.target.value)}
+              />
+            </div>
+
+            <div>
+              <label>Due Date</label>
+              <input
+                type="date"
+                value={dueDate}
+                onChange={(e) => setDueDate(e.target.value)}
+              />
+            </div>
+          </div>
+
+          <div className="form-group">
+            <label>Assigned Member</label>
+            <Member
+              members={members}
+              selectedMember={assignedMember}
+              onSelectMember={setAssignedMember}
+            />
+          </div>
+
+          <div className="form-group">
+            <label>Task Label</label>
+            <TaskLabel
+              selectedLabel={selectedLabel}
+              onSelectLabel={setSelectedLabel}
+            />
+          </div>
+        </div>
+
+        <div className="popup-footer">
+          <button className="cancel-button" onClick={handleClose}>
+            Cancel
+          </button>
+          <button className="save-button" onClick={handleSave}>
+            Save
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default TaskPopup;
diff --git a/client/App.jsx b/client/App.jsx
new file mode 100644
index 0000000..465ccc8
--- /dev/null
+++ b/client/App.jsx
@@ -0,0 +1,18 @@
+import React from 'react';
+import { MemoryRouter, Route, Routes } from 'react-router-dom';
+import AppProject from './components/pages/Project';
+import './styles/sidebar.css';
+import './index.css';
+// Example components for different routes
+
+const App = () => (
+  <MemoryRouter>
+    <div>
+      <Routes>
+        <Route path="/" element={<AppProject />} />
+      </Routes>
+    </div>
+  </MemoryRouter>
+);
+
+export default App;
\ No newline at end of file
diff --git a/client/ErrorBoundary.jsx b/client/ErrorBoundary.jsx
new file mode 100644
index 0000000..49cf56a
--- /dev/null
+++ b/client/ErrorBoundary.jsx
@@ -0,0 +1,35 @@
+// ErrorBoundary.js
+import React, { Component } from 'react';
+
+class ErrorBoundary extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false, errorMessage: '' };
+  }
+
+  static getDerivedStateFromError(error) {
+    // Update state to display fallback UI
+    return { hasError: true, errorMessage: error.message };
+  }
+
+  componentDidCatch(error, info) {
+    // Log error information to an external service (e.g., Sentry, LogRocket)
+    console.error('Error caught by Error Boundary:', error, info);
+  }
+
+  render() {
+    if (this.state.hasError) {
+      // Display custom error message or fallback UI
+      return (
+        <div>
+          <h1>Something went wrong.</h1>
+          <p>{this.state.errorMessage}</p>
+        </div>
+      );
+    }
+
+    return this.props.children;
+  }
+}
+
+export default ErrorBoundary;
diff --git a/client/components/BoardProject.jsx b/client/components/BoardProject.jsx
new file mode 100644
index 0000000..e64b3e6
--- /dev/null
+++ b/client/components/BoardProject.jsx
@@ -0,0 +1,131 @@
+import React, { useState, useRef, useEffect } from 'react';
+import '/styles/project.css';
+import '/styles/sidebar.css';
+import '/styles/board.css';
+import BoardSection from './BoardSection';
+import ProjectSection from './ProjectSection';
+
+const BoardProject = () => {
+  const [isBoardVisible, setIsBoardVisible] = useState(true);
+  
+  // Store boards and active board
+  const [boards, setBoards] = useState([]);
+  const [activeBoard, setActiveBoard] = useState(null);
+
+  const [projects, setProjects] = useState([]);   
+  const [activeProject, setActiveProject] = useState(null);
+
+  const [settingsVisible, setSettingsVisible] = useState(false);
+  const settingsRef = useRef(null);
+
+  // Close settings popup when clicking outside
+  useEffect(() => {
+    function handleClickOutside(event) {
+      if (settingsRef.current && !settingsRef.current.contains(event.target)) {
+        setSettingsVisible(false);
+      }
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, []);
+
+  const toggleSection = () => {
+    // Prevent toggling section if settings popup is open
+    if (!settingsVisible) {
+      setIsBoardVisible((prev) => !prev);
+    }
+  };
+
+  const deleteProject = () => {
+    if (!activeProject) return; // No project selected
+
+    const updatedProjects = projects.filter((project) => project.id !== activeProject.id);
+    setProjects(updatedProjects); // Update the project list
+
+    // Remove boards associated with this project
+    const updatedBoards = { ...boards };
+    delete updatedBoards[activeProject.id];
+    setBoards(updatedBoards);
+
+    // Reset active project and active board
+    setActiveProject(null);
+    setActiveBoard(null);
+    setSettingsVisible(false); // Close the settings popup
+  };
+
+  return (
+    <div id="main-container">
+      {/* Project Box */}
+      <div id="project-container" className="clickable" onClick={toggleSection}>
+      <div id={`project-box-${activeProject ? activeProject.id : 'none'}`} className="projectbox">
+          {/* Triangle Symbol */}
+          <div className={`triangle-symbol ${isBoardVisible ? 'triangle-right' : 'triangle-down'}`}></div>
+          
+          {/* Project Text Content */} 
+          <div id="project-box-content">
+            <div id="project-box-name">{activeProject ? activeProject.name : 'project name'}</div>
+            <div id="project-box-description">{activeProject ? activeProject.description : 'project description'}</div>
+          </div>
+
+          {/* Project Settings Icon (Click to Toggle Popup) */}
+          <img
+            src="/assets/setting.svg"
+            alt="Settings"
+            className="project-settings-icon"
+            onClick={(e) => {
+              e.stopPropagation(); // Prevents toggleSection from being triggered
+              setSettingsVisible(!settingsVisible);
+            }}
+          />
+
+          {/* Settings Popup */}
+          {settingsVisible && (
+            <div 
+              className="project-settings-popup" 
+              ref={settingsRef} 
+              onClick={(e) => e.stopPropagation()} // Prevents toggling the board/project
+            >
+              <div className="project-settings-option" onClick={() => alert("Share Project Clicked")}>
+                Share Project
+              </div>
+              <div className="project-settings-option" onClick={() => alert("Edit Project Clicked")}>
+                Edit Project
+              </div>
+              <div className="project-settings-option delete" onClick={deleteProject}>
+                Delete Project
+              </div>
+            </div>
+          )}
+        </div>
+      </div>
+
+      {/* Conditionally Render Board or Project Section */}
+      {isBoardVisible ? (
+        activeProject ? ( // ✅ Only pass projectId if activeProject exists
+          <BoardSection 
+            projectId={activeProject.id}
+            boards={boards[activeProject.id] || []} 
+            setBoards={setBoards} 
+            activeBoard={activeBoard} 
+            setActiveBoard={setActiveBoard} 
+          />
+        ) : (
+          <div className='please-create-project' id='please-create-project'>
+            Please Create Project
+          </div>
+        )
+      ) : (
+        <ProjectSection 
+          projects={projects} 
+          setProjects={setProjects} 
+          activeProject={activeProject} 
+          setActiveProject={setActiveProject} 
+        />
+      )}
+    </div>
+  );
+};
+
+export default BoardProject;  
\ No newline at end of file
diff --git a/client/components/BoardSection.jsx b/client/components/BoardSection.jsx
new file mode 100644
index 0000000..f719810
--- /dev/null
+++ b/client/components/BoardSection.jsx
@@ -0,0 +1,143 @@
+import React, { useState } from 'react';
+import { v4 as uuidv4 } from 'uuid';
+import '/styles/board.css'; 
+import ConfirmationPopup from './ConfirmationPopup'; 
+
+export function BoardSection({ projectId, boards, setBoards, activeBoard, setActiveBoard }) {
+  const [popupVisible, setPopupVisible] = useState(false);
+  const [confirmationVisible, setConfirmationVisible] = useState(false);
+  const [newBoard, setNewBoard] = useState({ name: '', description: '' });
+
+  // Function to reset and hide the popup overlay
+  const resetPopupOverlay = () => {
+    setPopupVisible(false);
+    setNewBoard({ name: '', description: '' }); // Reset the input fields
+  };
+
+  const createBoard = (event) => {
+    event.preventDefault();
+    if (newBoard.name.trim()) {
+      const newBoardData = {
+        id: uuidv4(),
+        name: newBoard.name,
+        description: newBoard.description,
+      };
+
+      setBoards((prevBoards) => ({
+        ...prevBoards,
+        [projectId]: [...(prevBoards[projectId] || []), newBoardData],
+      }));
+      resetPopupOverlay();
+    } else {
+      alert('Please enter a board name.');
+    }
+  };
+
+  // Function to handle board selection
+  const handleSelectBoard = (board) => {
+    setActiveBoard(board);
+  };
+
+  // Function to show the confirmation popup
+  const handleShowConfirmation = () => {
+    setConfirmationVisible(true);
+  };
+
+  return (
+    <div className="board-section" id={`board-section-${projectId}`}>
+      <span className="board-text" id="board-text">Boards</span>
+
+      <div id="create-board-container">
+        <button id="create-board-button" onClick={() => setPopupVisible(true)}>
+          + Create New Board
+        </button>
+      </div>
+
+      <div id="board-list-container" className='board-list-container'>
+        {boards.map((board) => (
+          <button
+            key={board.id}
+            className={`board-button ${activeBoard && activeBoard.id === board.id ? 'active' : ''}`}
+            onClick={() => handleSelectBoard(board)}
+          >
+            {board.name}
+          </button>
+        ))}
+      </div>
+
+      {/* Board Popup */}
+      {popupVisible && (
+        <div className="popup-overlay" id="popup-overlay" onClick={handleShowConfirmation}>
+          <div className="popup-content" id="popup-content" onClick={(e) => e.stopPropagation()}>
+            <div className="header-title" id="header-title">Create New Board</div>
+            <button
+              className="close-popup-button"
+              id="close-popup-button"
+              onClick={handleShowConfirmation}
+            >
+              ✖
+            </button>
+
+            {/* Scrollable body */}
+            <div className="popup-body">
+              <div className="input-wrapper">
+                <label htmlFor="board-name" className="popup-label">Board Name</label>
+                <input
+                  className="popup-input"
+                  id="board-name"
+                  type="text"
+                  placeholder="Enter Board Name"
+                  value={newBoard.name}
+                  onChange={(e) => setNewBoard({ ...newBoard, name: e.target.value })}
+                />
+              </div>
+
+              <div className="input-wrapper">
+                <label htmlFor="board-description" className="popup-label">Board Description</label>
+                <textarea
+                  className="popup-textarea"
+                  id="board-description"
+                  placeholder="Enter Board Description (Optional)"
+                  value={newBoard.description}
+                  onChange={(e) => setNewBoard({ ...newBoard, description: e.target.value })}
+                />
+              </div>
+            </div>
+
+            <div className="popup-buttons" id="popup-buttons">
+              <button
+                className="cancel-button"
+                id="cancel-button"
+                onClick={handleShowConfirmation}
+              >
+                Cancel
+              </button>
+              <button
+                className="create-board-button-form"
+                id="create-board-button-form"
+                onClick={createBoard}
+              >
+                Create Board
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {/* Confirmation Popup */}
+      {confirmationVisible && (
+        <ConfirmationPopup
+          isVisible={confirmationVisible}
+          onConfirm={() => {
+            setConfirmationVisible(false); // Close the confirmation popup
+            resetPopupOverlay(); // Close the board popup and reset inputs
+          }}
+          onCancel={() => setConfirmationVisible(false)} // Just close the confirmation popup
+        />
+      )}
+    </div>
+  );
+}
+
+export default BoardSection;  
+  
\ No newline at end of file
diff --git a/client/components/Calendar.jsx b/client/components/Calendar.jsx
new file mode 100644
index 0000000..0c9e454
--- /dev/null
+++ b/client/components/Calendar.jsx
@@ -0,0 +1,114 @@
+// Calendar.js (React Component)
+import React, { useState } from 'react';
+import '/styles/calendar.css';
+
+
+const Calendar = () => {
+  const [displayedMonth, setDisplayedMonth] = useState(new Date().getMonth());
+  const [displayedYear, setDisplayedYear] = useState(new Date().getFullYear());
+  const [startDate, setStartDate] = useState(null);
+  const [dueDate, setDueDate] = useState(null);
+  const [selectedButton, setSelectedButton] = useState(null);
+
+  const monthNames = [
+    'January', 'February', 'March', 'April', 'May', 'June',
+    'July', 'August', 'September', 'October', 'November', 'December'
+  ];
+
+  const renderCalendarDays = () => {
+    const firstDay = new Date(displayedYear, displayedMonth, 1).getDay();
+    const daysInMonth = new Date(displayedYear, displayedMonth + 1, 0).getDate();
+    const days = [];
+
+    for (let i = 0; i < firstDay; i++) {
+      days.push(<div key={`empty-${i}`} className="day empty" />);
+    }
+
+    for (let day = 1; day <= daysInMonth; day++) {
+      const currentDate = new Date(displayedYear, displayedMonth, day);
+      const isSelected =
+        (startDate && currentDate.getTime() === startDate.getTime()) ||
+        (dueDate && currentDate.getTime() === dueDate.getTime());
+
+      days.push(
+        <div
+          key={day}
+          className={`day ${isSelected ? 'selected' : ''}`}
+          onClick={() => handleDateClick(currentDate)}
+        >
+          {day}
+        </div>
+      );
+    }
+
+    return days;
+  };
+
+  const handleDateClick = (date) => {
+    if (selectedButton === 'start') {
+      if (dueDate && date > dueDate) {
+        alert('Start date cannot be after the due date.');
+        return;
+      }
+      setStartDate(date);
+    } else if (selectedButton === 'due') {
+      if (startDate && date < startDate) {
+        alert('Due date cannot be before the start date.');
+        return;
+      }
+      setDueDate(date);
+    }
+  };
+
+  const handleMonthChange = (direction) => {
+    if (direction === 'prev') {
+      if (displayedMonth === 0) {
+        setDisplayedMonth(11);
+        setDisplayedYear(displayedYear - 1);
+      } else {
+        setDisplayedMonth(displayedMonth - 1);
+      }
+    } else {
+      if (displayedMonth === 11) {
+        setDisplayedMonth(0);
+        setDisplayedYear(displayedYear + 1);
+      } else {
+        setDisplayedMonth(displayedMonth + 1);
+      }
+    }
+  };
+
+  return (
+    <div className="calendar-container">
+      <div className="calendar-header">
+        <button onClick={() => handleMonthChange('prev')}>←</button>
+        <span>{`${monthNames[displayedMonth]} ${displayedYear}`}</span>
+        <button onClick={() => handleMonthChange('next')}>→</button>
+      </div>
+      <div className="calendar-grid">
+        {['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'].map((day) => (
+          <div key={day} className="weekday">
+            {day}
+          </div>
+        ))}
+      </div>
+      <div className="calendar-days">{renderCalendarDays()}</div>
+      <div className="date-controls">
+        <button
+          className="date-button"
+          onClick={() => setSelectedButton('start')}
+        >
+          Start Date: {startDate ? startDate.toLocaleDateString() : 'Not Set'}
+        </button>
+        <button
+          className="date-button"
+          onClick={() => setSelectedButton('due')}
+        >
+          Due Date: {dueDate ? dueDate.toLocaleDateString() : 'Not Set'}
+        </button>
+      </div>
+    </div>
+  );
+};
+
+export default Calendar;
diff --git a/client/components/ConfirmationPopup.jsx b/client/components/ConfirmationPopup.jsx
new file mode 100644
index 0000000..f1a9dfc
--- /dev/null
+++ b/client/components/ConfirmationPopup.jsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import '/styles/confirmation.css'; // Ensure this path is correct for your CSS
+
+const ConfirmationPopup = ({
+  onConfirm,
+  onCancel,
+  isVisible,
+}) => {
+  if (!isVisible) return null;
+
+  return (
+    <div id="confirmation-popup" className="confirmation-popup-overlay">
+      <div id="confirmation-content" className="confirmation-popup">
+        <h3>Discard changes?</h3>
+        <p>If you go back now, you will lose any changes you’ve made.</p>
+        <div className="confirmation-buttons">
+          <button id="cancel-discard-button" className="cancel-button" onClick={onCancel} aria-label="Cancel action">
+            Cancel
+          </button>
+          <button id="discard-button" className="confirm-button" onClick={onConfirm} aria-label="Confirm action">
+            Discard
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default ConfirmationPopup;
diff --git a/client/components/Interface.jsx b/client/components/Interface.jsx
new file mode 100644
index 0000000..dbbdfcd
--- /dev/null
+++ b/client/components/Interface.jsx
@@ -0,0 +1,50 @@
+import React, { useState, useEffect } from 'react';
+import BoardSection from './BoardSection';
+import Calendar from './Calendar';
+import Task from '../../Task';
+import SettingsPopup from './Settings';
+import ProjectSection from './ProjectSection';
+import ConfirmationPopup from './ConfirmationPopup';
+import TaskLabel from './TaskLabel';
+import List from './List';
+import Member from './Member';
+import Sidebar from './Sidebar'; // Assuming Sidebar.jsx exists
+
+const Interface = ({ user }) => {
+  const [showCalendar, setShowCalendar] = useState(false);
+  const [showTaskPopup, setShowTaskPopup] = useState(false);
+  const [showSettingsPopup, setShowSettingsPopup] = useState(false);
+  const [showProjectSection, setShowProjectSection] = useState(false);
+  const [showConfirmationPopup, setShowConfirmationPopup] = useState(false);
+  const [showLabelPopup, setShowLabelPopup] = useState(false);
+
+  useEffect(() => {
+    // Example of initializing data or any additional setup
+    console.log('Interface initialized with user:', user);
+  }, [user]);
+
+  return (
+    <div id="app" className="interface">
+      {/* Sidebar */}
+      <Sidebar user={user} />
+
+      {/* Main Content */}
+      <main className="main-content">
+
+        {/* Conditional Rendering for Popup Components */}
+        {showCalendar && <Calendar />}
+        {showTaskPopup && <Task />}
+        {showSettingsPopup && <SettingsPopup />}
+        {showProjectSection && <ProjectSection />}
+        {showConfirmationPopup && <ConfirmationPopup />}
+        {showLabelPopup && <TaskLabel />}
+
+        {/* Task List and Member Components */}
+        <List />
+        <Member members={[{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }]} />
+      </main>
+    </div>
+  );
+};
+
+export default Interface;
diff --git a/client/components/List.jsx b/client/components/List.jsx
new file mode 100644
index 0000000..00fa56b
--- /dev/null
+++ b/client/components/List.jsx
@@ -0,0 +1,102 @@
+// List.js (React Component)
+import React, { useState } from 'react';
+import '/styles/list.css';
+
+
+const List = () => {
+  const [lists, setLists] = useState([]);
+  const [newListName, setNewListName] = useState('');
+  const [isAddingList, setIsAddingList] = useState(false);
+
+  const handleAddList = () => {
+    if (newListName.trim() === '') {
+      alert('List name cannot be empty.');
+      return;
+    }
+
+    const newList = {
+      id: Date.now(),
+      name: newListName,
+      tasks: [],
+    };
+
+    setLists([...lists, newList]);
+    setNewListName('');
+    setIsAddingList(false);
+  };
+
+  const handleDeleteList = (id) => {
+    setLists(lists.filter((list) => list.id !== id));
+  };
+
+  const handleAddTask = (listId, taskName) => {
+    if (taskName.trim() === '') {
+      alert('Task name cannot be empty.');
+      return;
+    }
+
+    setLists(
+      lists.map((list) =>
+        list.id === listId
+          ? {
+              ...list,
+              tasks: [...list.tasks, { id: Date.now(), name: taskName }],
+            }
+          : list
+      )
+    );
+  };
+
+  return (
+    <div className="list-container">
+      {lists.map((list) => (
+        <div className="list" key={list.id}>
+          <div className="list-header">
+            <h3>{list.name}</h3>
+            <button onClick={() => handleDeleteList(list.id)}>Delete List</button>
+          </div>
+
+          <div className="tasks">
+            {list.tasks.map((task) => (
+              <div key={task.id} className="task">
+                {task.name}
+              </div>
+            ))}
+          </div>
+
+          <div className="add-task">
+            <input
+              type="text"
+              placeholder="New Task Name"
+              onKeyDown={(e) => {
+                if (e.key === 'Enter') {
+                  handleAddTask(list.id, e.target.value);
+                  e.target.value = '';
+                }
+              }}
+            />
+          </div>
+        </div>
+      ))}
+
+      {isAddingList ? (
+        <div className="add-list-form">
+          <input
+            type="text"
+            value={newListName}
+            onChange={(e) => setNewListName(e.target.value)}
+            placeholder="Enter list name"
+          />
+          <button onClick={handleAddList}>Add List</button>
+          <button onClick={() => setIsAddingList(false)}>Cancel</button>
+        </div>
+      ) : (
+        <button className="add-list-button" onClick={() => setIsAddingList(true)}>
+          + Add List
+        </button>
+      )}
+    </div>
+  );
+};
+
+export default List;
diff --git a/client/components/Member.jsx b/client/components/Member.jsx
new file mode 100644
index 0000000..86c4cee
--- /dev/null
+++ b/client/components/Member.jsx
@@ -0,0 +1,40 @@
+// Member.js (React Component)
+import React from 'react';
+import '/styles/member.css';
+
+const Member = ({ members, onMemberSelect, isVisible, onClose }) => {
+  if (!isVisible) return null;
+
+  const handleMemberClick = (member) => {
+    onMemberSelect(member);
+    onClose();
+  };
+
+  return (
+    <div className="member-popup-overlay">
+      <div className="member-popup">
+        <div className="member-options">
+          {members.map((member) => (
+            <div
+              key={member.id}
+              className="member-option"
+              onClick={() => handleMemberClick(member)}
+            >
+              <img
+                src={member.profilePicture || `https://ui-avatars.com/api/?name=${encodeURIComponent(member.name)}&background=random&color=fff`}
+                alt={member.name}
+                className="member-profile-picture"
+              />
+              <span className="member-username">{member.name}</span>
+            </div>
+          ))}
+        </div>
+        <button className="done-button" onClick={onClose} aria-label="Close member selection">
+          Done
+        </button>
+      </div>
+    </div>
+  );
+};
+
+export default Member;
diff --git a/client/components/ProjectSection.jsx b/client/components/ProjectSection.jsx
new file mode 100644
index 0000000..5890e8b
--- /dev/null
+++ b/client/components/ProjectSection.jsx
@@ -0,0 +1,149 @@
+    import React, { useState } from 'react';
+    import { v4 as uuidv4 } from 'uuid';
+    import '/styles/popup.css';
+    import '/styles/project.css';
+    import ConfirmationPopup from './ConfirmationPopup';
+
+    export function ProjectSection({ projects, setProjects, activeProject, setActiveProject, setSelectedProject }) {
+      const [popupVisible, setPopupVisible] = useState(false);
+      const [confirmationVisible, setConfirmationVisible] = useState(false);
+      const [newProject, setNewProject] = useState({ name: '', description: '' });
+
+      const resetPopupOverlay = () => {
+        setPopupVisible(false);
+        setNewProject({ name: '', description: '' });
+      };
+
+      const createProject = (event) => {
+        event.preventDefault();
+        const projectName = newProject.name.trim();
+        const projectDescription = newProject.description.trim();
+
+        if (projectName) {
+          const newProjectData = {
+            id: uuidv4(),
+            name: projectName,
+            description: projectDescription,
+          };
+          setProjects((prevProjects) => [...prevProjects, newProjectData]);
+          resetPopupOverlay();
+        } else {
+          alert('Please enter a project name.');
+        }
+      };
+
+      const handleProjectClick = (project) => {
+        console.log('project id :',project.id)
+        setActiveProject(project);
+        setSelectedProject(project); // Update selected project
+      };
+
+      return (
+        <div className="project-section" id="project-section">
+          <div id="create-project-container">
+            <button id="create-project-button" className="create-project-button" onClick={() => setPopupVisible(true)}>
+              + Create New Project
+            </button>
+            <div className="dynamic-line" id="dynamic-line"></div>
+          </div>
+
+          <div id="project-list-container">
+            {projects.map((project) => (
+              <button
+                key={project.id}
+                id={`project-button-${project.id}`}
+                className={`project-button ${activeProject && activeProject.id === project.id ? 'active' : ''}`}
+                onClick={() => handleProjectClick(project)}
+              >
+                {/* Checkmark/Icon */}
+                <span className="checkmark">
+                  {activeProject && activeProject.id === project.id && '✔'}
+                </span>
+                {project.name}
+              </button>
+            ))}
+            <div className="dynamic-line1" id="dynamic-line1"></div>
+          </div>
+
+          {/* Project Popup */}
+          {popupVisible && (
+            <div
+              className="project-popup-overlay"
+              id="project-popup-overlay"
+              onClick={() => setConfirmationVisible(true)}
+            >
+              <div
+                className="project-popup"
+                id="project-popup"
+                onClick={(e) => e.stopPropagation()}
+              >
+                <div className="header-title" id="header-title">Create New Project</div>
+                <button
+                  className="close-popup-button"
+                  onClick={() => setConfirmationVisible(true)}
+                  aria-label="Close project creation popup"
+                >
+                  ✖
+                </button>
+
+                <div className="input-wrapper">
+                  <label htmlFor="project-name" className="popup-label">Project Name</label>
+                  <input
+                    className="popup-input"
+                    id="project-name"
+                    type="text"
+                    placeholder="Enter project name"
+                    value={newProject.name}
+                    onChange={(e) => setNewProject({ ...newProject, name: e.target.value })}
+                    required
+                  />
+                </div>
+
+                <div className="input-wrapper">
+                  <label htmlFor="project-description" className="popup-label">Project Description (Optional)</label>
+                  <textarea
+                    className="popup-textarea"
+                    id="project-description"
+                    placeholder="Enter project description"
+                    value={newProject.description}
+                    onChange={(e) => setNewProject({ ...newProject, description: e.target.value })}
+                  />
+                  <div className="popup-buttons">
+                    <button
+                      type="button"
+                      className="cancel-button"
+                      id="cancel-button"
+                      onClick={() => setConfirmationVisible(true)}
+                      aria-label="Cancel project creation"
+                    >
+                      Cancel
+                    </button>
+                    <button
+                      type="submit"
+                      className="create-project-button-form"
+                      id="create-project-button-form"
+                      onClick={createProject}
+                    >
+                      Create Project
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          )}
+          {/* Confirmation Popup (Fix) */}
+          {confirmationVisible && (
+            <ConfirmationPopup
+              isVisible={confirmationVisible}
+              onConfirm={() => {
+                setConfirmationVisible(false);
+                resetPopupOverlay();
+              }}
+              onCancel={() => setConfirmationVisible(false)}
+            />
+          )}
+        </div>
+      );
+    }
+
+    export default ProjectSection;
diff --git a/client/components/Settings.jsx b/client/components/Settings.jsx
new file mode 100644
index 0000000..4154158
--- /dev/null
+++ b/client/components/Settings.jsx
@@ -0,0 +1,35 @@
+// Settings.js (React Component)
+import React, { useState } from 'react';
+import '/styles/popup.css';
+import '/styles/settings.css';
+
+const SettingsPopup = ({ isVisible, onClose, onEditBoard, onDeleteBoard }) => {
+  const handleEditBoard = () => {
+    onEditBoard();
+    onClose();
+  };
+
+  const handleDeleteBoard = () => {
+    if (window.confirm("Are you sure you want to delete this board? This action cannot be undone.")) {
+      onDeleteBoard();
+      onClose();
+    }
+  };
+
+  if (!isVisible) return null;
+
+  return (
+    <div className="settings-popup-overlay" onClick={onClose}>
+      <div className="settings-popup" onClick={(e) => e.stoppagation()}>
+        <p className="settings-option" onClick={handleEditBoard}>
+          Edit Board
+        </p>
+        <p className="settings-option delete" onClick={handleDeleteBoard}>
+          Delete Board
+        </p>
+      </div>
+    </div>
+  );
+};
+
+export default SettingsPopup;
diff --git a/client/components/Sidebar.jsx b/client/components/Sidebar.jsx
new file mode 100644
index 0000000..df49078
--- /dev/null
+++ b/client/components/Sidebar.jsx
@@ -0,0 +1,29 @@
+import React, { useState } from 'react';
+import { Link } from 'react-router-dom'; // Optional if using React Router for navigation
+import '/styles/sidebar.css';
+
+const Sidebar = ({ user }) => {
+  
+  return (
+    <div id="sidebar">
+
+      {/* Sidebar Content */}
+      <div className="sidebar-content">
+        {/* User Profile */}
+        <div id="userbox">
+          <img
+            src={user.avatarUrl}
+            alt="Profile Picture"
+            id="profile-pic"
+          />
+          <span id="username">{user.username}</span>
+        </div>
+        <div className='logo' id='logo'>
+          <img alt='Planify'></img>
+        </div>  
+      </div>
+    </div>
+  );
+};
+
+export default Sidebar;
diff --git a/client/components/TaskLabel.jsx b/client/components/TaskLabel.jsx
new file mode 100644
index 0000000..ca72d81
--- /dev/null
+++ b/client/components/TaskLabel.jsx
@@ -0,0 +1,56 @@
+// TaskLabel.js (React Component)
+import React, { useState } from 'react';
+import '/styles/label.css';
+
+
+const TaskLabel = ({ onLabelSelect, isVisible, onClose }) => {
+  const labels = [
+    { color: '#A259FF', name: 'Purple' },
+    { color: '#FFD93D', name: 'Yellow' },
+    { color: '#53D1F0', name: 'Blue' },
+    { color: '#FF773D', name: 'Orange' },
+    { color: '#3D8BFF', name: 'Light Blue' },
+    { color: '#FF3D71', name: 'Red' },
+    { color: '#3DFF77', name: 'Green' },
+  ];
+
+  const [selectedLabel, setSelectedLabel] = useState(null);
+
+  if (!isVisible) return null;
+
+  const handleLabelClick = (label) => {
+    setSelectedLabel(label);
+  };
+
+  const handleDone = () => {
+    if (selectedLabel) {
+      onLabelSelect(selectedLabel);
+    }
+    onClose();
+  };
+
+  return (
+    <div className="label-popup-overlay">
+      <div className="label-popup">
+        <div className="label-options">
+          {labels.map((label) => (
+            <button
+              key={label.color}
+              className={`label-option ${selectedLabel === label ? 'selected' : ''}`}
+              style={{ backgroundColor: label.color }}
+              onClick={() => handleLabelClick(label)}
+              aria-label={`Select ${label.name} label`}
+            >
+              {selectedLabel === label && '✓'}
+            </button>
+          ))}
+        </div>
+        <button className="done-button" onClick={handleDone} aria-label="Confirm label selection">
+          Done
+        </button>
+      </div>
+    </div>
+  );
+};
+
+export default TaskLabel;
diff --git a/client/components/board.js b/client/components/board.js
deleted file mode 100644
index 8e15a7b..0000000
--- a/client/components/board.js
+++ /dev/null
@@ -1,116 +0,0 @@
-import { ConfirmationPopup } from './confirmationPopup.js';
-
-export function Board() {
-    // DOM References
-    const createBoardButton = document.getElementById("create-board-button");
-    const popupOverlay = document.getElementById("popup-overlay");
-    const closePopupButton = document.getElementById("close-popup-button");
-    const cancelButton = document.getElementById("cancel-button");
-    const createBoardForm = document.getElementById("create-board-form");
-    const createBoardButtonForm = document.getElementById("create-board-button-form");
-    const boardListContainer = document.getElementById("board-list-container");
-    const boardTopic = document.getElementById("board-topic");
-    const boardDescription = document.getElementById("board-topic-description");
-    const { showConfirmationPopup, hideConfirmationPopup } = ConfirmationPopup();
-
-    // Function to reset and hide the popup overlay
-    function resetPopupOverlay() {
-        popupOverlay.classList.add("hidden");
-        createBoardForm.reset(); // Reset all input fields in the form
-    }
-
-    // Function to handle the confirmation logic
-    function handleConfirmation(action) {
-        if (action === "discard") {
-            resetPopupOverlay(); // Close and reset the overlay
-        }
-        hideConfirmationPopup();
-    }
-
-    // Attach event listeners to confirmation popup buttons
-    document.getElementById("cancel-discard-button").addEventListener("click", () => {
-        hideConfirmationPopup();
-    });
-
-    document.getElementById("discard-button").addEventListener("click", () => {
-        handleConfirmation("discard");
-    });
-
-    // Function to update the board topic and description
-    function updateBoardDetails(name, description) {
-        boardTopic.textContent = name || "Untitled Board"; // Fallback for empty name
-        boardDescription.textContent = description || "No description provided."; // Fallback for empty description
-    }
-
-    // Function to create a new board
-    function createBoard(event) {
-        event.preventDefault(); // Prevent form submission reload
-
-        // Get inputs
-        const boardNameInput = document.getElementById("board-name");
-        const boardDescriptionInput = document.getElementById("input-board-description");
-        const boardName = boardNameInput.value.trim();
-        const boardDescription = boardDescriptionInput.value.trim();
-
-        // Validate board name
-        if (boardName) {
-            // Create a new board button
-            const newBoardButton = document.createElement("button");
-            newBoardButton.className = "board-button";
-            newBoardButton.textContent = boardName;
-
-            // Store board description as a data attribute (hidden)
-            newBoardButton.dataset.description = boardDescription;
-
-            // Add click event to toggle active class and update board details
-            newBoardButton.addEventListener("click", () => {
-                // Remove active class from all buttons
-                document.querySelectorAll(".board-button").forEach((btn) => btn.classList.remove("active"));
-
-                // Add active class to the clicked button
-                newBoardButton.classList.add("active");
-
-                // Update the board-topic and board-topic-description
-                updateBoardDetails(boardName, boardDescription);
-            });
-
-            // Append the new board button to the board list container
-            boardListContainer.appendChild(newBoardButton);
-
-            // Reset and close the popup
-            resetPopupOverlay();
-        } else {
-            alert("Please enter a board name.");
-        }
-    }
-
-    // Attach event listener to form submission
-    createBoardForm.addEventListener("submit", createBoard);
-
-    // Explicitly handle clicks on the "Create Board" button
-    createBoardButtonForm.addEventListener("click", createBoard);
-
-    // Show popup when the create board button is clicked
-    createBoardButton.addEventListener("click", () => {
-        popupOverlay.classList.remove("hidden");
-    });
-
-    // Show confirmation popup on close button click
-    closePopupButton.addEventListener("click", (event) => {
-        event.preventDefault(); // Prevent page reload
-        showConfirmationPopup();
-    });
-
-    // Show confirmation popup on cancel button click
-    cancelButton.addEventListener("click", (event) => {
-        event.preventDefault(); // Prevent page reload
-        showConfirmationPopup();
-    });
-
-    // Close popup overlay when clicking outside the popup content
-    popupOverlay.addEventListener("click", (e) => {
-        if (e.target === popupOverlay) {
-            showConfirmationPopup();
-        }
-    });
-}
diff --git a/client/components/boardproject.js b/client/components/boardproject.js
deleted file mode 100644
index 74128a6..0000000
--- a/client/components/boardproject.js
+++ /dev/null
@@ -1,144 +0,0 @@
-export function BoardProject() {
-  const projectBox = document.getElementById("projectbox");
-  const projectListContainer = document.getElementById("project-list-container");
-  const boardSection = document.getElementById("board-section");
-  const projectSection = document.getElementById("project-section");
-  const projectNameDisplay = document.getElementById("projectname");
-  const projectDescriptionDisplay = document.getElementById("projectdescription");
-
-  // Default text for project name and description
-  const defaultProjectName = "No Project Selected";
-  const defaultProjectDescription = "No description available";
-
-  // Create and add the triangle symbol
-  const triangleSymbol = document.createElement("div");
-  triangleSymbol.id = "triangle-symbol";
-  triangleSymbol.classList.add("triangle-right"); // Default direction
-  projectBox.prepend(triangleSymbol);
-
-  // Create and add the project settings icon
-  const projectSettingsIcon = document.createElement("img");
-  projectSettingsIcon.id = "project-settings-icon";
-  projectSettingsIcon.src = "assets/setting.svg"; // Path to your settings.svg
-  projectSettingsIcon.alt = "Project Settings";
-  projectSettingsIcon.classList.add("project-settings-icon");
-  projectBox.appendChild(projectSettingsIcon);
-
-  // Create the project settings popup
-  const projectSettingsPopup = document.createElement("div");
-  projectSettingsPopup.id = "project-settings-popup";
-  projectSettingsPopup.classList.add("hidden", "project-settings-popup");
-  projectSettingsPopup.innerHTML = `
-    <p class="project-settings-option" id="share-project">Share Project</p>
-    <p class="project-settings-option" id="edit-project">Edit Project</p>
-    <p class="project-settings-option delete" id="delete-project">Delete Project</p>
-  `;
-  document.body.appendChild(projectSettingsPopup);
-
-  // Position the popup near the settings icon
-  function positionPopup() {
-    const rect = projectSettingsIcon.getBoundingClientRect();
-    projectSettingsPopup.style.top = `${rect.bottom + window.scrollY}px`;
-    projectSettingsPopup.style.left = `${rect.left + window.scrollX}px`;
-  }
-
-  // Toggle the popup visibility
-  projectSettingsIcon.addEventListener("click", (event) => {
-    event.stopPropagation(); // Prevent click propagation
-    if (projectSettingsPopup.classList.contains("hidden")) {
-      document.querySelectorAll(".project-settings-popup").forEach((popup) =>
-        popup.classList.add("hidden")
-      );
-      positionPopup();
-      projectSettingsPopup.classList.remove("hidden");
-    } else {
-      projectSettingsPopup.classList.add("hidden");
-    }
-  });
-
-  // Hide the popup when clicking outside
-  document.addEventListener("click", () => {
-    projectSettingsPopup.classList.add("hidden");
-  });
-
-  // Update dynamic line position
-  function updateDynamicLine() {
-    let dynamicLine = document.querySelector(".dynamic-line");
-    if (!dynamicLine) {
-      dynamicLine = document.createElement("div");
-      dynamicLine.className = "dynamic-line";
-      projectSection.appendChild(dynamicLine);
-    }
-
-    const lastProjectButton = projectListContainer.querySelector(".project-button:last-child");
-    if (lastProjectButton) {
-      const lastButtonRect = lastProjectButton.getBoundingClientRect();
-      const projectSectionRect = projectSection.getBoundingClientRect();
-      const offsetVh = ((lastButtonRect.bottom - projectSectionRect.top) / window.innerHeight) * 100;
-      dynamicLine.style.top = `calc(${offsetVh}vh + 2.5vh)`; // Adjust for spacing
-      dynamicLine.style.left = "0";
-      dynamicLine.style.width = "100%";
-      dynamicLine.style.display = "block";
-    } else {
-      // Hide the dynamic line if no project buttons exist
-      dynamicLine.style.display = "none";
-    }
-  }
-
-  // Event listener for the "Delete Project" option
-  projectSettingsPopup.addEventListener("click", (event) => {
-    if (event.target.id === "delete-project") {
-      const activeProjectButton = document.querySelector(".project-button.active");
-      if (activeProjectButton) {
-        activeProjectButton.remove(); // Remove the active project button
-        projectSettingsPopup.classList.add("hidden"); // Hide the popup
-        console.log("Project deleted.");
-
-        // Reset project name and description to default
-        projectNameDisplay.textContent = defaultProjectName;
-        projectDescriptionDisplay.textContent = defaultProjectDescription;
-
-        // Update dynamic line position
-        updateDynamicLine();
-      } else {
-        console.log("No active project to delete.");
-      }
-    }
-  });
-
-  // Event listener for the "Share Project" option
-  projectSettingsPopup.addEventListener("click", (event) => {
-    if (event.target.id === "share-project") {
-      console.log("Share Project clicked");
-      // Add your logic for sharing the project here
-    }
-  });
-
-  // Event listener for the "Edit Project" option
-  projectSettingsPopup.addEventListener("click", (event) => {
-    if (event.target.id === "edit-project") {
-      console.log("Edit Project clicked");
-      // Add your logic for editing the project here
-    }
-  });
-
-  // Toggle between the board section and project section
-  projectBox.addEventListener("click", (event) => {
-    if (event.target === projectSettingsIcon) return; // Do nothing if settings icon clicked
-
-    if (boardSection.style.display === "none") {
-      boardSection.style.display = "block";
-      projectSection.style.display = "none";
-      triangleSymbol.classList.remove("triangle-down");
-      triangleSymbol.classList.add("triangle-right");
-    } else {
-      boardSection.style.display = "none";
-      projectSection.style.display = "block";
-      triangleSymbol.classList.remove("triangle-right");
-      triangleSymbol.classList.add("triangle-down");
-    }
-  });
-
-  // Initial dynamic line setup
-  updateDynamicLine();
-}
diff --git a/client/components/calendar.js b/client/components/calendar.js
deleted file mode 100644
index d27eeff..0000000
--- a/client/components/calendar.js
+++ /dev/null
@@ -1,115 +0,0 @@
-export function Calendar() {
-  const calendarContainer = document.getElementById("calendar-container");
-  const prevMonthButton = document.getElementById("prev-month-button");
-  const nextMonthButton = document.getElementById("next-month-button");
-  const monthYearDisplay = document.getElementById("month-year-display");
-  const calendarDays = document.querySelector(".calendar-days");
-  const startDateButton = document.getElementById("start-date-button");
-  const dueDateButton = document.getElementById("due-date-button");
-
-  let displayedMonth = new Date().getMonth();
-  let displayedYear = new Date().getFullYear();
-  let selectedButton = null;
-  let startDate = null;
-  let dueDate = null;
-
-  function renderCalendar(month, year) {
-    calendarDays.innerHTML = "";
-    const monthNames = [
-      "January", "February", "March", "April", "May", "June",
-      "July", "August", "September", "October", "November", "December",
-    ];
-    monthYearDisplay.textContent = `${monthNames[month]} ${year}`;
-
-    const firstDay = new Date(year, month, 1).getDay();
-    const daysInMonth = new Date(year, month + 1, 0).getDate();
-
-    for (let i = 0; i < firstDay; i++) {
-      const emptyCell = document.createElement("div");
-      emptyCell.classList.add("day", "empty");
-      calendarDays.appendChild(emptyCell);
-    }
-
-    for (let day = 1; day <= daysInMonth; day++) {
-      const dayCell = document.createElement("div");
-      dayCell.classList.add("day");
-      dayCell.textContent = day;
-
-      const date = new Date(year, month, day);
-
-      if (
-        (startDate && date.getTime() === startDate.getTime()) ||
-        (dueDate && date.getTime() === dueDate.getTime())
-      ) {
-        dayCell.classList.add("selected");
-      }
-
-      dayCell.addEventListener("click", () => {
-        const selectedDate = new Date(year, month, day);
-
-        if (selectedButton === startDateButton) {
-          if (dueDate && selectedDate > dueDate) {
-            alert("Start date must be less than or equal to the due date.");
-            return;
-          }
-          startDate = selectedDate;
-          startDateButton.textContent = selectedDate.toLocaleDateString();
-        } else if (selectedButton === dueDateButton) {
-          if (startDate && selectedDate < startDate) {
-            alert("Due date must be greater than or equal to the start date.");
-            return;
-          }
-          dueDate = selectedDate;
-          dueDateButton.textContent = selectedDate.toLocaleDateString();
-        }
-
-        calendarContainer.classList.add("hidden");
-        renderCalendar(displayedMonth, displayedYear); // Re-render to update selected days
-      });
-
-      calendarDays.appendChild(dayCell);
-    }
-  }
-
-  prevMonthButton.addEventListener("click", () => {
-    displayedMonth--;
-    if (displayedMonth < 0) {
-      displayedMonth = 11;
-      displayedYear--;
-    }
-    renderCalendar(displayedMonth, displayedYear);
-  });
-
-  nextMonthButton.addEventListener("click", () => {
-    displayedMonth++;
-    if (displayedMonth > 11) {
-      displayedMonth = 0;
-      displayedYear++;
-    }
-    renderCalendar(displayedMonth, displayedYear);
-  });
-
-  startDateButton.addEventListener("click", (e) => {
-    selectedButton = e.target;
-    calendarContainer.classList.remove("hidden");
-    renderCalendar(displayedMonth, displayedYear);
-  });
-
-  dueDateButton.addEventListener("click", (e) => {
-    selectedButton = e.target;
-    calendarContainer.classList.remove("hidden");
-    renderCalendar(displayedMonth, displayedYear);
-  });
-
-  document.addEventListener("click", (e) => {
-    if (
-      !calendarContainer.contains(e.target) &&
-      e.target.id !== "start-date-button" &&
-      e.target.id !== "due-date-button"
-    ) {
-      calendarContainer.classList.add("hidden");
-    }
-  });
-
-  renderCalendar(displayedMonth, displayedYear);
-}
diff --git a/client/components/confirmationPopup.js b/client/components/confirmationPopup.js
deleted file mode 100644
index 5cb4f28..0000000
--- a/client/components/confirmationPopup.js
+++ /dev/null
@@ -1,37 +0,0 @@
-export function ConfirmationPopup() {
-  const confirmationPopup = document.querySelector('#confirmation-popup');
-  const cancelDiscardButton = document.querySelector('#cancel-discard-button');
-  const discardButton = document.querySelector('#discard-button');
-
-  // Close the confirmation popup when clicking the cancel button
-  cancelDiscardButton.addEventListener('click', () => {
-    confirmationPopup.classList.add('hidden');
-  });
-
-  // Close the confirmation popup when clicking the discard button
-  discardButton.addEventListener('click', () => {
-    confirmationPopup.classList.add('hidden');
-  });
-
-  // Close the confirmation popup when clicking on the overlay
-  confirmationPopup.addEventListener('click', (event) => {
-    if (event.target === confirmationPopup) {
-      confirmationPopup.classList.add('hidden');
-    }
-  });
-
-  // Function to show the confirmation popup
-  function showConfirmationPopup() {
-    confirmationPopup.classList.remove('hidden');
-  }
-
-  // Function to hide the confirmation popup
-  function hideConfirmationPopup() {
-    confirmationPopup.classList.add('hidden');
-  }
-
-  return {
-    showConfirmationPopup,
-    hideConfirmationPopup
-  };
-}
diff --git a/client/components/interface.js b/client/components/interface.js
deleted file mode 100644
index 9735991..0000000
--- a/client/components/interface.js
+++ /dev/null
@@ -1,221 +0,0 @@
-export function Interface(user,member) {
-  return `
-    <div class="file-display">
-      <span class="file-name">very_long_file_name_example.txt</span>
-      <button class="remove-file-button">X</button>
-    </div>
-
-    <div id="calendar-container" class="hidden">
-      <div id="calendar">
-        <div class="calendar-header">
-          <button id="prev-month-button">←</button>
-          <span id="month-year-display"></span>
-          <button id="next-month-button">→</button>
-        </div>
-        <div class="calendar-grid">
-          <div class="weekday">Sun</div>
-          <div class="weekday">Mon</div>
-          <div class="weekday">Tue</div>
-          <div class="weekday">Wed</div>
-          <div class="weekday">Thu</div>
-          <div class="weekday">Fri</div>
-          <div class="weekday">Sat</div>
-        </div>
-        <div class="calendar-days"></div>
-      </div>
-    </div>
-
-    <!-- Add List Button -->
-    <button id="add-list-button">+ add a list</button>
-
-    <!-- List Container -->
-    <div id="list-container"></div>
-
-    <div id="board-page">
-
-      <!-- Board Topic -->
-      <div id="board-topic"></div>
-      
-      <!-- Board Description -->
-      <div id="board-topic-description"></div>
-      
-      <!-- Settings Icon -->
-      <div id="settings-icon">
-        <img src="assets/setting.svg" alt="Settings">
-      </div>
-      
-      <!-- Tasks Checkbox -->
-      <div id="tasks-checkbox">
-        <input type="checkbox" id="tasks-checkbox-input">
-        <label for="tasks-checkbox-input">tasks assigned to me</label>
-      </div>
-
-      <div id="sidebar">
-        <div id="logo"></div>
-        <div id="userbox">
-          <img src="${user.avatarUrl}" alt="Profile Picture" id="profile-pic">
-          <span id="username">${user.username}</span>
-        </div>
-
-        <!-- Project Box -->
-        <div id="projectbox" class="clickable">
-          <div id="projectname">Project Name</div>
-          <div id="projectdescription">Project Description</div>
-        </div>
-
-        <!-- Settings Popup -->
-        <div id="settings-popup">
-          <p id="edit-board">edit board</p>
-          <p id="delete-board" class="delete">delete board</p>
-        </div>
-
-        <!-- Board Section -->
-        <div id="board-section">
-          <span id="board-text">Boards</span>
-          <div id="create-board-container">
-            <button id="create-board-button">+ Create New Board</button>
-          </div>
-          <div id="board-list-container"></div> <!-- Separate container for boards -->
-        </div>
-
-        <!-- Project Section -->
-        <div id="project-section">
-          <button id="create-project-button">+ create new project</button>
-          <div id="line-under-button"></div>
-          <div id="project-list-container"></div>
-        </div>
-
-        <!-- Main Popup and Overlay -->
-        <div id="popup-overlay" class="hidden">
-          <div id="popup-content">
-            <div class="popup-header">
-              <div id="header-title">Create new board</div>
-              <button id="close-popup-button">✖</button>
-            </div>
-            <div id="popup-body-main">
-              <form id="create-board-form">
-                <label for="board-name">board name</label>
-                <input type="text" id="board-name" placeholder="Enter board name" required>
-                <label for="board-description">board description (optional)</label>
-                <textarea id="input-board-description" placeholder="Enter board description"></textarea>
-              </form>
-            </div>
-            <div class="popup-buttons">
-              <button type="button" id="cancel-button">cancel</button>
-              <button type="submit" id="create-board-button-form">create board</button>
-            </div>
-          </div>
-        </div>
-
-        <!-- Project Popup and Overlay -->
-        <div id="project-popup-overlay" class="hidden">
-          <div id="popup-content">
-            <div class="popup-header">
-              <div id="header-title">Create new project</div>
-              <button id="close-project-popup-button">✖</button>
-            </div>
-            <div id="popup-body-main">
-              <form id="create-project-form">
-                <label for="project-name">project name</label>
-                <input type="text" id="project-name" placeholder="Enter project name" required>
-                <label for="project-description">project description (optional)</label>
-                <textarea id="project-description" placeholder="Enter project description"></textarea>
-              </form>
-            </div>
-            <div class="popup-buttons">
-              <button type="button" id="cancel-project-button">cancel</button>
-              <button type="submit" id="create-project-button-form">create project</button>
-            </div>
-          </div>
-        </div>
-
-        <!-- Task Popup and Overlay -->
-        <div id="task-popup-overlay" class="hidden">
-          <div id="task-popup-content">
-            <div class="popup-header">
-              <div id="header-title">Add a task</div>
-              <button id="close-task-popup-button">✖</button>
-            </div>
-            <div id="popup-body">
-              <form id="add-task-form">
-                <label for="task-name">task name</label>
-                <input type="text" id="task-name" placeholder="Enter task name" required>
-                <label for="task-details">task description (optional)</label>
-                <textarea id="task-details" placeholder="Enter task description"></textarea>
-                <label for="attached-file">attached file</label>
-                <div id="file-container">
-                  <button id="add-file-button" type="button">+ add file</button>
-                </div>
-                <div class="date-inputs">
-                  <div>
-                    <label for="start-date">start date</label>
-                    <button id="start-date-button" type="button">dd/mm/yy</button>
-                  </div>
-                  <div>
-                    <label for="due-date">due date</label>
-                    <button id="due-date-button" type="button">dd/mm/yy</button>
-                  </div>
-                </div>
-                <div class="label-task">
-                  <div>
-                    <label for="label">label</label>
-                    <button id="set-label-button" type="button">set label</button>
-                  </div>
-                  <div>
-                    <label for="task-assigned-to">task assigned to</label>
-                    <button id="add-member-button" type="button">+ add member</button>
-                  </div>
-                </div>
-                <div class="reminder">
-                  <label for="reminder">set reminder</label>
-                  <div class="reminder-inputs">
-                    <span>remind every</span>
-                    <input type="text" id="reminder" placeholder="dd">
-                    <span>day</span>
-                  </div>
-                </div>
-              </form>
-            </div>
-            <div class="popup-buttons">
-              <button type="button" id="cancel-task-button">cancel</button>
-              <button type="submit" id="add-task-button-submit">add a task</button>
-            </div>
-          </div>
-        </div>
-
-        <div id="label-popup" class="hidden">
-          <div class="popup-content">
-            <div class="label-options">
-              <button class="label-option" style="background-color: #A259FF;" data-color="#A259FF"></button>
-              <button class="label-option" style="background-color: #FFD93D;" data-color="#FFD93D"></button>
-              <button class="label-option" style="background-color: #53D1F0;" data-color="#53D1F0"></button>
-              <button class="label-option" style="background-color: #FF773D;" data-color="#FF773D"></button>
-              <button class="label-option" style="background-color: #3D8BFF;" data-color="#3D8BFF"></button>
-              <button class="label-option" style="background-color: #FF3D71;" data-color="#FF3D71"></button>
-              <button class="label-option" style="background-color: #3DFF77;" data-color="#3DFF77"></button>
-              <button id="done-label-button" class="done-button">done</button>
-            </div>
-          </div>
-        </div>
-
-        <div id="member-popup" class="hidden">
-            <div class="member-options"></div>
-            <button id="done-member-button">Done</button>
-        </div>
-        <button id="add-member-button">+ Add Member</button>
-
-        <!-- Confirmation Popup -->
-        <div id="confirmation-popup" class="hidden">
-          <div id="confirmation-content">
-            <h3>Discard changes?</h3>
-            <p>If you go back now, you will lose any changes you’ve made.</p>
-            <div class="confirmation-buttons">
-              <button id="cancel-discard-button">Cancel</button>
-              <button id="discard-button" class="discard">Discard</button>
-            </div>
-          </div>
-        </div>
-      </div>
-  `;
-}
-
diff --git a/client/components/list.js b/client/components/list.js
deleted file mode 100644
index 2c5df9d..0000000
--- a/client/components/list.js
+++ /dev/null
@@ -1,212 +0,0 @@
-export function List() {
-  const listContainer = document.getElementById("list-container");
-  const addListButton = document.getElementById("add-list-button");
-  const taskPopupOverlay = document.getElementById("task-popup-overlay");
-  const taskListIdInput = document.getElementById("task-list-id"); // Hidden input to store target list ID
-
-  let listCount = 0;
-  const initialPosition = 27; // Initial position of add-list-button in vw
-  const offset = 302; // Offset for positioning lists (in px)
-
-  // Function to update the position of the add-list-button
-  function updateAddListButtonPosition() {
-    addListButton.style.left = `calc(${initialPosition}vw + ${listCount * offset}px)`;
-  }
-
-  // Function to create a new list input box
-  function createNewListInputBox() {
-    addListButton.style.display = "none";
-
-    const createNewListBox = document.createElement("div");
-    createNewListBox.classList.add("create-new-list");
-
-    const listInput = document.createElement("input");
-    listInput.type = "text";
-    listInput.placeholder = "Enter list name...";
-    listInput.classList.add("add-list-input");
-
-    const buttonRow = document.createElement("div");
-    buttonRow.classList.add("button-row");
-
-    const cancelButton = document.createElement("button");
-    cancelButton.textContent = "cancel";
-    cancelButton.classList.add("cancel-list-button");
-    cancelButton.addEventListener("click", () => {
-      createNewListBox.remove();
-      addListButton.style.display = "block";
-    });
-
-    const confirmButton = document.createElement("button");
-    confirmButton.textContent = "confirm";
-    confirmButton.classList.add("confirm-list-button");
-    confirmButton.addEventListener("click", () => {
-      const listName = listInput.value.trim();
-      if (listName) {
-        const listData = { id: Date.now(), title: listName };
-        renderList(listData, listContainer);
-        listCount++;
-        updateAddListButtonPosition();
-        createNewListBox.remove();
-        addListButton.style.display = "block";
-      } else {
-        alert("List name cannot be empty.");
-      }
-    });
-
-    buttonRow.appendChild(cancelButton);
-    buttonRow.appendChild(confirmButton);
-    createNewListBox.appendChild(listInput);
-    createNewListBox.appendChild(buttonRow);
-    listContainer.appendChild(createNewListBox);
-  }
-
-  // Function to render a list
-  function renderList(listData, container, existingList = null) {
-    const list = document.createElement("div");
-    list.classList.add("list");
-    list.setAttribute("data-list-id", listData.id);
-  
-    // Container for title and settings
-    const titleContainer = document.createElement("div");
-    titleContainer.classList.add("list-title-container");
-  
-    // List title
-    const title = document.createElement("span");
-    title.classList.add("list-title");
-    title.textContent = listData.title;
-  
-    // Settings icon
-    const listSettingsIcon = document.createElement("img");
-    listSettingsIcon.src = "../assets/setting.svg"; // Replace with the actual path to your settings.svg
-    listSettingsIcon.alt = "Settings";
-    listSettingsIcon.classList.add("list-settings-icon");
-  
-    // List settings popup
-    const settingsPopup = document.createElement("div");
-    settingsPopup.classList.add("list-settings-popup", "hidden");
-  
-    // Rename List button
-    const renameButton = document.createElement("p");
-    renameButton.textContent = "rename list";
-    renameButton.addEventListener("click", () => {
-      console.log("Rename list clicked.");
-  
-      // Replace list content with the rename input box
-      list.innerHTML = ""; // Clear the current list content
-  
-      const renameContainer = document.createElement("div");
-      renameContainer.classList.add("rename-list");
-  
-      const renameInput = document.createElement("input");
-      renameInput.type = "text";
-      renameInput.value = listData.title; // Pre-fill with the current title
-      renameInput.classList.add("add-list-input");
-      renameInput.placeholder = "Enter new name...";
-  
-      const buttonRow = document.createElement("div");
-      buttonRow.classList.add("button-row");
-  
-      const cancelRenameButton = document.createElement("button");
-      cancelRenameButton.textContent = "cancel";
-      cancelRenameButton.classList.add("cancel-rename-button");
-      cancelRenameButton.addEventListener("click", () => {
-        console.log("Rename canceled.");
-        renderList(listData, container, list); // Re-render the original list in place
-      });
-      
-      const confirmRenameButton = document.createElement("button");
-      confirmRenameButton.textContent = "confirm";
-      confirmRenameButton.classList.add("confirm-rename-button");
-      confirmRenameButton.addEventListener("click", () => {
-        const newTitle = renameInput.value.trim();
-        if (newTitle) {
-          console.log("List renamed to:", newTitle);
-          listData.title = newTitle; // Update the list title in the data
-          renderList(listData, container, list); // Re-render the updated list in place
-        } else {
-          alert("List name cannot be empty.");
-        }
-      });
-  
-      buttonRow.appendChild(cancelRenameButton);
-      buttonRow.appendChild(confirmRenameButton);
-      renameContainer.appendChild(renameInput);
-      renameContainer.appendChild(buttonRow);
-      list.appendChild(renameContainer);
-      renameInput.focus();
-    });
-  
-    // Add Task button
-    const addTaskButton = document.createElement("p");
-    addTaskButton.textContent = "add a task";
-    addTaskButton.addEventListener("click", () => {
-      console.log("Add task clicked.");
-      taskPopupOverlay.classList.remove("hidden");
-      settingsPopup.classList.add("hidden");
-    });
-  
-    // Delete List button
-    const deleteButton = document.createElement("p");
-    deleteButton.textContent = "delete list";
-    deleteButton.classList.add("delete");
-    deleteButton.addEventListener("click", () => {
-      console.log("Delete list clicked.");
-      list.remove();
-      listCount--;
-      updateAddListButtonPosition();
-    });
-  
-    settingsPopup.appendChild(renameButton);
-    settingsPopup.appendChild(addTaskButton);
-    settingsPopup.appendChild(deleteButton);
-  
-    // Add event listener to settings icon
-    listSettingsIcon.addEventListener("click", (event) => {
-      event.stopPropagation(); // Prevent click propagation
-      const isHidden = settingsPopup.classList.contains("hidden");
-      document.querySelectorAll(".list-settings-popup").forEach((popup) =>
-        popup.classList.add("hidden")
-      );
-  
-      if (isHidden) {
-        const rect = listSettingsIcon.getBoundingClientRect();
-        settingsPopup.style.top = `${rect.top + window.scrollY}px`; // Adjust for upward offset
-        settingsPopup.style.left = `${rect.left + window.scrollX + 55}px`; // Adjust for rightward offset
-        settingsPopup.classList.remove("hidden");
-      }
-    });
-  
-    document.addEventListener("click", () => {
-      settingsPopup.classList.add("hidden");
-    });
-  
-    titleContainer.appendChild(title);
-    titleContainer.appendChild(listSettingsIcon);
-    list.appendChild(titleContainer);
-  
-    // Add Task button inside the list
-    const addTaskButtonInList = document.createElement("button");
-    addTaskButtonInList.textContent = "+ add a task";
-    addTaskButtonInList.classList.add("add-task-button");
-    addTaskButtonInList.addEventListener("click", () => {
-      console.log("Add task clicked (from list).");
-      taskPopupOverlay.classList.remove("hidden");
-    });
-  
-    list.appendChild(addTaskButtonInList);
-  
-    // Replace the existing list if provided
-    if (existingList) {
-      container.replaceChild(list, existingList);
-    } else {
-      container.appendChild(list);
-    }
-  
-    // Append the settings popup to the body for absolute positioning
-    document.body.appendChild(settingsPopup);
-  }  
-  
-
-  addListButton.addEventListener("click", createNewListInputBox);
-  updateAddListButtonPosition();
-}
diff --git a/client/components/member.js b/client/components/member.js
deleted file mode 100644
index b90f751..0000000
--- a/client/components/member.js
+++ /dev/null
@@ -1,97 +0,0 @@
-export function Member(members) {
-    const memberPopup = document.getElementById("member-popup");
-    const doneMemberButton = document.getElementById("done-member-button");
-    const addMemberButton = document.getElementById("add-member-button");
-    const memberOptionsContainer = document.querySelector(".member-options");
-
-    let selectedMemberButton = null;
-
-    // Populate Members
-    function populateMembers(memberList) {
-        console.log("Populating members:", memberList);
-
-        if (!memberOptionsContainer) {
-            console.error("Member options container not found.");
-            return;
-        }
-
-        memberOptionsContainer.innerHTML = ""; // Clear existing options
-
-        memberList.forEach((member, index) => {
-            if (!member || !member.profilePicture || !member.name) {
-                console.error(`Invalid member at index ${index}:`, member);
-                return; // Skip invalid member
-            }
-
-            console.log(`Adding member ${index + 1}:`, member);
-
-            const memberOption = document.createElement("div");
-            memberOption.className = "member-option";
-            memberOption.setAttribute("data-member-id", member.id);
-
-            const profilePicture = document.createElement("img");
-            profilePicture.src = member.profilePicture;
-            profilePicture.alt = member.name;
-            profilePicture.className = "member-profile-picture";
-
-            const username = document.createElement("span");
-            username.textContent = member.name;
-            username.className = "member-username";
-
-            memberOption.appendChild(profilePicture);
-            memberOption.appendChild(username);
-            memberOptionsContainer.appendChild(memberOption);
-        });
-
-        console.log("Members successfully added to member-options.");
-    }
-
-    // Show Member Popup
-    function showMemberPopup() {
-        if (memberPopup) {
-            console.log("Showing member popup.");
-            memberPopup.classList.remove("hidden");
-        } else {
-            console.error("Member popup element not found.");
-        }
-    }
-
-    // Hide Member Popup
-    function hideMemberPopup() {
-        if (memberPopup) {
-            console.log("Hiding member popup.");
-            memberPopup.classList.add("hidden");
-        }
-    }
-
-    // Done Button Logic
-    doneMemberButton.addEventListener("click", () => {
-        if (selectedMemberButton) {
-            const selectedMemberName = selectedMemberButton.querySelector(".member-username").textContent;
-            addMemberButton.textContent = selectedMemberName;
-            addMemberButton.style.backgroundColor = "#53D1F0";
-            addMemberButton.style.color = "#fff";
-            hideMemberPopup();
-        } else {
-            alert("Please select a member before clicking 'Done'.");
-        }
-    });
-
-    // Close Popup on Outside Click
-    document.addEventListener("click", (event) => {
-        if (
-            memberPopup &&
-            !memberPopup.contains(event.target) &&
-            event.target.id !== "add-member-button"
-        ) {
-            hideMemberPopup();
-        }
-    });
-
-    // Populate members during initialization
-    populateMembers(members);
-
-    return {
-        showMemberPopup,
-    };
-}
diff --git a/client/components/pages/Project.jsx b/client/components/pages/Project.jsx
new file mode 100644
index 0000000..50dc736
--- /dev/null
+++ b/client/components/pages/Project.jsx
@@ -0,0 +1,132 @@
+import React, { useState, useEffect } from 'react';
+import { DiscordSDK } from '@discord/embedded-app-sdk';
+import Interface from '../Interface.jsx';
+import Calendar from '../Calendar.jsx';
+import Task from '../../../Task.jsx';
+import Board from '../BoardSection.jsx';
+import SettingsPopup from '../Settings.jsx';
+import ProjectSection from '../ProjectSection.jsx';
+import ConfirmationPopup from '../ConfirmationPopup.jsx';
+import TaskLabel from '../TaskLabel.jsx';
+import BoardProject from '../BoardProject.jsx';
+import List from '../List.jsx';
+import Member from '../Member.jsx';
+import ErrorBoundary from '/ErrorBoundary.jsx';
+import '/styles/sidebar.css';
+
+
+const Project = () => {
+  const [discordSdk, setDiscordSdk] = useState(null);
+  const [user, setUser] = useState(null);
+  const [isConfirmationVisible, setIsConfirmationVisible] = useState(false);
+  const [labelPopupVisible, setLabelPopupVisible] = useState(false);
+
+  useEffect(() => {
+    const setupDiscordSdk = async () => {
+      try {
+        const discordClientId = import.meta.env.VITE_DISCORD_CLIENT_ID;
+
+        if (!discordClientId) {
+          throw new Error('Discord Client ID is missing');
+        }
+
+        console.log('Setting up Discord SDK...');
+
+        // Initialize Discord SDK
+        const sdk = new DiscordSDK(discordClientId);
+        await sdk.ready();
+
+        console.log('Discord SDK Ready...');
+
+        // Authorize with Discord OAuth
+        const { code } = await sdk.commands.authorize({
+          client_id: discordClientId,
+          response_type: 'code',
+          state: '',
+          prompt: 'none',
+          scope: ['identify', 'guilds', 'applications.commands'],
+        });
+
+        console.log('Authorization code received...');
+
+        // Exchange authorization code for access token
+        const response = await fetch('/.proxy/api/v1/token', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ code }),
+        });
+
+        if (!response.ok) {
+          throw new Error('Failed to fetch access token');
+        }
+
+        const { access_token } = await response.json();
+        console.log('Access Token received...');
+
+        // Authenticate with Discord SDK using the access token
+        await sdk.commands.authenticate({ access_token });
+
+        console.log('Authentication successful...');
+
+        // Fetch the user profile
+        const userProfile = await fetchUserProfile(access_token);
+        console.log('User Profile:', userProfile);
+
+        setUser({
+          username: userProfile.username,
+          avatarUrl: `https://cdn.discordapp.com/avatars/${userProfile.id}/${userProfile.avatar}.png`,
+        });
+
+        setDiscordSdk(sdk);
+      } catch (error) {
+        console.error('Error setting up Discord SDK:', error);
+      }
+    };
+
+    const fetchUserProfile = async (token) => {
+      const response = await fetch('https://discord.com/api/users/@me', {
+        headers: { Authorization: `Bearer ${token}` },
+      });
+      if (!response.ok) {
+        throw new Error('Failed to fetch user profile');
+      }
+      return await response.json();
+    };
+
+    setupDiscordSdk();
+  }, []);
+
+  const handleConfirmation = () => {
+    setIsConfirmationVisible(false);
+  };
+
+  if (!user) {
+    console.log('User data is still loading...');
+    return <div>Loading...</div>;
+  }
+
+  return (
+    <div id="app">
+      <Interface user={user} />
+      <Task />
+      <SettingsPopup />
+      <ConfirmationPopup
+        isVisible={isConfirmationVisible}
+        onConfirm={handleConfirmation}
+        onCancel={() => setIsConfirmationVisible(false)}
+      />
+      <TaskLabel
+        isVisible={labelPopupVisible}
+        onLabelSelect={(label) => console.log('Selected label:', label)}
+        onClose={() => setLabelPopupVisible(false)}
+      />
+      <ErrorBoundary>
+        <BoardProject />
+      </ErrorBoundary>
+      <List />
+      <Member members={[{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }]} />
+    </div>
+  );
+};
+
+export default Project;
diff --git a/client/components/projectPopup.js b/client/components/projectPopup.js
deleted file mode 100644
index 49073a2..0000000
--- a/client/components/projectPopup.js
+++ /dev/null
@@ -1,129 +0,0 @@
-import { ConfirmationPopup } from './confirmationPopup.js';
-
-export function ProjectPopup() {
-  const projectListContainer = document.getElementById("project-list-container");
-  const createProjectButton = document.getElementById("create-project-button");
-  const createProjectButtonForm = document.getElementById("create-project-button-form");
-  const projectPopupOverlay = document.getElementById("project-popup-overlay");
-  const closeProjectPopupButton = document.getElementById("close-project-popup-button");
-  const cancelProjectButton = document.getElementById("cancel-project-button");
-  const projectNameInput = document.getElementById("project-name");
-  const projectDescriptionInput = document.getElementById("project-description");
-  const projectNameDisplay = document.getElementById("projectname"); // Display area for project name
-  const projectDescriptionDisplay = document.getElementById("projectdescription"); // Display area for project description
-  const { showConfirmationPopup, hideConfirmationPopup } = ConfirmationPopup();
-
-  // Function to reset and hide the project popup overlay
-  function resetProjectPopupOverlay() {
-    projectPopupOverlay.classList.add("hidden");
-    projectNameInput.value = ""; // Clear the input field
-    projectDescriptionInput.value = ""; // Clear the description field
-  }
-
-  // Function to handle the confirmation logic
-  function handleConfirmation(action) {
-    if (action === "discard") {
-      resetProjectPopupOverlay();
-    }
-    hideConfirmationPopup();
-  }
-
-  // Attach event listeners to confirmation popup buttons
-  document.getElementById("cancel-discard-button").addEventListener("click", () => {
-    hideConfirmationPopup();
-  });
-
-  document.getElementById("discard-button").addEventListener("click", () => {
-    handleConfirmation("discard");
-  });
-
-  // Show the project popup
-  function showProjectPopup() {
-    projectPopupOverlay.classList.remove("hidden");
-  }
-
-  // Function to dynamically position the line
-  function createOrUpdateDynamicLine() {
-    const projectSection = document.getElementById("project-section");
-    let dynamicLine = document.querySelector(".dynamic-line");
-
-    if (!dynamicLine) {
-      dynamicLine = document.createElement("div");
-      dynamicLine.className = "dynamic-line";
-      projectSection.appendChild(dynamicLine);
-    }
-
-    const lastProjectButton = projectListContainer.querySelector(".project-button:last-child");
-    if (lastProjectButton) {
-      const lastButtonRect = lastProjectButton.getBoundingClientRect();
-      const projectSectionRect = projectSection.getBoundingClientRect();
-      const offsetVh = ((lastButtonRect.bottom - projectSectionRect.top) / window.innerHeight) * 100;
-      dynamicLine.style.top = `calc(${offsetVh}vh + 2.5vh)`; // Adjust for spacing
-      dynamicLine.style.left = "0";
-      dynamicLine.style.width = "100%";
-      dynamicLine.style.display = "block";
-    } else {
-      dynamicLine.style.display = "none"; // Hide if no projects
-    }
-  }
-
-  // Handle creating a new project button
-  function handleCreateProject(event) {
-    event.preventDefault();
-
-    const projectName = projectNameInput.value.trim();
-    const projectDescription = projectDescriptionInput.value.trim();
-    if (projectName) {
-      const newProjectButton = document.createElement("button");
-      newProjectButton.className = "project-button";
-      newProjectButton.innerHTML = `
-        <span class="checkmark hidden">✓</span>
-        <span class="project-name">${projectName}</span>
-      `;
-
-      // Store the project description as a data attribute (hidden)
-      newProjectButton.dataset.description = projectDescription;
-
-      // Add event listener to select the project and update projectbox
-      newProjectButton.addEventListener("click", () => {
-        document.querySelectorAll(".project-button").forEach((btn) => {
-          btn.classList.remove("active");
-          btn.querySelector(".checkmark").classList.add("hidden");
-        });
-        newProjectButton.classList.add("active");
-        newProjectButton.querySelector(".checkmark").classList.remove("hidden");
-
-        // Update the projectbox with the selected project's name and description
-        projectNameDisplay.textContent = projectName;
-        projectDescriptionDisplay.textContent = projectDescription || "No description.";
-      });
-
-      projectListContainer.appendChild(newProjectButton);
-      resetProjectPopupOverlay();
-      createOrUpdateDynamicLine();
-    } else {
-      alert("Please enter a project name.");
-    }
-  }
-
-  // Show confirmation popup for specific actions
-  function showConfirmationOnAction(event) {
-    event.stopPropagation();
-    showConfirmationPopup();
-  }
-
-  // Add event listeners
-  createProjectButton.addEventListener("click", showProjectPopup);
-  createProjectButtonForm.addEventListener("click", handleCreateProject);
-  closeProjectPopupButton.addEventListener("click", showConfirmationOnAction);
-  cancelProjectButton.addEventListener("click", showConfirmationOnAction);
-
-  projectPopupOverlay.addEventListener("click", (event) => {
-    if (event.target === projectPopupOverlay) {
-      showConfirmationPopup();
-    }
-  });
-
-  // Optional: Handle dynamic line updates on window resize
-  window.addEventListener("resize", createOrUpdateDynamicLine);
-}
diff --git a/client/components/settings.js b/client/components/settings.js
deleted file mode 100644
index 82b45c4..0000000
--- a/client/components/settings.js
+++ /dev/null
@@ -1,16 +0,0 @@
-export function SettingsPopup() {
-  const settingsIcon = document.getElementById("settings-icon");
-  const settingsPopup = document.getElementById("settings-popup");
-
-  settingsIcon.addEventListener("click", (event) => {
-    event.stopPropagation();
-    settingsPopup.style.display =
-      settingsPopup.style.display === "none" || settingsPopup.style.display === "" ? "flex" : "none";
-  });
-
-  document.addEventListener("click", (event) => {
-    if (!settingsIcon.contains(event.target) && !settingsPopup.contains(event.target)) {
-      settingsPopup.style.display = "none";
-    }
-  });
-}
\ No newline at end of file
diff --git a/client/components/task.js b/client/components/task.js
deleted file mode 100644
index 52c7e89..0000000
--- a/client/components/task.js
+++ /dev/null
@@ -1,178 +0,0 @@
-import { TaskLabel } from "./taskLabel.js";
-import { Member } from "./member.js";
-import { ConfirmationPopup } from "./confirmationPopup.js";
-
-export function Task() {
-  // DOM References
-  const taskPopupOverlay = document.getElementById("task-popup-overlay");
-  const closeTaskPopupButton = document.getElementById("close-task-popup-button");
-  const cancelTaskButton = document.getElementById("cancel-task-button");
-  const addTaskForm = document.getElementById("add-task-form");
-  const fileContainer = document.getElementById("file-container");
-  const addMemberButton = document.getElementById("add-member-button");
-  const startDateButton = document.getElementById("start-date-button");
-  const dueDateButton = document.getElementById("due-date-button");
-  const setLabelButton = document.getElementById("set-label-button");
-  const reminderInput = document.getElementById("reminder");
-
-  const { showConfirmationPopup, hideConfirmationPopup } = ConfirmationPopup();
-
-  const projectMembers = [
-    { id: "1", name: "Alice", profilePicture: "https://via.placeholder.com/40" },
-    { id: "2", name: "Bob", profilePicture: "https://via.placeholder.com/40" },
-    { id: "3", name: "Charlie", profilePicture: "https://via.placeholder.com/40" },
-  ];
-
-  const { showMemberPopup } = Member(projectMembers);
-  const { showLabelPopup } = TaskLabel();
-
-  let uploadedFiles = [];
-  let taskData = {};
-  document.getElementById("task-popup-content").style.height = "75vh";
-
-  // Show Task Popup
-  function showTaskPopup() {
-    taskPopupOverlay.classList.remove("hidden");
-  }
-
-  // Close Task Popup with Confirmation
-  function closeTaskPopupWithConfirmation() {
-    showConfirmationPopup();
-
-    // Attach event listener to confirm button in confirmation popup
-    const discardButton = document.querySelector("#discard-button");
-    discardButton.addEventListener("click", () => {
-      closeTaskPopup(); // Close the popup and reset the inputs
-      hideConfirmationPopup(); // Hide the confirmation popup
-    });
-
-    // Cancel button simply hides the confirmation popup
-    const cancelDiscardButton = document.querySelector("#cancel-discard-button");
-    cancelDiscardButton.addEventListener("click", () => {
-      hideConfirmationPopup();
-    });
-  }
-
-  // Close Task Popup (without confirmation, for confirmed discard)
-  function closeTaskPopup() {
-    taskPopupOverlay.classList.add("hidden");
-    resetTaskPopupInputs(); // Reset all inputs
-  }
-
-  // Reset Task Popup Inputs
-  function resetTaskPopupInputs() {
-    if (addTaskForm) addTaskForm.reset();
-
-    // Clear file container
-    fileContainer.innerHTML = "";
-
-    // Restore "Add File" button
-    const addFileButtonElement = document.createElement("button");
-    addFileButtonElement.id = "add-file-button";
-    addFileButtonElement.type = "button";
-    addFileButtonElement.textContent = "+ add file";
-    addFileButtonElement.classList.add("file-button-class");
-
-    fileContainer.appendChild(addFileButtonElement);
-    initializeFileHandler(addFileButtonElement);
-
-    // Reset date and label buttons
-    startDateButton.textContent = "dd/mm/yy";
-    startDateButton.style.backgroundColor = "";
-    startDateButton.style.color = "#949AA0";
-
-    dueDateButton.textContent = "dd/mm/yy";
-    dueDateButton.style.backgroundColor = "";
-    dueDateButton.style.color = "#949AA0";
-
-    setLabelButton.textContent = "set label";
-    setLabelButton.style.backgroundColor = "";
-    setLabelButton.style.color = "#949AA0";
-
-    addMemberButton.textContent = "+ add member";
-    addMemberButton.style.backgroundColor = "";
-    addMemberButton.style.color = "#949AA0";
-
-    uploadedFiles = [];
-    taskData = {};
-  }
-
-  // Initialize File Handling Logic
-  function initializeFileHandler(button) {
-    const fileInput = document.createElement("input");
-    fileInput.type = "file";
-    fileInput.style.display = "none";
-
-    button.addEventListener("click", () => {
-      fileInput.value = "";
-      fileInput.click();
-    });
-
-    fileInput.addEventListener("change", (event) => {
-      const file = event.target.files[0];
-      if (file) {
-        displayFile(file);
-      }
-    });
-
-    fileContainer.appendChild(fileInput);
-  }
-
-  // Display Selected File
-  function displayFile(file) {
-    uploadedFiles.push(file);
-
-    const fileDisplay = document.createElement("div");
-    fileDisplay.classList.add("file-display");
-    fileDisplay.innerHTML = `
-      <span class="file-name">${file.name}</span>
-      <button class="remove-file-button">X</button>
-    `;
-
-    const removeButton = fileDisplay.querySelector(".remove-file-button");
-    removeButton.addEventListener("click", () => {
-      uploadedFiles = uploadedFiles.filter((f) => f !== file);
-      fileDisplay.remove();
-    });
-
-    fileContainer.appendChild(fileDisplay);
-  }
-
-  // Restrict Reminder Input to Numbers Only
-  reminderInput.addEventListener("input", () => {
-    reminderInput.value = reminderInput.value.replace(/\D/g, "");
-    if (parseInt(reminderInput.value) > 100) {
-      reminderInput.value = "99";
-    }
-  });
-
-  reminderInput.addEventListener("blur", () => {
-    if (!reminderInput.value || parseInt(reminderInput.value) <= 0) {
-      reminderInput.value = "";
-    }
-  });
-
-  // Attach Event Listeners
-  closeTaskPopupButton.addEventListener("click", closeTaskPopupWithConfirmation);
-  cancelTaskButton.addEventListener("click", closeTaskPopupWithConfirmation);
-
-  taskPopupOverlay.addEventListener("click", (event) => {
-    if (event.target === taskPopupOverlay) {
-      closeTaskPopupWithConfirmation();
-    }
-  });
-
-  // Show Label Popup when setLabelButton is clicked
-  setLabelButton.addEventListener("click", () => {
-    showLabelPopup();
-  });
-
-  // Show Member Popup when addMemberButton is clicked
-  addMemberButton.addEventListener("click", () => {
-    console.log("Add member button clicked.");
-    showMemberPopup();
-  });
-
-  console.log("Task module initialized.");
-  resetTaskPopupInputs();
-}
diff --git a/client/components/taskLabel.js b/client/components/taskLabel.js
deleted file mode 100644
index d24e865..0000000
--- a/client/components/taskLabel.js
+++ /dev/null
@@ -1,80 +0,0 @@
-export function TaskLabel() {
-  const labelPopup = document.getElementById("label-popup");
-  const doneLabelButton = document.getElementById("done-label-button");
-  const labelOptions = document.querySelectorAll(".label-option");
-  const setLabelButton = document.getElementById("set-label-button");
-
-  let selectedColorButton = null; // Track the currently selected color button
-
-  // Show the Label Popup
-  function showLabelPopup() {
-    if (labelPopup) {
-      labelPopup.style.display = "block"; // Show the popup
-      labelPopup.classList.remove("hidden");
-      console.log("Showing label popup.");
-      console.log(labelPopup);
-    } else {
-      console.error("Label popup element not found.");
-    }
-  }
-
-  // Hide the Label Popup
-  function hideLabelPopup() {
-    if (labelPopup) {
-      labelPopup.style.display = "none"; // Hide the popup
-    }
-  }
-
-  // Handle Label Selection
-  labelOptions.forEach((button) => {
-    button.addEventListener("click", () => {
-      // Clear the previous selection
-      if (selectedColorButton) {
-        selectedColorButton.innerHTML = ""; // Remove the checkmark
-      }
-
-      // Mark the clicked button as selected
-      selectedColorButton = button;
-      button.innerHTML = "✓"; // Add the checkmark symbol
-
-      console.log("Selected color:", button.getAttribute("data-color"));
-    });
-  });
-
-  // Handle Done Button Click
-  doneLabelButton.addEventListener("click", () => {
-    if (selectedColorButton) {
-      const selectedColor = selectedColorButton.getAttribute("data-color");
-
-    // Update the "set-label-button" with the selected color
-    setLabelButton.style.backgroundColor = selectedColor;
-    setLabelButton.style.border = "none"; // Remove border for a clean look
-    setLabelButton.textContent = ""; // Clear any existing text
-
-    // Ensure the button retains its original size
-    setLabelButton.style.width = "27%"; // Adjust width as needed
-    setLabelButton.style.height = "35%";
-    setLabelButton.style.borderRadius = "12px"; // Optional: add rounded corners
-    setLabelButton.style.border = "1px solid #949AA0"; // Optional: add border to the button
-
-      hideLabelPopup(); // Close the popup
-    } else {
-      alert("Please select a color before clicking 'Done'.");
-    }
-  });
-
-  // Hide the popup on outside click
-  document.addEventListener("click", (event) => {
-    if (
-      labelPopup &&
-      !labelPopup.contains(event.target) &&
-      event.target.id !== "set-label-button"
-    ) {
-      hideLabelPopup();
-    }
-  });
-
-  return {
-    showLabelPopup,
-  };
-}
diff --git a/client/style.css b/client/index.css
similarity index 77%
rename from client/style.css
rename to client/index.css
index 540558a..a022dc7 100644
--- a/client/style.css
+++ b/client/index.css
@@ -1,4 +1,4 @@
-/* style.css */
+/* index.css */
 :root {
   font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
   line-height: 1.5;
@@ -14,16 +14,6 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-a {
-  font-weight: 500;
-  color: #646cff;
-  text-decoration: inherit;
-}
-
-a:hover {
-  color: #535bf2;
-}
-
 body {
   margin: 0;
   display: flex;
@@ -48,21 +38,6 @@ h1 {
   text-align: left;
 }
 
-.logo {
-  height: 6em;
-  padding: 1.5em;
-  will-change: filter;
-  transition: filter 300ms;
-}
-
-.logo:hover {
-  filter: drop-shadow(0 0 2em #646cffaa);
-}
-
-.logo.vanilla:hover {
-  filter: drop-shadow(0 0 2em #f7df1eaa);
-}
-
 button {
   border-radius: 8px;
   border: 1px solid transparent;
@@ -75,28 +50,6 @@ button {
   transition: border-color 0.25s;
 }
 
-button:hover {
-  border-color: #646cff;
-}
-
-button:focus,
-button:focus-visible {
-  outline: 4px auto -webkit-focus-ring-color;
-}
-
-@media (prefers-color-scheme: light) {
-  :root {
-    color: #213547;
-    background-color: #ffffff;
-  }
-  a:hover {
-    color: #747bff;
-  }
-  button {
-    background-color: #f9f9f9;
-  }
-}
-
 /* Ensure the entire area is clickable */
 #tasks-checkbox {
   position: fixed;
diff --git a/client/index.html b/client/index.html
index e77f5d6..320bc32 100644
--- a/client/index.html
+++ b/client/index.html
@@ -1,30 +1,11 @@
 <!DOCTYPE html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Planify</title>
-  
-  <!-- Specific styles for different components -->
-  <link rel="stylesheet" href="styles/board.css">
-  <link rel="stylesheet" href="styles/calendar.css">
-  <link rel="stylesheet" href="styles/confirmation.css">
-  <link rel="stylesheet" href="styles/label.css">
-  <link rel="stylesheet" href="styles/popup.css">
-  <link rel="stylesheet" href="styles/sidebar.css">
-  <link rel="stylesheet" href="styles/project.css">
-  <link rel="stylesheet" href="styles/list.css">
-  <link rel="stylesheet" href="styles/task.css">
-  <link rel="stylesheet" href="styles/settings.css">
-  <link rel="stylesheet" href="./style.css">
-  <link rel="stylesheet" href="styles/member.css">
-  
-</head>
-<body>
-  <div id="app"></div>
-
-  <!-- Including the necessary JS files -->
-  <script type="module" src="main.js"></script>
-  
-</body>
-</html>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./index.jsx"></script>
+  </body>
+</html>
\ No newline at end of file
diff --git a/client/index.jsx b/client/index.jsx
new file mode 100644
index 0000000..c727aed
--- /dev/null
+++ b/client/index.jsx
@@ -0,0 +1,13 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';  // Correct import for React 18+
+import App from './App';
+import { MemoryRouter ,Routes ,Route} from 'react-router-dom';
+import './index.css';
+
+const root = document.getElementById('root');
+const rootElement = ReactDOM.createRoot(root);  // Use the correct method
+rootElement.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);
diff --git a/client/main.js b/client/main.js
deleted file mode 100644
index ddbafab..0000000
--- a/client/main.js
+++ /dev/null
@@ -1,92 +0,0 @@
-  import { DiscordSDK } from "@discord/embedded-app-sdk";
-  import { Interface } from "./components/interface.js";
-  import { Calendar } from "./components/calendar.js";
-  import { Task } from "./components/task.js";
-  import { Board } from "./components/board.js";
-  import { SettingsPopup } from "./components/settings.js";
-  import { ProjectPopup } from "./components/projectPopup.js";
-  import { ConfirmationPopup } from "./components/confirmationPopup.js";
-  import { TaskLabel } from "./components/taskLabel.js";
-  import { BoardProject } from "./components/boardproject.js";
-  import { List } from "./components/list.js";
-  import { Member } from "./components/member.js";
-
-  import "./style.css";
-
-  const discordSdk = new DiscordSDK(import.meta.env.VITE_DISCORD_CLIENT_ID);
-  let user = {};
-
-  // Setup the Discord SDK
-  async function setupDiscordSdk() {
-    try {
-      await discordSdk.ready();
-      console.log("Discord SDK is ready");
-
-      const { code } = await discordSdk.commands.authorize({
-        client_id: import.meta.env.VITE_DISCORD_CLIENT_ID,
-        response_type: "code",
-        state: "",
-        prompt: "none",
-        scope: ["identify", "guilds", "applications.commands"],
-      });
-
-      const response = await fetch("/.proxy/api/token", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ code }),
-      });
-
-      const { access_token } = await response.json();
-      await discordSdk.commands.authenticate({ access_token });
-
-      const userProfile = await fetchUserProfile(access_token);
-      user = {
-        username: userProfile.username,
-        avatarUrl: `https://cdn.discordapp.com/avatars/${userProfile.id}/${userProfile.avatar}.png`,
-      };
-
-      renderApp();
-    } catch (error) {
-      console.error("Error setting up Discord SDK:", error);
-    }
-  }
-
-  // Fetch user profile from Discord API
-  async function fetchUserProfile(token) {
-    const response = await fetch("https://discord.com/api/users/@me", {
-      headers: { Authorization: `Bearer ${token}` },
-    });
-
-    if (!response.ok) {
-      throw new Error("Failed to fetch user profile");
-    }
-
-    return await response.json();
-  }
-
-  // Main render function
-  function renderApp() {
-    try {
-      document.querySelector("#app").innerHTML = Interface(user);
-
-      // Initialize all components
-      console.log("Initializing components...");
-      Calendar();
-      Task();
-      Board();
-      SettingsPopup();
-      ProjectPopup();
-      ConfirmationPopup();
-      TaskLabel();
-      BoardProject();
-      List();
-      Member();
-
-      console.log("Components initialized successfully.");
-    } catch (error) {
-      console.error("Error during app rendering:", error);
-    }
-  }
-
-  // Start the Discord SDK setup
-  setupDiscordSdk().catch(console.error);
\ No newline at end of file
diff --git a/client/package-lock.json b/client/package-lock.json
index a24fe01..b4d959c 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -9,11 +9,301 @@
       "version": "0.0.0",
       "dependencies": {
         "@discord/embedded-app-sdk": "^1.9.0",
-        "flatpickr": "^4.6.13",
-        "pikaday": "^1.8.2"
+        "crypto": "^1.0.1",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1",
+        "react-router-dom": "^7.1.3",
+        "uuid": "^11.0.5"
       },
       "devDependencies": {
-        "vite": "^5.4.14"
+        "@vitejs/plugin-react": "^4.3.4",
+        "vite": "^6.0.11"
+      }
+    },
+    "node_modules/@ampproject/remapping": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
+      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@babel/code-frame": {
+      "version": "7.26.2",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.26.2.tgz",
+      "integrity": "sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-validator-identifier": "^7.25.9",
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/compat-data": {
+      "version": "7.26.5",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.26.5.tgz",
+      "integrity": "sha512-XvcZi1KWf88RVbF9wn8MN6tYFloU5qX8KjuF3E1PVBmJ9eypXfs4GRiJwLuTZL0iSnJUKn1BFPa5BPZZJyFzPg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/core": {
+      "version": "7.26.7",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.7.tgz",
+      "integrity": "sha512-SRijHmF0PSPgLIBYlWnG0hyeJLwXE2CgpsXaMOrtt2yp9/86ALw6oUlj9KYuZ0JN07T4eBMVIW4li/9S1j2BGA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@ampproject/remapping": "^2.2.0",
+        "@babel/code-frame": "^7.26.2",
+        "@babel/generator": "^7.26.5",
+        "@babel/helper-compilation-targets": "^7.26.5",
+        "@babel/helper-module-transforms": "^7.26.0",
+        "@babel/helpers": "^7.26.7",
+        "@babel/parser": "^7.26.7",
+        "@babel/template": "^7.25.9",
+        "@babel/traverse": "^7.26.7",
+        "@babel/types": "^7.26.7",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
+      }
+    },
+    "node_modules/@babel/generator": {
+      "version": "7.26.5",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.5.tgz",
+      "integrity": "sha512-2caSP6fN9I7HOe6nqhtft7V4g7/V/gfDsC3Ag4W7kEzzvRGKqiv0pu0HogPiZ3KaVSoNDhUws6IJjDjpfmYIXw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.26.5",
+        "@babel/types": "^7.26.5",
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.25",
+        "jsesc": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets": {
+      "version": "7.26.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.26.5.tgz",
+      "integrity": "sha512-IXuyn5EkouFJscIDuFF5EsiSolseme1s0CZB+QxVugqJLYmKdxI1VfIBOst0SUu4rnk2Z7kqTwmoO1lp3HIfnA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/compat-data": "^7.26.5",
+        "@babel/helper-validator-option": "^7.25.9",
+        "browserslist": "^4.24.0",
+        "lru-cache": "^5.1.1",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-imports": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.25.9.tgz",
+      "integrity": "sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/traverse": "^7.25.9",
+        "@babel/types": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-transforms": {
+      "version": "7.26.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.26.0.tgz",
+      "integrity": "sha512-xO+xu6B5K2czEnQye6BHA7DolFFmS3LB7stHZFaOLb1pAwO1HWLS8fXA+eh0A2yIvltPVmx3eNNDBJA2SLHXFw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-module-imports": "^7.25.9",
+        "@babel/helper-validator-identifier": "^7.25.9",
+        "@babel/traverse": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/helper-plugin-utils": {
+      "version": "7.26.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.26.5.tgz",
+      "integrity": "sha512-RS+jZcRdZdRFzMyr+wcsaqOmld1/EqTghfaBGQQd/WnRdzdlvSZ//kF7U8VQTxf1ynZ4cjUcYgjVGx13ewNPMg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-string-parser": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
+      "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-identifier": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
+      "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-option": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.25.9.tgz",
+      "integrity": "sha512-e/zv1co8pp55dNdEcCynfj9X7nyUKUXoUEwfXqaZt0omVOmDe9oOTdKStH4GmAw6zxMFs50ZayuMfHDKlO7Tfw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helpers": {
+      "version": "7.26.7",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.7.tgz",
+      "integrity": "sha512-8NHiL98vsi0mbPQmYAGWwfcFaOy4j2HY49fXJCfuDcdE7fMIsH9a7GdaeXpIBsbT7307WU8KCMp5pUVDNL4f9A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/template": "^7.25.9",
+        "@babel/types": "^7.26.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/parser": {
+      "version": "7.26.7",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.7.tgz",
+      "integrity": "sha512-kEvgGGgEjRUutvdVvZhbn/BxVt+5VSpwXz1j3WYXQbXDo8KzFOPNG2GQbdAiNq8g6wn1yKk7C/qrke03a84V+w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.26.7"
+      },
+      "bin": {
+        "parser": "bin/babel-parser.js"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-self": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.25.9.tgz",
+      "integrity": "sha512-y8quW6p0WHkEhmErnfe58r7x0A70uKphQm8Sp8cV7tjNQwK56sNVK0M73LK3WuYmsuyrftut4xAkjjgU0twaMg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-source": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.25.9.tgz",
+      "integrity": "sha512-+iqjT8xmXhhYv4/uiYd8FNQsraMFZIfxVSqxxVSZP0WbbSAWvBXAul0m/zu+7Vv4O/3WtApy9pmaTMiumEZgfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/template": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.25.9.tgz",
+      "integrity": "sha512-9DGttpmPvIxBb/2uwpVo3dqJ+O6RooAFOS+lB+xDqoE2PVCE8nfoHMdZLpfCQRLwvohzXISPZcgxt80xLfsuwg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.25.9",
+        "@babel/parser": "^7.25.9",
+        "@babel/types": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/traverse": {
+      "version": "7.26.7",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.7.tgz",
+      "integrity": "sha512-1x1sgeyRLC3r5fQOM0/xtQKsYjyxmFjaOrLJNtZ81inNjyJHGIolTULPiSc/2qe1/qfpFLisLQYFnnZl7QoedA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.26.2",
+        "@babel/generator": "^7.26.5",
+        "@babel/parser": "^7.26.7",
+        "@babel/template": "^7.25.9",
+        "@babel/types": "^7.26.7",
+        "debug": "^4.3.1",
+        "globals": "^11.1.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/types": {
+      "version": "7.26.7",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.7.tgz",
+      "integrity": "sha512-t8kDRGrKXyp6+tjUh7hw2RLyclsW4TRoRvRHtSyAX9Bb5ldlFh+90YAYY6awRXrlB4G5G2izNeGySpATlFzmOg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-string-parser": "^7.25.9",
+        "@babel/helper-validator-identifier": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
       }
     },
     "node_modules/@discord/embedded-app-sdk": {
@@ -32,10 +322,23 @@
         "zod": "^3.9.8"
       }
     },
+    "node_modules/@discord/embedded-app-sdk/node_modules/uuid": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/@esbuild/aix-ppc64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
-      "integrity": "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.24.2.tgz",
+      "integrity": "sha512-thpVCb/rhxE/BnMLQ7GReQLLN8q9qbHmI55F4489/ByVg2aQaQ6kbcLb6FHkocZzQhxc4gx0sCk0tJkKBFzDhA==",
       "cpu": [
         "ppc64"
       ],
@@ -46,13 +349,13 @@
         "aix"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/android-arm": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz",
-      "integrity": "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.24.2.tgz",
+      "integrity": "sha512-tmwl4hJkCfNHwFB3nBa8z1Uy3ypZpxqxfTQOcHX+xRByyYgunVbZ9MzUUfb0RxaHIMnbHagwAxuTL+tnNM+1/Q==",
       "cpu": [
         "arm"
       ],
@@ -63,13 +366,13 @@
         "android"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/android-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz",
-      "integrity": "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.24.2.tgz",
+      "integrity": "sha512-cNLgeqCqV8WxfcTIOeL4OAtSmL8JjcN6m09XIgro1Wi7cF4t/THaWEa7eL5CMoMBdjoHOTh/vwTO/o2TRXIyzg==",
       "cpu": [
         "arm64"
       ],
@@ -80,13 +383,13 @@
         "android"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/android-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz",
-      "integrity": "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.24.2.tgz",
+      "integrity": "sha512-B6Q0YQDqMx9D7rvIcsXfmJfvUYLoP722bgfBlO5cGvNVb5V/+Y7nhBE3mHV9OpxBf4eAS2S68KZztiPaWq4XYw==",
       "cpu": [
         "x64"
       ],
@@ -97,13 +400,13 @@
         "android"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz",
-      "integrity": "sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.24.2.tgz",
+      "integrity": "sha512-kj3AnYWc+CekmZnS5IPu9D+HWtUI49hbnyqk0FLEJDbzCIQt7hg7ucF1SQAilhtYpIujfaHr6O0UHlzzSPdOeA==",
       "cpu": [
         "arm64"
       ],
@@ -114,13 +417,13 @@
         "darwin"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/darwin-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz",
-      "integrity": "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.24.2.tgz",
+      "integrity": "sha512-WeSrmwwHaPkNR5H3yYfowhZcbriGqooyu3zI/3GGpF8AyUdsrrP0X6KumITGA9WOyiJavnGZUwPGvxvwfWPHIA==",
       "cpu": [
         "x64"
       ],
@@ -131,13 +434,13 @@
         "darwin"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz",
-      "integrity": "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.24.2.tgz",
+      "integrity": "sha512-UN8HXjtJ0k/Mj6a9+5u6+2eZ2ERD7Edt1Q9IZiB5UZAIdPnVKDoG7mdTVGhHJIeEml60JteamR3qhsr1r8gXvg==",
       "cpu": [
         "arm64"
       ],
@@ -148,13 +451,13 @@
         "freebsd"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz",
-      "integrity": "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.24.2.tgz",
+      "integrity": "sha512-TvW7wE/89PYW+IevEJXZ5sF6gJRDY/14hyIGFXdIucxCsbRmLUcjseQu1SyTko+2idmCw94TgyaEZi9HUSOe3Q==",
       "cpu": [
         "x64"
       ],
@@ -165,13 +468,13 @@
         "freebsd"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-arm": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz",
-      "integrity": "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.24.2.tgz",
+      "integrity": "sha512-n0WRM/gWIdU29J57hJyUdIsk0WarGd6To0s+Y+LwvlC55wt+GT/OgkwoXCXvIue1i1sSNWblHEig00GBWiJgfA==",
       "cpu": [
         "arm"
       ],
@@ -182,13 +485,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz",
-      "integrity": "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.24.2.tgz",
+      "integrity": "sha512-7HnAD6074BW43YvvUmE/35Id9/NB7BeX5EoNkK9obndmZBUk8xmJJeU7DwmUeN7tkysslb2eSl6CTrYz6oEMQg==",
       "cpu": [
         "arm64"
       ],
@@ -199,13 +502,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-ia32": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz",
-      "integrity": "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.24.2.tgz",
+      "integrity": "sha512-sfv0tGPQhcZOgTKO3oBE9xpHuUqguHvSo4jl+wjnKwFpapx+vUDcawbwPNuBIAYdRAvIDBfZVvXprIj3HA+Ugw==",
       "cpu": [
         "ia32"
       ],
@@ -216,13 +519,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-loong64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz",
-      "integrity": "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.24.2.tgz",
+      "integrity": "sha512-CN9AZr8kEndGooS35ntToZLTQLHEjtVB5n7dl8ZcTZMonJ7CCfStrYhrzF97eAecqVbVJ7APOEe18RPI4KLhwQ==",
       "cpu": [
         "loong64"
       ],
@@ -233,13 +536,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz",
-      "integrity": "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.24.2.tgz",
+      "integrity": "sha512-iMkk7qr/wl3exJATwkISxI7kTcmHKE+BlymIAbHO8xanq/TjHaaVThFF6ipWzPHryoFsesNQJPE/3wFJw4+huw==",
       "cpu": [
         "mips64el"
       ],
@@ -250,13 +553,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz",
-      "integrity": "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.24.2.tgz",
+      "integrity": "sha512-shsVrgCZ57Vr2L8mm39kO5PPIb+843FStGt7sGGoqiiWYconSxwTiuswC1VJZLCjNiMLAMh34jg4VSEQb+iEbw==",
       "cpu": [
         "ppc64"
       ],
@@ -267,13 +570,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz",
-      "integrity": "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.24.2.tgz",
+      "integrity": "sha512-4eSFWnU9Hhd68fW16GD0TINewo1L6dRrB+oLNNbYyMUAeOD2yCK5KXGK1GH4qD/kT+bTEXjsyTCiJGHPZ3eM9Q==",
       "cpu": [
         "riscv64"
       ],
@@ -284,13 +587,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-s390x": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz",
-      "integrity": "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.24.2.tgz",
+      "integrity": "sha512-S0Bh0A53b0YHL2XEXC20bHLuGMOhFDO6GN4b3YjRLK//Ep3ql3erpNcPlEFed93hsQAjAQDNsvcK+hV90FubSw==",
       "cpu": [
         "s390x"
       ],
@@ -301,13 +604,13 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz",
-      "integrity": "sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.24.2.tgz",
+      "integrity": "sha512-8Qi4nQcCTbLnK9WoMjdC9NiTG6/E38RNICU6sUNqK0QFxCYgoARqVqxdFmWkdonVsvGqWhmm7MO0jyTqLqwj0Q==",
       "cpu": [
         "x64"
       ],
@@ -318,13 +621,30 @@
         "linux"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-arm64": {
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.24.2.tgz",
+      "integrity": "sha512-wuLK/VztRRpMt9zyHSazyCVdCXlpHkKm34WUyinD2lzK07FAHTq0KQvZZlXikNWkDGoT6x3TD51jKQ7gMVpopw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz",
-      "integrity": "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.24.2.tgz",
+      "integrity": "sha512-VefFaQUc4FMmJuAxmIHgUmfNiLXY438XrL4GDNV1Y1H/RW3qow68xTwjZKfj/+Plp9NANmzbH5R40Meudu8mmw==",
       "cpu": [
         "x64"
       ],
@@ -335,13 +655,30 @@
         "netbsd"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-arm64": {
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.24.2.tgz",
+      "integrity": "sha512-YQbi46SBct6iKnszhSvdluqDmxCJA+Pu280Av9WICNwQmMxV7nLRHZfjQzwbPs3jeWnuAhE9Jy0NrnJ12Oz+0A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
-      "integrity": "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.24.2.tgz",
+      "integrity": "sha512-+iDS6zpNM6EnJyWv0bMGLWSWeXGN/HTaF/LXHXHwejGsVi+ooqDfMCCTerNFxEkM3wYVcExkeGXNqshc9iMaOA==",
       "cpu": [
         "x64"
       ],
@@ -352,13 +689,13 @@
         "openbsd"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/sunos-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz",
-      "integrity": "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.24.2.tgz",
+      "integrity": "sha512-hTdsW27jcktEvpwNHJU4ZwWFGkz2zRJUz8pvddmXPtXDzVKTTINmlmga3ZzwcuMpUvLw7JkLy9QLKyGpD2Yxig==",
       "cpu": [
         "x64"
       ],
@@ -369,13 +706,13 @@
         "sunos"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/win32-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz",
-      "integrity": "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.24.2.tgz",
+      "integrity": "sha512-LihEQ2BBKVFLOC9ZItT9iFprsE9tqjDjnbulhHoFxYQtQfai7qfluVODIYxt1PgdoyQkz23+01rzwNwYfutxUQ==",
       "cpu": [
         "arm64"
       ],
@@ -386,13 +723,13 @@
         "win32"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/win32-ia32": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz",
-      "integrity": "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.24.2.tgz",
+      "integrity": "sha512-q+iGUwfs8tncmFC9pcnD5IvRHAzmbwQ3GPS5/ceCyHdjXubwQWI12MKWSNSMYLJMq23/IUCvJMS76PDqXe1fxA==",
       "cpu": [
         "ia32"
       ],
@@ -403,13 +740,13 @@
         "win32"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@esbuild/win32-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz",
-      "integrity": "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.24.2.tgz",
+      "integrity": "sha512-7VTgWzgMGvup6aSqDPLiW5zHaxYJGTO4OokMjIlrCtf+VpEL+cXKtCvg723iguPYI5oaUNdS+/V7OU2gvXVWEg==",
       "cpu": [
         "x64"
       ],
@@ -420,13 +757,66 @@
         "win32"
       ],
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
+      }
+    },
+    "node_modules/@jridgewell/gen-mapping": {
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz",
+      "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/set-array": "^1.2.1",
+        "@jridgewell/sourcemap-codec": "^1.4.10",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/resolve-uri": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/set-array": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
+      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/sourcemap-codec": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
+      "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.25",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
+      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/resolve-uri": "^3.1.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.30.1.tgz",
-      "integrity": "sha512-pSWY+EVt3rJ9fQ3IqlrEUtXh3cGqGtPDH1FQlNZehO2yYxCHEX1SPsz1M//NXwYfbTlcKr9WObLnJX9FsS9K1Q==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.32.0.tgz",
+      "integrity": "sha512-G2fUQQANtBPsNwiVFg4zKiPQyjVKZCUdQUol53R8E71J7AsheRMV/Yv/nB8giOcOVqP7//eB5xPqieBYZe9bGg==",
       "cpu": [
         "arm"
       ],
@@ -438,9 +828,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.30.1.tgz",
-      "integrity": "sha512-/NA2qXxE3D/BRjOJM8wQblmArQq1YoBVJjrjoTSBS09jgUisq7bqxNHJ8kjCHeV21W/9WDGwJEWSN0KQ2mtD/w==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.32.0.tgz",
+      "integrity": "sha512-qhFwQ+ljoymC+j5lXRv8DlaJYY/+8vyvYmVx074zrLsu5ZGWYsJNLjPPVJJjhZQpyAKUGPydOq9hRLLNvh1s3A==",
       "cpu": [
         "arm64"
       ],
@@ -452,9 +842,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.30.1.tgz",
-      "integrity": "sha512-r7FQIXD7gB0WJ5mokTUgUWPl0eYIH0wnxqeSAhuIwvnnpjdVB8cRRClyKLQr7lgzjctkbp5KmswWszlwYln03Q==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.32.0.tgz",
+      "integrity": "sha512-44n/X3lAlWsEY6vF8CzgCx+LQaoqWGN7TzUfbJDiTIOjJm4+L2Yq+r5a8ytQRGyPqgJDs3Rgyo8eVL7n9iW6AQ==",
       "cpu": [
         "arm64"
       ],
@@ -466,9 +856,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.30.1.tgz",
-      "integrity": "sha512-x78BavIwSH6sqfP2xeI1hd1GpHL8J4W2BXcVM/5KYKoAD3nNsfitQhvWSw+TFtQTLZ9OmlF+FEInEHyubut2OA==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.32.0.tgz",
+      "integrity": "sha512-F9ct0+ZX5Np6+ZDztxiGCIvlCaW87HBdHcozUfsHnj1WCUTBUubAoanhHUfnUHZABlElyRikI0mgcw/qdEm2VQ==",
       "cpu": [
         "x64"
       ],
@@ -480,9 +870,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-arm64": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.30.1.tgz",
-      "integrity": "sha512-HYTlUAjbO1z8ywxsDFWADfTRfTIIy/oUlfIDmlHYmjUP2QRDTzBuWXc9O4CXM+bo9qfiCclmHk1x4ogBjOUpUQ==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.32.0.tgz",
+      "integrity": "sha512-JpsGxLBB2EFXBsTLHfkZDsXSpSmKD3VxXCgBQtlPcuAqB8TlqtLcbeMhxXQkCDv1avgwNjF8uEIbq5p+Cee0PA==",
       "cpu": [
         "arm64"
       ],
@@ -494,9 +884,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-x64": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.30.1.tgz",
-      "integrity": "sha512-1MEdGqogQLccphhX5myCJqeGNYTNcmTyaic9S7CG3JhwuIByJ7J05vGbZxsizQthP1xpVx7kd3o31eOogfEirw==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.32.0.tgz",
+      "integrity": "sha512-wegiyBT6rawdpvnD9lmbOpx5Sph+yVZKHbhnSP9MqUEDX08G4UzMU+D87jrazGE7lRSyTRs6NEYHtzfkJ3FjjQ==",
       "cpu": [
         "x64"
       ],
@@ -508,9 +898,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.30.1.tgz",
-      "integrity": "sha512-PaMRNBSqCx7K3Wc9QZkFx5+CX27WFpAMxJNiYGAXfmMIKC7jstlr32UhTgK6T07OtqR+wYlWm9IxzennjnvdJg==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.32.0.tgz",
+      "integrity": "sha512-3pA7xecItbgOs1A5H58dDvOUEboG5UfpTq3WzAdF54acBbUM+olDJAPkgj1GRJ4ZqE12DZ9/hNS2QZk166v92A==",
       "cpu": [
         "arm"
       ],
@@ -522,9 +912,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-musleabihf": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.30.1.tgz",
-      "integrity": "sha512-B8Rcyj9AV7ZlEFqvB5BubG5iO6ANDsRKlhIxySXcF1axXYUyqwBok+XZPgIYGBgs7LDXfWfifxhw0Ik57T0Yug==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.32.0.tgz",
+      "integrity": "sha512-Y7XUZEVISGyge51QbYyYAEHwpGgmRrAxQXO3siyYo2kmaj72USSG8LtlQQgAtlGfxYiOwu+2BdbPjzEpcOpRmQ==",
       "cpu": [
         "arm"
       ],
@@ -536,9 +926,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.30.1.tgz",
-      "integrity": "sha512-hqVyueGxAj3cBKrAI4aFHLV+h0Lv5VgWZs9CUGqr1z0fZtlADVV1YPOij6AhcK5An33EXaxnDLmJdQikcn5NEw==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.32.0.tgz",
+      "integrity": "sha512-r7/OTF5MqeBrZo5omPXcTnjvv1GsrdH8a8RerARvDFiDwFpDVDnJyByYM/nX+mvks8XXsgPUxkwe/ltaX2VH7w==",
       "cpu": [
         "arm64"
       ],
@@ -550,9 +940,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.30.1.tgz",
-      "integrity": "sha512-i4Ab2vnvS1AE1PyOIGp2kXni69gU2DAUVt6FSXeIqUCPIR3ZlheMW3oP2JkukDfu3PsexYRbOiJrY+yVNSk9oA==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.32.0.tgz",
+      "integrity": "sha512-HJbifC9vex9NqnlodV2BHVFNuzKL5OnsV2dvTw6e1dpZKkNjPG6WUq+nhEYV6Hv2Bv++BXkwcyoGlXnPrjAKXw==",
       "cpu": [
         "arm64"
       ],
@@ -564,9 +954,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-loongarch64-gnu": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.30.1.tgz",
-      "integrity": "sha512-fARcF5g296snX0oLGkVxPmysetwUk2zmHcca+e9ObOovBR++9ZPOhqFUM61UUZ2EYpXVPN1redgqVoBB34nTpQ==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.32.0.tgz",
+      "integrity": "sha512-VAEzZTD63YglFlWwRj3taofmkV1V3xhebDXffon7msNz4b14xKsz7utO6F8F4cqt8K/ktTl9rm88yryvDpsfOw==",
       "cpu": [
         "loong64"
       ],
@@ -578,9 +968,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.30.1.tgz",
-      "integrity": "sha512-GLrZraoO3wVT4uFXh67ElpwQY0DIygxdv0BNW9Hkm3X34wu+BkqrDrkcsIapAY+N2ATEbvak0XQ9gxZtCIA5Rw==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.32.0.tgz",
+      "integrity": "sha512-Sts5DST1jXAc9YH/iik1C9QRsLcCoOScf3dfbY5i4kH9RJpKxiTBXqm7qU5O6zTXBTEZry69bGszr3SMgYmMcQ==",
       "cpu": [
         "ppc64"
       ],
@@ -592,9 +982,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.30.1.tgz",
-      "integrity": "sha512-0WKLaAUUHKBtll0wvOmh6yh3S0wSU9+yas923JIChfxOaaBarmb/lBKPF0w/+jTVozFnOXJeRGZ8NvOxvk/jcw==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.32.0.tgz",
+      "integrity": "sha512-qhlXeV9AqxIyY9/R1h1hBD6eMvQCO34ZmdYvry/K+/MBs6d1nRFLm6BOiITLVI+nFAAB9kUB6sdJRKyVHXnqZw==",
       "cpu": [
         "riscv64"
       ],
@@ -606,9 +996,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-s390x-gnu": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.30.1.tgz",
-      "integrity": "sha512-GWFs97Ruxo5Bt+cvVTQkOJ6TIx0xJDD/bMAOXWJg8TCSTEK8RnFeOeiFTxKniTc4vMIaWvCplMAFBt9miGxgkA==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.32.0.tgz",
+      "integrity": "sha512-8ZGN7ExnV0qjXa155Rsfi6H8M4iBBwNLBM9lcVS+4NcSzOFaNqmt7djlox8pN1lWrRPMRRQ8NeDlozIGx3Omsw==",
       "cpu": [
         "s390x"
       ],
@@ -620,9 +1010,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.30.1.tgz",
-      "integrity": "sha512-UtgGb7QGgXDIO+tqqJ5oZRGHsDLO8SlpE4MhqpY9Llpzi5rJMvrK6ZGhsRCST2abZdBqIBeXW6WPD5fGK5SDwg==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.32.0.tgz",
+      "integrity": "sha512-VDzNHtLLI5s7xd/VubyS10mq6TxvZBp+4NRWoW+Hi3tgV05RtVm4qK99+dClwTN1McA6PHwob6DEJ6PlXbY83A==",
       "cpu": [
         "x64"
       ],
@@ -634,9 +1024,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.30.1.tgz",
-      "integrity": "sha512-V9U8Ey2UqmQsBT+xTOeMzPzwDzyXmnAoO4edZhL7INkwQcaW1Ckv3WJX3qrrp/VHaDkEWIBWhRwP47r8cdrOow==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.32.0.tgz",
+      "integrity": "sha512-qcb9qYDlkxz9DxJo7SDhWxTWV1gFuwznjbTiov289pASxlfGbaOD54mgbs9+z94VwrXtKTu+2RqwlSTbiOqxGg==",
       "cpu": [
         "x64"
       ],
@@ -648,9 +1038,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.30.1.tgz",
-      "integrity": "sha512-WabtHWiPaFF47W3PkHnjbmWawnX/aE57K47ZDT1BXTS5GgrBUEpvOzq0FI0V/UYzQJgdb8XlhVNH8/fwV8xDjw==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.32.0.tgz",
+      "integrity": "sha512-pFDdotFDMXW2AXVbfdUEfidPAk/OtwE/Hd4eYMTNVVaCQ6Yl8et0meDaKNL63L44Haxv4UExpv9ydSf3aSayDg==",
       "cpu": [
         "arm64"
       ],
@@ -662,9 +1052,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.30.1.tgz",
-      "integrity": "sha512-pxHAU+Zv39hLUTdQQHUVHf4P+0C47y/ZloorHpzs2SXMRqeAWmGghzAhfOlzFHHwjvgokdFAhC4V+6kC1lRRfw==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.32.0.tgz",
+      "integrity": "sha512-/TG7WfrCAjeRNDvI4+0AAMoHxea/USWhAzf9PVDFHbcqrQ7hMMKp4jZIy4VEjk72AAfN5k4TiSMRXRKf/0akSw==",
       "cpu": [
         "ia32"
       ],
@@ -676,9 +1066,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.30.1.tgz",
-      "integrity": "sha512-D6qjsXGcvhTjv0kI4fU8tUuBDF/Ueee4SVX79VfNDXZa64TfCW1Slkb6Z7O1p7vflqZjcmOVdZlqf8gvJxc6og==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.32.0.tgz",
+      "integrity": "sha512-5hqO5S3PTEO2E5VjCePxv40gIgyS2KvO7E7/vvC/NbIW4SIRamkMr1hqj+5Y67fbBWv/bQLB6KelBQmXlyCjWA==",
       "cpu": [
         "x64"
       ],
@@ -689,6 +1079,57 @@
         "win32"
       ]
     },
+    "node_modules/@types/babel__core": {
+      "version": "7.20.5",
+      "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
+      "integrity": "sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.20.7",
+        "@babel/types": "^7.20.7",
+        "@types/babel__generator": "*",
+        "@types/babel__template": "*",
+        "@types/babel__traverse": "*"
+      }
+    },
+    "node_modules/@types/babel__generator": {
+      "version": "7.6.8",
+      "resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.6.8.tgz",
+      "integrity": "sha512-ASsj+tpEDsEiFr1arWrlN6V3mdfjRMZt6LtK/Vp/kreFLnr5QH5+DhvD5nINYZXzwJvXeGq+05iUXcAzVrqWtw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.0.0"
+      }
+    },
+    "node_modules/@types/babel__template": {
+      "version": "7.4.4",
+      "resolved": "https://registry.npmjs.org/@types/babel__template/-/babel__template-7.4.4.tgz",
+      "integrity": "sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.1.0",
+        "@babel/types": "^7.0.0"
+      }
+    },
+    "node_modules/@types/babel__traverse": {
+      "version": "7.20.6",
+      "resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.20.6.tgz",
+      "integrity": "sha512-r1bzfrm0tomOI8g1SzvCaQHo6Lcv6zu0EA+W2kHrt8dyrHQxGzBBL4kdkzIS+jBMV+EYcMAEAqXqYaLJq5rOZg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.20.7"
+      }
+    },
+    "node_modules/@types/cookie": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.6.0.tgz",
+      "integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==",
+      "license": "MIT"
+    },
     "node_modules/@types/estree": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
@@ -717,6 +1158,26 @@
       "integrity": "sha512-7gqG38EyHgyP1S+7+xomFtL+ZNHcKv6DwNaCZmJmo1vgMugyF3TCnXVg4t1uk89mLNwnLtnY3TpOpCOyp1/xHQ==",
       "license": "MIT"
     },
+    "node_modules/@vitejs/plugin-react": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.3.4.tgz",
+      "integrity": "sha512-SCCPBJtYLdE8PX/7ZQAs1QAZ8Jqwih+0VBLum1EGqmCCQal+MIUqLCzj3ZUy8ufbC0cAM4LRlSTm7IQJwWT4ug==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/core": "^7.26.0",
+        "@babel/plugin-transform-react-jsx-self": "^7.25.9",
+        "@babel/plugin-transform-react-jsx-source": "^7.25.9",
+        "@types/babel__core": "^7.20.5",
+        "react-refresh": "^0.14.2"
+      },
+      "engines": {
+        "node": "^14.18.0 || >=16.0.0"
+      },
+      "peerDependencies": {
+        "vite": "^4.2.0 || ^5.0.0 || ^6.0.0"
+      }
+    },
     "node_modules/big-integer": {
       "version": "1.6.52",
       "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.52.tgz",
@@ -726,16 +1187,118 @@
         "node": ">=0.6"
       }
     },
+    "node_modules/browserslist": {
+      "version": "4.24.4",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.4.tgz",
+      "integrity": "sha512-KDi1Ny1gSePi1vm0q4oxSF8b4DR44GF4BbmS2YdhPLOEqd8pDviZOGH/GsmRwoWJ2+5Lr085X7naowMwKHDG1A==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "caniuse-lite": "^1.0.30001688",
+        "electron-to-chromium": "^1.5.73",
+        "node-releases": "^2.0.19",
+        "update-browserslist-db": "^1.1.1"
+      },
+      "bin": {
+        "browserslist": "cli.js"
+      },
+      "engines": {
+        "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
+      }
+    },
+    "node_modules/caniuse-lite": {
+      "version": "1.0.30001695",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001695.tgz",
+      "integrity": "sha512-vHyLade6wTgI2u1ec3WQBxv+2BrTERV28UXQu9LO6lZ9pYeMk34vjXFLOxo1A4UBA8XTL4njRQZdno/yYaSmWw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/caniuse-lite"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "CC-BY-4.0"
+    },
+    "node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cookie": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz",
+      "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/crypto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/crypto/-/crypto-1.0.1.tgz",
+      "integrity": "sha512-VxBKmeNcqQdiUQUW2Tzq0t377b54N2bMtXO/qiLa+6eRRmmC4qT3D4OnTGoT/U6O9aklQ/jTwbOtRMTTY8G0Ig==",
+      "deprecated": "This package is no longer supported. It's now a built-in Node module. If you've depended on crypto, you should switch to the one that's built-in.",
+      "license": "ISC"
+    },
+    "node_modules/debug": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/decimal.js-light": {
       "version": "2.5.1",
       "resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
       "integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==",
       "license": "MIT"
     },
+    "node_modules/electron-to-chromium": {
+      "version": "1.5.88",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.88.tgz",
+      "integrity": "sha512-K3C2qf1o+bGzbilTDCTBhTQcMS9KW60yTAaTeeXsfvQuTDDwlokLam/AdqlqcSy9u4UainDgsHV23ksXAOgamw==",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/esbuild": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
-      "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==",
+      "version": "0.24.2",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.24.2.tgz",
+      "integrity": "sha512-+9egpBW8I3CD5XPe0n6BfT5fxLzxrlDzqydF3aviG+9ni1lDC/OvMHcxqEFV0+LANZG5R1bFMWfUrjVsdwxJvA==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -743,32 +1306,44 @@
         "esbuild": "bin/esbuild"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.21.5",
-        "@esbuild/android-arm": "0.21.5",
-        "@esbuild/android-arm64": "0.21.5",
-        "@esbuild/android-x64": "0.21.5",
-        "@esbuild/darwin-arm64": "0.21.5",
-        "@esbuild/darwin-x64": "0.21.5",
-        "@esbuild/freebsd-arm64": "0.21.5",
-        "@esbuild/freebsd-x64": "0.21.5",
-        "@esbuild/linux-arm": "0.21.5",
-        "@esbuild/linux-arm64": "0.21.5",
-        "@esbuild/linux-ia32": "0.21.5",
-        "@esbuild/linux-loong64": "0.21.5",
-        "@esbuild/linux-mips64el": "0.21.5",
-        "@esbuild/linux-ppc64": "0.21.5",
-        "@esbuild/linux-riscv64": "0.21.5",
-        "@esbuild/linux-s390x": "0.21.5",
-        "@esbuild/linux-x64": "0.21.5",
-        "@esbuild/netbsd-x64": "0.21.5",
-        "@esbuild/openbsd-x64": "0.21.5",
-        "@esbuild/sunos-x64": "0.21.5",
-        "@esbuild/win32-arm64": "0.21.5",
-        "@esbuild/win32-ia32": "0.21.5",
-        "@esbuild/win32-x64": "0.21.5"
+        "@esbuild/aix-ppc64": "0.24.2",
+        "@esbuild/android-arm": "0.24.2",
+        "@esbuild/android-arm64": "0.24.2",
+        "@esbuild/android-x64": "0.24.2",
+        "@esbuild/darwin-arm64": "0.24.2",
+        "@esbuild/darwin-x64": "0.24.2",
+        "@esbuild/freebsd-arm64": "0.24.2",
+        "@esbuild/freebsd-x64": "0.24.2",
+        "@esbuild/linux-arm": "0.24.2",
+        "@esbuild/linux-arm64": "0.24.2",
+        "@esbuild/linux-ia32": "0.24.2",
+        "@esbuild/linux-loong64": "0.24.2",
+        "@esbuild/linux-mips64el": "0.24.2",
+        "@esbuild/linux-ppc64": "0.24.2",
+        "@esbuild/linux-riscv64": "0.24.2",
+        "@esbuild/linux-s390x": "0.24.2",
+        "@esbuild/linux-x64": "0.24.2",
+        "@esbuild/netbsd-arm64": "0.24.2",
+        "@esbuild/netbsd-x64": "0.24.2",
+        "@esbuild/openbsd-arm64": "0.24.2",
+        "@esbuild/openbsd-x64": "0.24.2",
+        "@esbuild/sunos-x64": "0.24.2",
+        "@esbuild/win32-arm64": "0.24.2",
+        "@esbuild/win32-ia32": "0.24.2",
+        "@esbuild/win32-x64": "0.24.2"
+      }
+    },
+    "node_modules/escalade": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
+      "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
       }
     },
     "node_modules/eventemitter3": {
@@ -777,18 +1352,13 @@
       "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==",
       "license": "MIT"
     },
-    "node_modules/flatpickr": {
-      "version": "4.6.13",
-      "resolved": "https://registry.npmjs.org/flatpickr/-/flatpickr-4.6.13.tgz",
-      "integrity": "sha512-97PMG/aywoYpB4IvbvUJi0RQi8vearvU0oov1WW3k0WZPBMrTQVqekSX5CjSG/M4Q3i6A/0FKXC7RyAoAUUSPw==",
-      "license": "MIT"
-    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
       "dev": true,
       "hasInstallScript": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
@@ -797,12 +1367,93 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
+    "node_modules/gensync": {
+      "version": "1.0.0-beta.2",
+      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
+      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/globals": {
+      "version": "11.12.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
+      "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+      "license": "MIT"
+    },
+    "node_modules/jsesc": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
+      "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "jsesc": "bin/jsesc"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/json5": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
+      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "json5": "lib/cli.js"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/lodash.transform": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.transform/-/lodash.transform-4.6.0.tgz",
       "integrity": "sha512-LO37ZnhmBVx0GvOU/caQuipEh4GN82TcWv3yHlebGDgOxbxiwwzW5Pcx2AcvpIv2WmvmSMoC492yQFNhy/l/UQ==",
       "license": "MIT"
     },
+    "node_modules/loose-envify": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "js-tokens": "^3.0.0 || ^4.0.0"
+      },
+      "bin": {
+        "loose-envify": "cli.js"
+      }
+    },
+    "node_modules/lru-cache": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
+      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "yallist": "^3.0.2"
+      }
+    },
+    "node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/nanoid": {
       "version": "3.3.8",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.8.tgz",
@@ -822,23 +1473,24 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/node-releases": {
+      "version": "2.0.19",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz",
+      "integrity": "sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/picocolors": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.0.tgz",
-      "integrity": "sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/pikaday": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/pikaday/-/pikaday-1.8.2.tgz",
-      "integrity": "sha512-TNtsE+34BIax3WtkB/qqu5uepV1McKYEgvL3kWzU7aqPCpMEN6rBF3AOwu4WCwAealWlBGobXny/9kJb49C1ew==",
-      "license": "(0BSD OR MIT)"
-    },
     "node_modules/postcss": {
-      "version": "8.4.47",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.47.tgz",
-      "integrity": "sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==",
+      "version": "8.5.1",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.1.tgz",
+      "integrity": "sha512-6oz2beyjc5VMn/KV1pPw8fliQkhBXrVn1Z3TVyqZxU8kZpzEKhBdmCFqI6ZbmGtamQvQGuU1sgPTk8ZrXDD7jQ==",
       "dev": true,
       "funding": [
         {
@@ -856,18 +1508,93 @@
       ],
       "license": "MIT",
       "dependencies": {
-        "nanoid": "^3.3.7",
-        "picocolors": "^1.1.0",
+        "nanoid": "^3.3.8",
+        "picocolors": "^1.1.1",
         "source-map-js": "^1.2.1"
       },
       "engines": {
         "node": "^10 || ^12 || >=14"
       }
     },
+    "node_modules/react": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/react-dom": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.23.2"
+      },
+      "peerDependencies": {
+        "react": "^18.3.1"
+      }
+    },
+    "node_modules/react-refresh": {
+      "version": "0.14.2",
+      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
+      "integrity": "sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/react-router": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.1.3.tgz",
+      "integrity": "sha512-EezYymLY6Guk/zLQ2vRA8WvdUhWFEj5fcE3RfWihhxXBW7+cd1LsIiA3lmx+KCmneAGQuyBv820o44L2+TtkSA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/cookie": "^0.6.0",
+        "cookie": "^1.0.1",
+        "set-cookie-parser": "^2.6.0",
+        "turbo-stream": "2.4.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/react-router-dom": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.1.3.tgz",
+      "integrity": "sha512-qQGTE+77hleBzv9SIUIkGRvuFBQGagW+TQKy53UTZAO/3+YFNBYvRsNIZ1GT17yHbc63FylMOdS+m3oUriF1GA==",
+      "license": "MIT",
+      "dependencies": {
+        "react-router": "7.1.3"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      }
+    },
     "node_modules/rollup": {
-      "version": "4.30.1",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.30.1.tgz",
-      "integrity": "sha512-mlJ4glW020fPuLi7DkM/lN97mYEZGWeqBnrljzN0gs7GLctqX3lNWxKQ7Gl712UAX+6fog/L3jh4gb7R6aVi3w==",
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.32.0.tgz",
+      "integrity": "sha512-JmrhfQR31Q4AuNBjjAX4s+a/Pu/Q8Q9iwjWBsjRH1q52SPFE2NqRMK6fUZKKnvKO6id+h7JIRf0oYsph53eATg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -881,28 +1608,53 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.30.1",
-        "@rollup/rollup-android-arm64": "4.30.1",
-        "@rollup/rollup-darwin-arm64": "4.30.1",
-        "@rollup/rollup-darwin-x64": "4.30.1",
-        "@rollup/rollup-freebsd-arm64": "4.30.1",
-        "@rollup/rollup-freebsd-x64": "4.30.1",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.30.1",
-        "@rollup/rollup-linux-arm-musleabihf": "4.30.1",
-        "@rollup/rollup-linux-arm64-gnu": "4.30.1",
-        "@rollup/rollup-linux-arm64-musl": "4.30.1",
-        "@rollup/rollup-linux-loongarch64-gnu": "4.30.1",
-        "@rollup/rollup-linux-powerpc64le-gnu": "4.30.1",
-        "@rollup/rollup-linux-riscv64-gnu": "4.30.1",
-        "@rollup/rollup-linux-s390x-gnu": "4.30.1",
-        "@rollup/rollup-linux-x64-gnu": "4.30.1",
-        "@rollup/rollup-linux-x64-musl": "4.30.1",
-        "@rollup/rollup-win32-arm64-msvc": "4.30.1",
-        "@rollup/rollup-win32-ia32-msvc": "4.30.1",
-        "@rollup/rollup-win32-x64-msvc": "4.30.1",
+        "@rollup/rollup-android-arm-eabi": "4.32.0",
+        "@rollup/rollup-android-arm64": "4.32.0",
+        "@rollup/rollup-darwin-arm64": "4.32.0",
+        "@rollup/rollup-darwin-x64": "4.32.0",
+        "@rollup/rollup-freebsd-arm64": "4.32.0",
+        "@rollup/rollup-freebsd-x64": "4.32.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.32.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.32.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.32.0",
+        "@rollup/rollup-linux-arm64-musl": "4.32.0",
+        "@rollup/rollup-linux-loongarch64-gnu": "4.32.0",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.32.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.32.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.32.0",
+        "@rollup/rollup-linux-x64-gnu": "4.32.0",
+        "@rollup/rollup-linux-x64-musl": "4.32.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.32.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.32.0",
+        "@rollup/rollup-win32-x64-msvc": "4.32.0",
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/scheduler": {
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
+    },
+    "node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/set-cookie-parser": {
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
+      "integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==",
+      "license": "MIT"
+    },
     "node_modules/source-map-js": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
@@ -913,35 +1665,72 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/turbo-stream": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/turbo-stream/-/turbo-stream-2.4.0.tgz",
+      "integrity": "sha512-FHncC10WpBd2eOmGwpmQsWLDoK4cqsA/UT/GqNoaKOQnT8uzhtCbg3EoUDMvqpOSAI0S26mr0rkjzbOO6S3v1g==",
+      "license": "ISC"
+    },
+    "node_modules/update-browserslist-db": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.2.tgz",
+      "integrity": "sha512-PPypAm5qvlD7XMZC3BujecnaOxwhrtoFR+Dqkk5Aa/6DssiH0ibKoketaj9w8LP7Bont1rYeoV5plxD7RTEPRg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "escalade": "^3.2.0",
+        "picocolors": "^1.1.1"
+      },
+      "bin": {
+        "update-browserslist-db": "cli.js"
+      },
+      "peerDependencies": {
+        "browserslist": ">= 4.21.0"
+      }
+    },
     "node_modules/uuid": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
-      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "version": "11.0.5",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-11.0.5.tgz",
+      "integrity": "sha512-508e6IcKLrhxKdBbcA2b4KQZlLVp2+J5UwQ6F7Drckkc5N9ZJwFa4TgWtsww9UG8fGHbm6gbV19TdM5pQ4GaIA==",
       "funding": [
         "https://github.com/sponsors/broofa",
         "https://github.com/sponsors/ctavan"
       ],
       "license": "MIT",
       "bin": {
-        "uuid": "dist/bin/uuid"
+        "uuid": "dist/esm/bin/uuid"
       }
     },
     "node_modules/vite": {
-      "version": "5.4.14",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.14.tgz",
-      "integrity": "sha512-EK5cY7Q1D8JNhSaPKVK4pwBFvaTmZxEnoKXLG/U9gmdDcihQGNzFlgIvaxezFR4glP1LsuiedwMBqCXH3wZccA==",
+      "version": "6.0.11",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.11.tgz",
+      "integrity": "sha512-4VL9mQPKoHy4+FE0NnRE/kbY51TOfaknxAjt3fJbGJxhIpBZiqVzlZDEesWWsuREXHwNdAoOFZ9MkPEVXczHwg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "esbuild": "^0.21.3",
-        "postcss": "^8.4.43",
-        "rollup": "^4.20.0"
+        "esbuild": "^0.24.2",
+        "postcss": "^8.4.49",
+        "rollup": "^4.23.0"
       },
       "bin": {
         "vite": "bin/vite.js"
       },
       "engines": {
-        "node": "^18.0.0 || >=20.0.0"
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
       },
       "funding": {
         "url": "https://github.com/vitejs/vite?sponsor=1"
@@ -950,19 +1739,25 @@
         "fsevents": "~2.3.3"
       },
       "peerDependencies": {
-        "@types/node": "^18.0.0 || >=20.0.0",
+        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+        "jiti": ">=1.21.0",
         "less": "*",
         "lightningcss": "^1.21.0",
         "sass": "*",
         "sass-embedded": "*",
         "stylus": "*",
         "sugarss": "*",
-        "terser": "^5.4.0"
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
       },
       "peerDependenciesMeta": {
         "@types/node": {
           "optional": true
         },
+        "jiti": {
+          "optional": true
+        },
         "less": {
           "optional": true
         },
@@ -983,9 +1778,22 @@
         },
         "terser": {
           "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
         }
       }
     },
+    "node_modules/yallist": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
+      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/zod": {
       "version": "3.24.1",
       "resolved": "https://registry.npmjs.org/zod/-/zod-3.24.1.tgz",
diff --git a/client/package.json b/client/package.json
index 671347d..8830573 100644
--- a/client/package.json
+++ b/client/package.json
@@ -9,9 +9,15 @@
     "preview": "vite preview"
   },
   "devDependencies": {
-    "vite": "^5.4.14"
+    "@vitejs/plugin-react": "^4.3.4",
+    "vite": "^6.0.11"
   },
   "dependencies": {
-    "@discord/embedded-app-sdk": "^1.9.0"
+    "@discord/embedded-app-sdk": "^1.9.0",
+    "crypto": "^1.0.1",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-router-dom": "^7.1.3",
+    "uuid": "^11.0.5"
   }
 }
diff --git a/client/reportWebVitals.jsx b/client/reportWebVitals.jsx
new file mode 100644
index 0000000..f78fb1f
--- /dev/null
+++ b/client/reportWebVitals.jsx
@@ -0,0 +1,16 @@
+// reportWebVitals.js
+
+const reportWebVitals = (onPerfEntry) => {
+    if (onPerfEntry && onPerfEntry instanceof Function) {
+      import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+        getCLS(onPerfEntry);
+        getFID(onPerfEntry);
+        getFCP(onPerfEntry);
+        getLCP(onPerfEntry);
+        getTTFB(onPerfEntry);
+      });
+    }
+  };
+  
+  export default reportWebVitals;
+  
\ No newline at end of file
diff --git a/client/styles/board.css b/client/styles/board.css
index 273d922..9d2b54c 100644
--- a/client/styles/board.css
+++ b/client/styles/board.css
@@ -1,22 +1,76 @@
 /* Board Section Styling */
-#board-section {
+.board-section {
   position: fixed;
-    top: 23.3vh;
-    left: 0;
-    width: 20%; /* 1/5 of the screen width */
-    height: 5vh; /* Full height of the screen */
-    background-color: #1C2025;
-    padding: 20px;
-    border-right: 1px solid #474E55; /* Right edge line color */
-    z-index: 2;
-  }
-  #board-text {
-  position: relative;
-  left: 1.1vw;
-  font-size: calc(1.4vw);
-  color: white;
-  letter-spacing: 1px;
-  }
+  top: 24.5vh;
+  left: 0;
+  width: 20%; /* 1/5 of the screen width */
+  height: 5vh; /* Full height of the screen */
+  background-color: #1C2025;
+  padding: 16px;
+  z-index: 1;
+}
+
+
+/* Styling for Board Buttons */
+.board-button {
+  display: block;
+  z-index: 5;
+  width: 100%;
+  padding: 10px 15px;
+  margin: 4px 0;
+  background-color: transparent;
+  border: none;
+  border-radius: 4px;
+  text-align: left;
+  font-size: calc(1.3vw);
+  color: #f3f3f3;
+  cursor: pointer;
+  text-indent: 2.5vw; /* Moves text to the right */
+  margin-bottom: 1.5vh;
+  overflow: hidden; /* Hide overflow text */
+  white-space: nowrap; /* Prevent text wrapping */
+  text-overflow: ellipsis; /* Show ellipsis for overflow */
+}
+
+.board-button:hover {
+  background-color: #25282D;
+}
+
+.board-button.active {
+  background-color: #1C2B41;
+  color: #3C90E2;
+}
+
+.board-list-container {
+  max-height: 52vh; /* Adjust as needed */
+  overflow-y: auto; /* Allow scrolling if content exceeds container height */
+  position: relative; /* Ensure the container's position can be adjusted */
+  top: -1vh; /* Moves the container 1vh higher */
+}
+
+/* Scrollbar for Board List Container */
+.board-list-container::-webkit-scrollbar {
+  width: 6px; /* Optional scrollbar width */
+  border-radius: 4px;
+}
+
+.board-list-container::-webkit-scrollbar-thumb {
+  background-color: #33363B; /* Scrollbar thumb color */
+  border-radius: 4px;
+}
+
+.board-list-container::-webkit-scrollbar-track {
+  background-color: #25282D; /* Scrollbar track color */
+}
+
+
+.board-text {
+    position: relative;
+    left: 1.1vw;
+    font-size: calc(1.4vw);
+    color: white;
+    letter-spacing: 1px;
+    }
   
   #create-board-button {
   position: relative;
@@ -31,6 +85,7 @@
   letter-spacing: 1px;
   cursor: pointer;
   outline: none;
+  display: block; /* Ensure it is visible */
   /* Center the text inside the button */
   display: flex;
   align-items: center;
@@ -55,7 +110,7 @@
     display: none;
     align-items: center;
     justify-content: center;
-    z-index: 999;
+    z-index: 1000;
     }
     
     #popup-overlay:not(.hidden) {
@@ -65,14 +120,14 @@
   
   /* Form Labels and Inputs Spacing */
   /* Form Labels and Inputs Spacing */
-form label {
+.popup-label {
   display: block;
   margin-bottom: 15px; /* Space between label and input/textarea */
   font-size: calc(1.1vw);
   }
   
-  form input,
-  form textarea {
+  .popup-input,
+  .popup-textarea {
   width: 85%;
   padding: 10px;
   border: 1px solid #6D7276;
@@ -83,7 +138,7 @@ form label {
   }
   
   /* Fixed height for textarea */
-  form textarea {
+  .popup-textarea {
   height: 110px !important;
   resize: none; /* Prevent textarea resizing */
   margin-bottom: 25px;
@@ -114,7 +169,7 @@ form label {
   display: flex;
   justify-content: flex-end;
   position: sticky;
-  bottom: 15px;
+  bottom: 2vh;
   padding-right: 40px;
   z-index: 1;
   }
@@ -144,47 +199,62 @@ form label {
   }
   
 
-  #popup-content {
+  .popup-content {
+    position: relative;
     background-color: #33363B;
-    padding: 0; /* Remove padding to align header and buttons */
+    padding: 2vh 2vw; /* Remove padding to align header and buttons */
     border-radius: 12px;
     width: 60vw !important;
-    max-height: 70vh; /* Set a maximum height */
+    max-height: 80vh !important; /* Set a maximum height */
     display: flex;
     flex-direction: column;
-    color: #fff;
+    box-sizing: border-box; /* Ensure padding is accounted for in the width/height calculation */
     font-family: 'Inter', sans-serif;
-    overflow: hidden; /* Prevent popup overflow */  
+    overflow: none; /* Prevent popup overflow */  
+    z-index: 1001;
   }
   
+  .popup-body {
+    flex: 1;
+    overflow-y: hidden; /* Enable only vertical scrolling if needed */
+    padding: 10px;
+    max-height: 50vh; /* Prevent it from taking too much space */
+  }
+
   .popup-header {
     background-color: #33363B;
     position: sticky;
-    top: 4vh;
+    top: 1vh;
     z-index: 1;
     margin: 1vh 0;
   }
-  
-  #header-title {
-    font-size: calc(1.8vw) !important;
-    margin-left: 2.5vw; /* Adjust alignment */
-    letter-spacing: 1px;
-    color: white;
-    font-weight: normal;
-  }
+
+/* Ensure header title spacing is applied */
+.header-title {
+  font-size: calc(1.8vw) !important;
+  margin: 1vh 2vw; /* Adjust spacing: Top and bottom = 3vh, Left and right = 2vw */
+  padding: 0vh 0; /* Add some internal space */
+  letter-spacing: 1px;
+  color: white;
+  font-weight: normal;
+  display: block; /* Ensure it behaves as a block element */
+}
+
+
+.input-wrapper {
+  margin-left: 5.5vw;
+}
   
   
   /* Close Button Styling */
-  #close-project-popup-button,
-  #close-popup-button,
-  #close-task-popup-button {
+  .close-popup-button {
   position: absolute;
   top: 2.5vh;
   right: 3.5vh;
   background: none;
   border: none;
   color: #949AA0;
-  font-size: 16px;
+  font-size: calc(1.8vw);
   cursor: pointer;
   outline: none;
   }
@@ -220,79 +290,6 @@ color: white;
 border: 1.5px solid #2594E3;
 }
 
-/* Popup Body (Scrollable) */
-#popup-body-main {
-  position: relative;
-  flex: 1;
-  top: -3.5vh;
-  padding: 40px;
-  overflow-y: hidden; /* Allow vertical scrolling */
-  overflow-x: hidden; /* Prevent horizontal scrolling */
-}
-
-#popup-body-main::-webkit-scrollbar {
-  width: 8px; /* Optional scrollbar width */
-}
-
-#popup-body-main::-webkit-scrollbar-thumb {
-  background-color: #6D7276; /* Scrollbar thumb color */
-  border-radius: 4px;
-}
-
-#popup-body-main::-webkit-scrollbar-track {
-  background-color: #3A3E42; /* Scrollbar track color */
-}
-
-#board-list-container {
-  max-height: 53.5vh; /* Adjust as needed */
-  overflow-y: auto; /* Allow scrolling if content exceeds container height */
-  position: relative; /* Ensure the container's position can be adjusted */
-  top: -1vh; /* Moves the container 1vh higher */
-}
-
-.board-button {
-  display: block;
-  z-index: 5;
-  width: 100%;
-  padding: 10px 15px;
-  margin: 4px 0;
-  background-color: transparent;
-  border: none;
-  border-radius: 4px;
-  text-align: left;
-  font-size: calc(1.3vw);
-  color: #f3f3f3;
-  cursor: pointer;
-  text-indent: 2.5vw; /* Moves text 3vw to the left */
-  margin-bottom: 1.5vh;
-  overflow: hidden; /* Hide overflow text */
-  white-space: nowrap; /* Prevent text wrapping */
-  text-overflow: ellipsis; /* Show ellipsis for overflow */
-}
-
-.board-button:hover {
-  background-color: #25282D;
-}
-
-.board-button.active {
-  background-color: #1C2B41;
-  color: #3C90E2;
-}
-
-#board-list-container::-webkit-scrollbar {
-  width: 6px; /* Optional scrollbar width */
-  border-radius: 4px;
-}
-
-#board-list-container::-webkit-scrollbar-thumb {
-  background-color: #33363B; /* Scrollbar thumb color */
-  border-radius: 4px;
-}
-
-#board-list-container::-webkit-scrollbar-track {
-  background-color: #25282D; /* Scrollbar track color */
-}
-
 #board-page {
   position: relative;
   width: 100%;
@@ -327,4 +324,5 @@ border: 1.5px solid #2594E3;
   white-space: nowrap; /* Prevent text wrapping */
   text-overflow: ellipsis; /* Show ellipsis for overflow */
   max-width: 40vw; /* Adjust max width as per layout */
-}
\ No newline at end of file
+}
+
diff --git a/client/styles/popup.css b/client/styles/popup.css
index 7c4e4cf..2e7571e 100644
--- a/client/styles/popup.css
+++ b/client/styles/popup.css
@@ -18,15 +18,18 @@
 
 /* Popup Content */
 #popup-content, #task-popup-content, #project-popup-content {
+  position: relative;
   background-color: #33363B;
-  padding: 2vh; /* Vertical padding using vh */
-  border-radius: 1.5vw; /* Border radius in vw */
-  width: 50vw; /* Responsive width based on viewport width */
-  max-height: 75vh; /* Max height using vh */
-  color: white;
+  padding: 2vh 2vw; /* Remove padding to align header and buttons */
+  border-radius: 12px;
+  width: 60vw !important;
+  max-height: 80vh !important; /* Set a maximum height */
   display: flex;
-  flex-direction: column; /* Ensures header and content are stacked vertically */
-  overflow-y: auto; /* Make sure it doesn't overflow */
+  flex-direction: column;
+  box-sizing: border-box; /* Ensure padding is accounted for in the width/height calculation */
+  font-family: 'Inter', sans-serif;
+  overflow: none; /* Prevent popup overflow */  
+  z-index: 999;
 }
 
 /* Popup Header */
diff --git a/client/styles/project.css b/client/styles/project.css
index 51c7f9d..a7c1f86 100644
--- a/client/styles/project.css
+++ b/client/styles/project.css
@@ -9,46 +9,59 @@
   display: none;
   align-items: center;
   justify-content: center;
-  z-index: 1001;
+  z-index: 1000;
 }
 
 #project-popup-overlay:not(.hidden) {
   display: flex; /* Show the popup */
 }
 
+.create-project-container {
+  display: flex;
+}
+
 /* Main and Project Popup Content */
-#popup-content {
+.project-popup {
+  position: relative;
   background-color: #33363B;
-  padding: 2vh; /* Padding using vh for responsive spacing */
-  border-radius: 1.5vw; /* Border radius using vw */
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
-  width: 50vw; /* Width using vw for responsive sizing */
-  max-height: 75vh; /* Max height in vh for responsiveness */
+  padding: 2vh 2vw; /* Remove padding to align header and buttons */
+  border-radius: 12px;
+  width: 60vw !important;
+  max-height: 80vh !important; /* Set a maximum height */
   display: flex;
   flex-direction: column;
-  color: #fff;
+  box-sizing: border-box; /* Ensure padding is accounted for in the width/height calculation */
   font-family: 'Inter', sans-serif;
-  overflow: hidden;
+  overflow: none; /* Prevent popup overflow */  
+  z-index: 1001;
+}
+
+#header-title {
+  font-size: calc(1.8vw) !important;
+  margin-left: 2.5vw; /* Adjust alignment */
+  margin-top: 2vh;
+  margin-bottom: 2vh;
+  letter-spacing: 1px;
+  color: white;
+  font-weight: normal;
 }
 
 #project-section {
   position: fixed;
-  top: 23.3vh;
+  top: 24.5vh;
   left: 0;
   width: 20%;
   height: 5vh;
   background-color: #1C2025;
   padding: 20px;
   box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
-  border-right: 1px solid #474E55;
-  display: none;
   z-index: 2;
   }
   
   /* Create Project Button Styling */
-  #create-project-button {
+  .create-project-button {
   position: relative;
-  top: -1vh;
+  top: -1.5vh;
   left: 0.2vw;
   background-color: transparent;
   color: white;
@@ -63,7 +76,7 @@
   margin-bottom: 1vh;
   }
 
-  #create-project-button:hover {
+  .create-project-button:hover {
     background-color: #2594E3;
     color: white;
   }
@@ -75,20 +88,20 @@ form label {
   font-size: 14px;
   }
   
-  form input,
-  form textarea {
-  width: 87%;
+  .popup-input,
+  .popup-textarea {
+  width: 85%;
   padding: 10px;
   border: 1px solid #6D7276;
   border-radius: 12px; /* Rounded corners for input and textarea */
   background-color: #3A3E42;
   color: #fff;
-  font-size: 14px;
+  font-size: calc(1.1vw);
   }
   
   /* Fixed height for textarea */
-  form textarea {
-  height: 110px;
+  .popup-textarea {
+  height: 110px !important;
   resize: none; /* Prevent textarea resizing */
   margin-bottom: 25px;
   }
@@ -123,6 +136,10 @@ form label {
   z-index: 1;
   }
   
+  .input-wrapper {
+    margin-left: 5.5vw;
+  }
+
   #cancel-button ,
   #cancel-project-button ,
   #cancel-task-button {
@@ -182,13 +199,13 @@ form label {
   margin: 0vh auto 0 auto; /* 1vh gap and centered line */
   }
 
-  #project-list-container {
+  .project-list-container {
     margin-top: 1vh;
     max-height: 52.5vh; 
     overflow-y: auto; 
     position: relative;
   }
-  .project-button {
+  #project-list-container .project-button {
     display: flex;
     align-items: center;
     justify-content: flex-start;
@@ -204,11 +221,15 @@ form label {
     width: 100%;
     margin-bottom: 1.5vh;
     margin-top: 1.5vh;
-    overflow: hidden; /* Hide overflow text */
-    white-space: nowrap; /* Prevent text wrapping */
-    text-overflow: ellipsis; /* Show ellipsis for overflow */
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
   }
-  .project-button:hover {
+  
+  #project-list-container .project-button:hover {
+    background-color: #2594E3;
+  }
+      .project-button:hover {
     background-color: #2594E3;
   }
   .project-button .checkmark {
@@ -225,7 +246,7 @@ form label {
   .project-button.active .checkmark {
     visibility: visible; /* Make the checkmark visible */
   }
-  .project-button .project-name {
+  .project-button  {
     flex-grow: 1; /* Ensure the text takes the remaining space */
     width: 2vw;
     overflow: hidden; /* Hide overflow text */
@@ -244,9 +265,16 @@ form label {
     background-color: #25282D; /* Scrollbar track color */
   }
   .dynamic-line {
-    width: 100%;
+    width: 86%;
     height: 1px;  
     background-color: #474E55;
     margin: 0vh auto 0 auto; /* 1vh gap and centered line */
     position: absolute; /* Allow dynamic positioning */
-  }
\ No newline at end of file
+  }
+.dynamic-line1 {
+  width: 100%;
+  height: 1px;  
+  margin-left: -20px;
+  background-color: #474E55;
+  position: absolute; /* Allow dynamic positioning */
+}
\ No newline at end of file
diff --git a/client/styles/sidebar.css b/client/styles/sidebar.css
index 2df2e3e..73b1297 100644
--- a/client/styles/sidebar.css
+++ b/client/styles/sidebar.css
@@ -10,13 +10,16 @@
   position: fixed;
   top: 0;
   left: 0;
-  width: 20%; /* 1/5 of the screen width */
-  height: 100vh; /* Full height of the screen */
+  width: 20%;
+  /* 1/5 of the screen width */
+  height: 100vh;
+  /* Full height of the screen */
   background-color: #1C2025;
   padding: 20px;
-  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
-  border-right: 1px solid #474E55; /* Right edge line color */
-  overflow-y: auto; /* Allows scrolling if content overflows */
+  border-right: 1px solid #474E55;
+  /* Right edge line color */
+  overflow-y: auto;
+  /* Allows scrolling if content overflows */
   z-index: 1;
 }
 
@@ -24,58 +27,78 @@
   position: fixed;
   top: 0vh;
   left: 0;
-  width: 20%; /* 1/5 of the screen width */
-  height: 5vh; /* Full height of the screen */
+  width: 20%;
+  /* 1/5 of the screen width */
+  height: 3.5vh;
+  /* Full height of the screen */
   background-color: #1C2025;
   padding: 20px;
-  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
-  border-right: 1px solid #474E55; /* Right edge line color */
-  border-bottom: 1px solid #474E55; /* Right edge line color */
-  z-index: 4;
+  /* Right edge line color */
+  border-bottom: 1px solid #474E55;
+  /* Right edge line color */
+  z-index: 3;
 }
 
-#projectbox {
+#project-container {
   position: fixed;
   top: 11vh;
   left: 0;
-  width: 20%; /* 1/5 of the screen width */
-  height: 6vh; /* Full height of the screen */
+  width: 20%;
+  height: 6vh;
   background-color: #1C2025;
   padding: 3.5vh 20px;
-  border-right: 1px solid #474E55; /* Right edge line color */
-  border-bottom: 1px solid #474E55; /* Right edge line color */
-  z-index: 3;
-  font-size: calc(1.3vw); 
+  border-bottom: 1px solid #474E55; 
+  z-index: 1;
+  /* Ensure it's on top */
+  font-size: calc(1.3vw);
+  cursor: pointer;
+  /* Ensures it's clickable */
+}
+
+.projectbox {
+  display: flex;
+  align-items: center;
+  position: relative;
+  padding-left: 2vw; /* Ensure space for the triangle */
 }
 
-#projectbox:hover {
-background-color: #25282D;
+#project-box-content {
+  margin-left: 2.5vw; /* Push text away from the triangle */
+  display: flex;
+  flex-direction: column;
 }
 
-#projectname {
+#project-box-name {
   position: fixed;
   top: 13.75vh;
   color: white;
   left: 5vw;
-  z-index: 4;
-  font-size: calc(1.3vw); 
+  z-index: 1;
+  font-size: calc(1.3vw);
   letter-spacing: 1px;
-  white-space: nowrap; /* Prevent text wrapping */
-  overflow: hidden; /* Hide overflowing text */
-  text-overflow: ellipsis; /* Add ellipsis for overflowing text */
+  white-space: nowrap;
+  /* Prevent text wrapping */
+  overflow: hidden;
+  /* Hide overflowing text */
+  text-overflow: ellipsis;
+  /* Add ellipsis for overflowing text */
   max-width: 13vw;
 }
-#projectdescription {
+
+#project-box-description {
   position: fixed;
   top: 18.25vh;
   color: #BEBEBE;
   left: 7.5vw;
-  z-index: 4;
-  font-size: calc(1vw); 
+  z-index: 1;
+  font-size: calc(1vw);
   letter-spacing: 1px;
-  white-space: nowrap; /* Prevent text wrapping */
-  overflow: hidden; /* Hide overflowing text */
-  text-overflow: ellipsis; /* Add ellipsis for overflowing text */
+  white-space: nowrap;
+  /* Prevent text wrapping */
+  overflow: hidden;
+  /* Hide overflowing text */
+  text-overflow: ellipsis;
+  /* Add ellipsis for overflowing text */
   max-width: 11vw;
 }
 
@@ -83,14 +106,17 @@ background-color: #25282D;
   position: fixed;
   top: 87vh;
   left: 0;
-  width: 20%; /* 1/5 of the screen width */
-  height: 5vh; /* Full height of the screen */
+  width: 20%;
+  /* 1/5 of the screen width */
+  height: 5vh;
+  /* Full height of the screen */
   background-color: #1C2025;
   padding: 20px;
   box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
-  border-right: 1px solid #474E55; /* Right edge line color */
-  border-top: 1px solid #474E55; /* Right edge line color */
-  z-index: 10;
+  /* Right edge line color */
+  border-top: 1px solid #474E55;
+  /* Right edge line color */
+  z-index: 1;;
 }
 
 #userbox img {
@@ -107,11 +133,12 @@ background-color: #25282D;
   top: 92vh;
   left: 9vw;
   color: white;
-  font-size: calc(1.3vw); /* Dynamically adjusts font size */
+  font-size: calc(1.3vw);
+  /* Dynamically adjusts font size */
 }
 
 /* Triangle symbol base style */
-#triangle-symbol {
+.triangle-symbol {
   width: 0;
   height: 0;
   border-left: 1vh solid transparent;
@@ -119,10 +146,11 @@ background-color: #25282D;
   border-top: 1vh solid #B6CADB;
   display: inline-block;
   transform-origin: center;
-  transition: transform 0.2s ease; /* Smooth transition */  
-  position: absolute; /* Use absolute positioning */
-  top: 50%; /* Center vertically */
-  left: 2vw; /* Adjust distance from the left */
+  transition: transform 0.2s ease;
+  position: absolute;
+  top: 2vh;
+  left: 0.7vw;
+  z-index: 5;
 }
 
 /* Triangle facing right */
@@ -142,9 +170,12 @@ background-color: #25282D;
   width: 10px;
   height: 10px;
   position: absolute;
-  top: 35%; /* Center vertically */
-  right: 1vw; /* Align to the right */
-  z-index: 1; /* Ensure it’s above other elements */
+  top: 35%;
+  /* Center vertically */
+  right: -0.5vw;
+  /* Align to the right */
+  z-index: 1;
+  /* Ensure it’s above other elements */
   display: inline-block;
   transform-origin: center;
 }
@@ -156,15 +187,15 @@ background-color: #25282D;
 /* Popup container */
 .project-settings-popup {
   position: absolute;
-  top: 40px;
-  right: 10px;
+  top: 0px;
+  right: -190px;
   width: 150px;
   background-color: #11161C;
   border: 1px solid transparent;
   border-radius: 8px;
   padding: 4px;
-  z-index: 2000;
-  display: flex;
+  z-index: 5;
+  display: flex;  
   flex-direction: column;
   gap: 2px;
 }
@@ -174,16 +205,20 @@ background-color: #25282D;
   display: none;
 }
 
+.hidden {
+  display: none;
+}
+
 /* Options inside the popup */
 .project-settings-option {
   padding: 4px 0px;
   padding-left: 20px;
   font-size: 12px;
-  margin: 4px ;
+  margin: 4px;
   color: white;
   font-size: 14px;
   cursor: pointer;
-  text-align: left; 
+  text-align: left;
   border-radius: 4px;
   letter-spacing: 1px;
 }
@@ -203,4 +238,19 @@ background-color: #25282D;
 
 .project-settings-option.delete:hover {
   background-color: #1B2128;
-}
\ No newline at end of file
+}
+
+.section-wrapper {
+  display: block;
+  margin-top: 20px;
+}
+
+.please-create-project {
+  position: relative;
+  top: 22vh;
+  left: 4vw;
+  font-size: calc(1.4vw);
+  color: white;
+  letter-spacing: 1px;
+  z-index: 8;
+  }
\ No newline at end of file
diff --git a/client/vite.config.js b/client/vite.config.js
index ea9fda9..0c859d4 100644
--- a/client/vite.config.js
+++ b/client/vite.config.js
@@ -1,20 +1,22 @@
-import {defineConfig} from 'vite';
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
 
-// https://vitejs.dev/config/
 export default defineConfig({
-  envDir: '../',
+  define: {
+    'process.env': {}, // To avoid issues with process usage
+  },
+  plugins: [react()],
+  envDir: '../', // Ensure this matches the location of your environment variables file
   server: {
-    allowedHosts: ["existence-fatty-vic-patrick.trycloudflare.com"],
+    allowedHosts: ["businesses-ski-fundamentals-pulling.trycloudflare.com"],
     proxy: {
-      '/api': {
-        target: 'http://localhost:3001',
-        changeOrigin: true,
-        secure: false,
-        ws: true,
+      '/socket': {
+        target: 'wss://discord.com/api/', // Proxy Discord WebSocket API requests
+        ws: true, // Ensure WebSocket is properly proxied
       },
     },
     hmr: {
-      clientPort: 443,
+      clientPort: 5173, // Adjust this if your frontend is on a different port
     },
   },
 });
diff --git a/package-lock.json b/package-lock.json
index fc02dc3..b5bfd59 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -6,8 +6,13 @@
     "": {
       "dependencies": {
         "@discord/embedded-app-sdk": "^1.9.0",
+        "cors": "^2.8.5",
         "flatpickr": "^4.6.13",
-        "pikaday": "^1.8.2"
+        "pikaday": "^1.8.2",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1",
+        "react-router-dom": "^7.1.3",
+        "uuid": "^11.0.5"
       }
     },
     "node_modules/@discord/embedded-app-sdk": {
@@ -26,6 +31,25 @@
         "zod": "^3.9.8"
       }
     },
+    "node_modules/@discord/embedded-app-sdk/node_modules/uuid": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
+    "node_modules/@types/cookie": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.6.0.tgz",
+      "integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==",
+      "license": "MIT"
+    },
     "node_modules/@types/lodash": {
       "version": "4.17.14",
       "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.14.tgz",
@@ -56,6 +80,28 @@
         "node": ">=0.6"
       }
     },
+    "node_modules/cookie": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz",
+      "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/decimal.js-light": {
       "version": "2.5.1",
       "resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
@@ -74,29 +120,151 @@
       "integrity": "sha512-97PMG/aywoYpB4IvbvUJi0RQi8vearvU0oov1WW3k0WZPBMrTQVqekSX5CjSG/M4Q3i6A/0FKXC7RyAoAUUSPw==",
       "license": "MIT"
     },
+    "node_modules/js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+      "license": "MIT"
+    },
     "node_modules/lodash.transform": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.transform/-/lodash.transform-4.6.0.tgz",
       "integrity": "sha512-LO37ZnhmBVx0GvOU/caQuipEh4GN82TcWv3yHlebGDgOxbxiwwzW5Pcx2AcvpIv2WmvmSMoC492yQFNhy/l/UQ==",
       "license": "MIT"
     },
+    "node_modules/loose-envify": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "js-tokens": "^3.0.0 || ^4.0.0"
+      },
+      "bin": {
+        "loose-envify": "cli.js"
+      }
+    },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/pikaday": {
       "version": "1.8.2",
       "resolved": "https://registry.npmjs.org/pikaday/-/pikaday-1.8.2.tgz",
       "integrity": "sha512-TNtsE+34BIax3WtkB/qqu5uepV1McKYEgvL3kWzU7aqPCpMEN6rBF3AOwu4WCwAealWlBGobXny/9kJb49C1ew==",
       "license": "(0BSD OR MIT)"
     },
+    "node_modules/react": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/react-dom": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.23.2"
+      },
+      "peerDependencies": {
+        "react": "^18.3.1"
+      }
+    },
+    "node_modules/react-router": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.1.3.tgz",
+      "integrity": "sha512-EezYymLY6Guk/zLQ2vRA8WvdUhWFEj5fcE3RfWihhxXBW7+cd1LsIiA3lmx+KCmneAGQuyBv820o44L2+TtkSA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/cookie": "^0.6.0",
+        "cookie": "^1.0.1",
+        "set-cookie-parser": "^2.6.0",
+        "turbo-stream": "2.4.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/react-router-dom": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.1.3.tgz",
+      "integrity": "sha512-qQGTE+77hleBzv9SIUIkGRvuFBQGagW+TQKy53UTZAO/3+YFNBYvRsNIZ1GT17yHbc63FylMOdS+m3oUriF1GA==",
+      "license": "MIT",
+      "dependencies": {
+        "react-router": "7.1.3"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      }
+    },
+    "node_modules/scheduler": {
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
+    },
+    "node_modules/set-cookie-parser": {
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
+      "integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==",
+      "license": "MIT"
+    },
+    "node_modules/turbo-stream": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/turbo-stream/-/turbo-stream-2.4.0.tgz",
+      "integrity": "sha512-FHncC10WpBd2eOmGwpmQsWLDoK4cqsA/UT/GqNoaKOQnT8uzhtCbg3EoUDMvqpOSAI0S26mr0rkjzbOO6S3v1g==",
+      "license": "ISC"
+    },
     "node_modules/uuid": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
-      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "version": "11.0.5",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-11.0.5.tgz",
+      "integrity": "sha512-508e6IcKLrhxKdBbcA2b4KQZlLVp2+J5UwQ6F7Drckkc5N9ZJwFa4TgWtsww9UG8fGHbm6gbV19TdM5pQ4GaIA==",
       "funding": [
         "https://github.com/sponsors/broofa",
         "https://github.com/sponsors/ctavan"
       ],
       "license": "MIT",
       "bin": {
-        "uuid": "dist/bin/uuid"
+        "uuid": "dist/esm/bin/uuid"
+      }
+    },
+    "node_modules/vary": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
       }
     },
     "node_modules/zod": {
diff --git a/package.json b/package.json
index 3d65368..c57fa07 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,12 @@
 {
   "dependencies": {
     "@discord/embedded-app-sdk": "^1.9.0",
+    "cors": "^2.8.5",
     "flatpickr": "^4.6.13",
-    "pikaday": "^1.8.2"
+    "pikaday": "^1.8.2",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-router-dom": "^7.1.3",
+    "uuid": "^11.0.5"
   }
 }
diff --git a/server/package-lock.json b/server/package-lock.json
deleted file mode 100644
index a26cfd7..0000000
--- a/server/package-lock.json
+++ /dev/null
@@ -1,836 +0,0 @@
-{
-  "name": "getting-starter-activity-server",
-  "version": "1.0.0",
-  "lockfileVersion": 3,
-  "requires": true,
-  "packages": {
-    "": {
-      "name": "getting-starter-activity-server",
-      "version": "1.0.0",
-      "license": "ISC",
-      "dependencies": {
-        "dotenv": "^16.4.1",
-        "express": "^4.21.2",
-        "node-fetch": "^3.3.2"
-      }
-    },
-    "node_modules/accepts": {
-      "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz",
-      "integrity": "sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==",
-      "dependencies": {
-        "mime-types": "~2.1.34",
-        "negotiator": "0.6.3"
-      },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/array-flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg=="
-    },
-    "node_modules/body-parser": {
-      "version": "1.20.3",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.3.tgz",
-      "integrity": "sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g==",
-      "license": "MIT",
-      "dependencies": {
-        "bytes": "3.1.2",
-        "content-type": "~1.0.5",
-        "debug": "2.6.9",
-        "depd": "2.0.0",
-        "destroy": "1.2.0",
-        "http-errors": "2.0.0",
-        "iconv-lite": "0.4.24",
-        "on-finished": "2.4.1",
-        "qs": "6.13.0",
-        "raw-body": "2.5.2",
-        "type-is": "~1.6.18",
-        "unpipe": "1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.8",
-        "npm": "1.2.8000 || >= 1.4.16"
-      }
-    },
-    "node_modules/bytes": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
-      "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/call-bind": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
-      "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
-      "license": "MIT",
-      "dependencies": {
-        "es-define-property": "^1.0.0",
-        "es-errors": "^1.3.0",
-        "function-bind": "^1.1.2",
-        "get-intrinsic": "^1.2.4",
-        "set-function-length": "^1.2.1"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/content-disposition": {
-      "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
-      "integrity": "sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==",
-      "dependencies": {
-        "safe-buffer": "5.2.1"
-      },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/content-type": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
-      "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/cookie": {
-      "version": "0.7.1",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.1.tgz",
-      "integrity": "sha512-6DnInpx7SJ2AK3+CTUE/ZM0vWTUboZCegxhC2xiIydHR9jNuTAASBrfEpHhiGOZw/nX51bHt6YQl8jsGo4y/0w==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/cookie-signature": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
-      "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ=="
-    },
-    "node_modules/data-uri-to-buffer": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz",
-      "integrity": "sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==",
-      "engines": {
-        "node": ">= 12"
-      }
-    },
-    "node_modules/debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
-      "dependencies": {
-        "ms": "2.0.0"
-      }
-    },
-    "node_modules/define-data-property": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
-      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
-      "license": "MIT",
-      "dependencies": {
-        "es-define-property": "^1.0.0",
-        "es-errors": "^1.3.0",
-        "gopd": "^1.0.1"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/depd": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
-      "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/destroy": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
-      "integrity": "sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==",
-      "engines": {
-        "node": ">= 0.8",
-        "npm": "1.2.8000 || >= 1.4.16"
-      }
-    },
-    "node_modules/dotenv": {
-      "version": "16.4.1",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.1.tgz",
-      "integrity": "sha512-CjA3y+Dr3FyFDOAMnxZEGtnW9KBR2M0JvvUtXNW+dYJL5ROWxP9DUHCwgFqpMk0OXCc0ljhaNTr2w/kutYIcHQ==",
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/motdotla/dotenv?sponsor=1"
-      }
-    },
-    "node_modules/ee-first": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
-      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="
-    },
-    "node_modules/encodeurl": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
-      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/es-define-property": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
-      "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
-      "license": "MIT",
-      "dependencies": {
-        "get-intrinsic": "^1.2.4"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
-    "node_modules/es-errors": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
-      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
-    "node_modules/escape-html": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow=="
-    },
-    "node_modules/etag": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
-      "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/express": {
-      "version": "4.21.2",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.21.2.tgz",
-      "integrity": "sha512-28HqgMZAmih1Czt9ny7qr6ek2qddF4FclbMzwhCREB6OFfH+rXAnuNCwo1/wFvrtbgsQDb4kSbX9de9lFbrXnA==",
-      "license": "MIT",
-      "dependencies": {
-        "accepts": "~1.3.8",
-        "array-flatten": "1.1.1",
-        "body-parser": "1.20.3",
-        "content-disposition": "0.5.4",
-        "content-type": "~1.0.4",
-        "cookie": "0.7.1",
-        "cookie-signature": "1.0.6",
-        "debug": "2.6.9",
-        "depd": "2.0.0",
-        "encodeurl": "~2.0.0",
-        "escape-html": "~1.0.3",
-        "etag": "~1.8.1",
-        "finalhandler": "1.3.1",
-        "fresh": "0.5.2",
-        "http-errors": "2.0.0",
-        "merge-descriptors": "1.0.3",
-        "methods": "~1.1.2",
-        "on-finished": "2.4.1",
-        "parseurl": "~1.3.3",
-        "path-to-regexp": "0.1.12",
-        "proxy-addr": "~2.0.7",
-        "qs": "6.13.0",
-        "range-parser": "~1.2.1",
-        "safe-buffer": "5.2.1",
-        "send": "0.19.0",
-        "serve-static": "1.16.2",
-        "setprototypeof": "1.2.0",
-        "statuses": "2.0.1",
-        "type-is": "~1.6.18",
-        "utils-merge": "1.0.1",
-        "vary": "~1.1.2"
-      },
-      "engines": {
-        "node": ">= 0.10.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/express"
-      }
-    },
-    "node_modules/fetch-blob": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/fetch-blob/-/fetch-blob-3.2.0.tgz",
-      "integrity": "sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/jimmywarting"
-        },
-        {
-          "type": "paypal",
-          "url": "https://paypal.me/jimmywarting"
-        }
-      ],
-      "dependencies": {
-        "node-domexception": "^1.0.0",
-        "web-streams-polyfill": "^3.0.3"
-      },
-      "engines": {
-        "node": "^12.20 || >= 14.13"
-      }
-    },
-    "node_modules/finalhandler": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.3.1.tgz",
-      "integrity": "sha512-6BN9trH7bp3qvnrRyzsBz+g3lZxTNZTbVO2EV1CS0WIcDbawYVdYvGflME/9QP0h0pYlCDBCTjYa9nZzMDpyxQ==",
-      "license": "MIT",
-      "dependencies": {
-        "debug": "2.6.9",
-        "encodeurl": "~2.0.0",
-        "escape-html": "~1.0.3",
-        "on-finished": "2.4.1",
-        "parseurl": "~1.3.3",
-        "statuses": "2.0.1",
-        "unpipe": "~1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/formdata-polyfill": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
-      "integrity": "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==",
-      "dependencies": {
-        "fetch-blob": "^3.1.2"
-      },
-      "engines": {
-        "node": ">=12.20.0"
-      }
-    },
-    "node_modules/forwarded": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
-      "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/fresh": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
-      "integrity": "sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/function-bind": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
-      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
-      "license": "MIT",
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/get-intrinsic": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
-      "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
-      "license": "MIT",
-      "dependencies": {
-        "es-errors": "^1.3.0",
-        "function-bind": "^1.1.2",
-        "has-proto": "^1.0.1",
-        "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/gopd": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
-      "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==",
-      "license": "MIT",
-      "dependencies": {
-        "get-intrinsic": "^1.1.3"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/has-property-descriptors": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
-      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
-      "license": "MIT",
-      "dependencies": {
-        "es-define-property": "^1.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/has-proto": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
-      "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/has-symbols": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz",
-      "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/hasown": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
-      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-      "license": "MIT",
-      "dependencies": {
-        "function-bind": "^1.1.2"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
-    "node_modules/http-errors": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.0.tgz",
-      "integrity": "sha512-FtwrG/euBzaEjYeRqOgly7G0qviiXoJWnvEH2Z1plBdXgbyjv34pHTSb9zoeHMyDy33+DWy5Wt9Wo+TURtOYSQ==",
-      "dependencies": {
-        "depd": "2.0.0",
-        "inherits": "2.0.4",
-        "setprototypeof": "1.2.0",
-        "statuses": "2.0.1",
-        "toidentifier": "1.0.1"
-      },
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/iconv-lite": {
-      "version": "0.4.24",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
-      "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
-      "license": "MIT",
-      "dependencies": {
-        "safer-buffer": ">= 2.1.2 < 3"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/inherits": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
-    },
-    "node_modules/ipaddr.js": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
-      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
-      "engines": {
-        "node": ">= 0.10"
-      }
-    },
-    "node_modules/media-typer": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
-      "integrity": "sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/merge-descriptors": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.3.tgz",
-      "integrity": "sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==",
-      "license": "MIT",
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/methods": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
-      "integrity": "sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/mime": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
-      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
-      "bin": {
-        "mime": "cli.js"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/mime-db": {
-      "version": "1.52.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
-      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/mime-types": {
-      "version": "2.1.35",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
-      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
-      "dependencies": {
-        "mime-db": "1.52.0"
-      },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A=="
-    },
-    "node_modules/negotiator": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
-      "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/node-domexception": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
-      "integrity": "sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/jimmywarting"
-        },
-        {
-          "type": "github",
-          "url": "https://paypal.me/jimmywarting"
-        }
-      ],
-      "engines": {
-        "node": ">=10.5.0"
-      }
-    },
-    "node_modules/node-fetch": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-3.3.2.tgz",
-      "integrity": "sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA==",
-      "dependencies": {
-        "data-uri-to-buffer": "^4.0.0",
-        "fetch-blob": "^3.1.4",
-        "formdata-polyfill": "^4.0.10"
-      },
-      "engines": {
-        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/node-fetch"
-      }
-    },
-    "node_modules/object-inspect": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz",
-      "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==",
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/on-finished": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
-      "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
-      "dependencies": {
-        "ee-first": "1.1.1"
-      },
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/parseurl": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
-      "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/path-to-regexp": {
-      "version": "0.1.12",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.12.tgz",
-      "integrity": "sha512-RA1GjUVMnvYFxuqovrEqZoxxW5NUZqbwKtYz/Tt7nXerk0LbLblQmrsgdeOxV5SFHf0UDggjS/bSeOZwt1pmEQ==",
-      "license": "MIT"
-    },
-    "node_modules/proxy-addr": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
-      "integrity": "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==",
-      "dependencies": {
-        "forwarded": "0.2.0",
-        "ipaddr.js": "1.9.1"
-      },
-      "engines": {
-        "node": ">= 0.10"
-      }
-    },
-    "node_modules/qs": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz",
-      "integrity": "sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==",
-      "license": "BSD-3-Clause",
-      "dependencies": {
-        "side-channel": "^1.0.6"
-      },
-      "engines": {
-        "node": ">=0.6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/range-parser": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
-      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/raw-body": {
-      "version": "2.5.2",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.2.tgz",
-      "integrity": "sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==",
-      "license": "MIT",
-      "dependencies": {
-        "bytes": "3.1.2",
-        "http-errors": "2.0.0",
-        "iconv-lite": "0.4.24",
-        "unpipe": "1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/safe-buffer": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
-        }
-      ]
-    },
-    "node_modules/safer-buffer": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
-      "license": "MIT"
-    },
-    "node_modules/send": {
-      "version": "0.19.0",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.19.0.tgz",
-      "integrity": "sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw==",
-      "license": "MIT",
-      "dependencies": {
-        "debug": "2.6.9",
-        "depd": "2.0.0",
-        "destroy": "1.2.0",
-        "encodeurl": "~1.0.2",
-        "escape-html": "~1.0.3",
-        "etag": "~1.8.1",
-        "fresh": "0.5.2",
-        "http-errors": "2.0.0",
-        "mime": "1.6.0",
-        "ms": "2.1.3",
-        "on-finished": "2.4.1",
-        "range-parser": "~1.2.1",
-        "statuses": "2.0.1"
-      },
-      "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
-    "node_modules/send/node_modules/encodeurl": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
-      "integrity": "sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/send/node_modules/ms": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
-      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-      "license": "MIT"
-    },
-    "node_modules/serve-static": {
-      "version": "1.16.2",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.16.2.tgz",
-      "integrity": "sha512-VqpjJZKadQB/PEbEwvFdO43Ax5dFBZ2UECszz8bQ7pi7wt//PWe1P6MN7eCnjsatYtBT6EuiClbjSWP2WrIoTw==",
-      "license": "MIT",
-      "dependencies": {
-        "encodeurl": "~2.0.0",
-        "escape-html": "~1.0.3",
-        "parseurl": "~1.3.3",
-        "send": "0.19.0"
-      },
-      "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
-    "node_modules/set-function-length": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
-      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
-      "license": "MIT",
-      "dependencies": {
-        "define-data-property": "^1.1.4",
-        "es-errors": "^1.3.0",
-        "function-bind": "^1.1.2",
-        "get-intrinsic": "^1.2.4",
-        "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.2"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
-    "node_modules/setprototypeof": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
-      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw=="
-    },
-    "node_modules/side-channel": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz",
-      "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==",
-      "license": "MIT",
-      "dependencies": {
-        "call-bind": "^1.0.7",
-        "es-errors": "^1.3.0",
-        "get-intrinsic": "^1.2.4",
-        "object-inspect": "^1.13.1"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/statuses": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz",
-      "integrity": "sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/toidentifier": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
-      "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==",
-      "engines": {
-        "node": ">=0.6"
-      }
-    },
-    "node_modules/type-is": {
-      "version": "1.6.18",
-      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
-      "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
-      "dependencies": {
-        "media-typer": "0.3.0",
-        "mime-types": "~2.1.24"
-      },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
-    "node_modules/unpipe": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
-      "integrity": "sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/utils-merge": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
-      "integrity": "sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==",
-      "engines": {
-        "node": ">= 0.4.0"
-      }
-    },
-    "node_modules/vary": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
-      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
-    "node_modules/web-streams-polyfill": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.3.2.tgz",
-      "integrity": "sha512-3pRGuxRF5gpuZc0W+EpwQRmCD7gRqcDOMt688KmdlDAgAyaB1XlN0zq2njfDNm44XVdIouE7pZ6GzbdyH47uIQ==",
-      "engines": {
-        "node": ">= 8"
-      }
-    }
-  }
-}
diff --git a/server/package.json b/server/package.json
deleted file mode 100644
index 8500952..0000000
--- a/server/package.json
+++ /dev/null
@@ -1,18 +0,0 @@
-{
-  "name": "getting-starter-activity-server",
-  "version": "1.0.0",
-  "description": "",
-  "main": "server.js",
-  "type": "module",
-  "scripts": {
-    "dev": "npm start"
-  },
-  "keywords": [],
-  "author": "",
-  "license": "ISC",
-  "dependencies": {
-    "dotenv": "^16.4.1",
-    "express": "^4.21.2",
-    "node-fetch": "^3.3.2"
-  }
-}
diff --git a/server/server.js b/server/server.js
deleted file mode 100644
index 34d1803..0000000
--- a/server/server.js
+++ /dev/null
@@ -1,41 +0,0 @@
-import express from "express";
-import dotenv from "dotenv";
-import fetch from "node-fetch";
-dotenv.config({ path: "../.env" });
-
-const app = express();
-const port = 3001;
-
-// Allow express to parse JSON bodies
-app.use(express.json());
-
-app.post("/api/token", async (req, res) => {
-  
-  // Exchange the code for an access_token
-  const response = await fetch(`https://discord.com/api/oauth2/token`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/x-www-form-urlencoded",
-    },
-    body: new URLSearchParams({
-      client_id: process.env.VITE_DISCORD_CLIENT_ID,
-      client_secret: process.env.DISCORD_CLIENT_SECRET,
-      grant_type: "authorization_code",
-      code: req.body.code,
-    }),
-  });
-
-  // Retrieve the access_token from the response
-  const resp = await response.json();
-  const { access_token } = resp
-
-  // Return the access_token to our client as { access_token: "..."}
-  console.log(resp)
-  res.send({access_token});
-});
-
-console.log(process.env)
-
-app.listen(port, () => {
-  console.log(`Server listening at http://localhost:${port}`);
-});