Dashboard over haul

package.json

@@ -26,6 +26,7 @@
     "@sveltejs/adapter-auto": "^2.0.0",
     "@sveltejs/adapter-node": "1.2.4",
     "@sveltejs/kit": "^1.5.0",
+    "@floating-ui/dom": "1.6.10",
     "@tailwindcss/forms": "^0.5.6",
     "@types/bcrypt": "^5.0.0",
     "@types/identicon.js": "^2.3.1",

prisma/schema.prisma

@@ -121,8 +121,8 @@ model Picture {
   id        Int        @id @default(autoincrement())
   title     String?
   caption   String?
-  data      String?
-  isLocal   Boolean    @default(value: true)
+  data      String? 
+  isLocal   Boolean    @default(value: false)
   createdAt DateTime   @default(now())
   updatedAt DateTime   @updatedAt
   Article   Article[]
@@ -165,6 +165,8 @@ model Article {
 model Team {
   id         String   @id @unique @default(uuid())
   name       String
+  teamLead   Member?  @relation("TeamLead", fields: [teamLeadId], references: [id])
+  teamLeadId String? // Foreign key for team lead
   members    Member[]
   maxMembers Int
   minMembers Int
@@ -186,10 +188,10 @@ model Project {
   updatedAt          DateTime             @updatedAt
   description        String
   logo               Picture?             @relation(fields: [pictureId], references: [id])
-  budget             Float
+  budget             Float?
   docsLink           String               @default("")
   extraLinks         Link[]
-  remainingFunds     Float
+  remainingFunds     Float?
   season             Season               @default(value: Fall)
   year               Int
   articles           Article[]
@@ -200,6 +202,8 @@ model Project {
   Tags               Tag[]
   Skills             String[]
   projectType        projectType          @default(value: standard)
+  projectLead        Member?              @relation("ProjectLead", fields: [projectLeadId], references: [id])
+  projectLeadId      String? // Foreign key for project lead
   teams              Team[] // possibility for no teams created if project does not require them
 }
 
@@ -217,14 +221,16 @@ model Member {
   role               Role                @relation(fields: [roleId], references: [id])
   roleId             Int
   Articles           Article[]
-  Projects           Project[]
   BlogPost           BlogPost[]
   Account            Account?            @relation(fields: [accountId], references: [id])
   accountId          Int?
+  Projects           Project[]
   Teams              Team[]
   Survey             Survey?             @relation(fields: [surveyId], references: [id])
   surveyId           Int?
   PasswordResetToken PasswordResetToken?
+  teamLead           Team[]              @relation("TeamLead")
+  projectLead        Project[]           @relation("ProjectLead")
 }
 
 model Sponsor {

src/components/projectCard.svelte

@@ -3,39 +3,55 @@
 
   export let project: Project & { logo: Picture };
   let hover = false;
+
+  // Function to truncate description to 2 sentences
+  function truncateDescription(description: string): string {
+    const sentences = description.split('. ').filter((s) => s.trim() !== '');
+    return sentences.length > 2
+      ? `${sentences.slice(0, 2).join('. ')}...`
+      : description;
+  }
 </script>
 
-<a href="./projects/{project.id}">
+<a href="/projects/{project.id}">
   <div
-    class="card h-72 max-w-72 rounded-lg relative"
+    class="card h-72 max-w-72 rounded-lg relative flex flex-col"
     on:mouseenter={() => {
       hover = true;
     }}
     on:mouseleave={() => {
       hover = false;
     }}
   >
-    {#if !hover}
-      <!-- if not hovering, just show the picture and the title over it -->
-      {#if project.logo.isLocal}
-        <!-- load the image using the b64 method -->
+    <!-- Project Title Section -->
+    <div class="p-4 text-center">
+      <h3 class="h3 font-bold">{project.title}</h3>
+    </div>
+
+    <!-- Image and Hover Details -->
+    <div class="relative flex-1">
+      {#if !hover}
+        <!-- if not hovering, just show the picture -->
+        {#if project.logo.isLocal}
+          <!-- load the image using the b64 method -->
+        {:else}
+          <img
+            class="h-full w-full rounded-lg object-contain overflow-hidden"
+            src={project.logo.data}
+            alt=""
+          />
+        {/if}
       {:else}
-        <div class="absolute m-5 p-2 h3 rounded-lg variant-filled-surface">{project.title}</div>
-        <img
-          class="h-72 w-full rounded-lg object-cover overflow-hidden"
-          src={project.logo.data}
-          alt=""
-        />
+        <!-- if hovering, display the goods -->
+        <div class="absolute inset-0 p-4 bg-white bg-opacity-80 flex flex-col justify-center items-center rounded-lg">
+          <p class="mb-2 text-center">{truncateDescription(project.description)}</p>
+          <div class="flex flex-wrap gap-2 justify-center">
+            {#each project.Skills as skill}
+              <span class="badge variant-filled-surface">{skill}</span>
+            {/each}
+          </div>
+        </div>
       {/if}
-    {:else}
-      <!-- if hovering, display the goods -->
-      <div class="absolute p-2">
-        <h3 class="h3 m-5">{project.title}</h3>
-        <p>{project.description}</p>
-        {#each project.Skills as skill}
-          <span class="badge variant-filled-surface">{skill}</span>
-        {/each}
-      </div>
-    {/if}
-  </div></a
->
+    </div>
+  </div>
+</a>

src/components/stripe/payments.svelte

@@ -12,7 +12,8 @@
   let processing = false;
   export let userID: string;
   let thm: 'night' | 'stripe' | 'flat' | undefined = 'night';
-  let duesSelection = '1';
+  let duesSelection = '';
+  let hide: boolean = false;
 
   const appearance = {
     theme: thm,
@@ -22,17 +23,17 @@
   onMount(async () => {
     stripe = await loadStripe(PUBLIC_STRIPE_KEY);
 
-    // create payment intent server side
-    clientSecret = await createPayment();
+    // clientSecret = await createPayment();
   });
 
   async function createPayment() {
+
     const response = await fetch('/create-payment-intent', {
       method: 'POST',
       headers: {
         'content-type': 'application/json'
       },
-      body: JSON.stringify({})
+      body: JSON.stringify({ duesType: duesSelection })
     });
     const { clientSecret } = await response.json();
 
@@ -62,20 +63,44 @@
       }
     }
   }
+
+  function reloadPage(){
+    location.reload();
+  }
+
+  async function test(){
+    // create payment intent server side
+    clientSecret = await createPayment();
+    hide = true;
+  }
 </script>
 
-<!-- <label class="label">
-  <span>Select Yearly or Semesterly Dues</span>
-  <select class="select" bind:value={duesSelection}>
-    <option value="1">1 Year</option>
-    <option value="2">1 Semester</option>
-  </select>
-</label> -->
 {#if error}
   <h4 class="h4">Please try again</h4>
   <p class="badge variant-filled-error">{error.message}</p>
 {/if}
 
+{#if !hide}
+<label class="label">
+  <span>Pay Dues For The Semester or Year</span>
+  <select class="select" bind:value={duesSelection} on:change={test}>
+    <option value='1'>Semester: $25</option>
+    <option value='2'>Year: $50</option>
+  </select>
+</label>
+{:else}
+  {#if duesSelection == '1'}
+    <span>Semesterly Dues</span>
+    <button on:click={reloadPage} class="btn variant-ghost-tertiary hover:variant-filled-tertiary">Cancel</button>
+
+  {/if}
+  {#if duesSelection == '2'}
+    <span>Yearly Dues</span>
+    <button on:click={reloadPage} class="btn variant-ghost-tertiary hover:variant-filled-tertiary">Cancel</button>
+
+  {/if}
+{/if}
+
 {#if duesSelection}
   {#if clientSecret && stripe}
     <Elements
@@ -96,7 +121,12 @@
           {#if processing}
             Processing...
           {:else}
+            {#if duesSelection === '1'}
             Pay ${config.paypal.semester_cost}
+            {/if}
+            {#if duesSelection === '2'}
+            Pay ${config.paypal.year_cost}
+            {/if}
           {/if}
         </button>
       </form>

src/components/toasts/failToast.ts

@@ -0,0 +1,9 @@
+import { getToastStore, type ToastSettings } from '@skeletonlabs/skeleton';
+
+export default (message: string) => {
+	const ts = {
+		message: message,
+		background: 'variant-filled-error'
+	} satisfies ToastSettings;
+	getToastStore().trigger(ts);
+};

src/config.ts

@@ -33,20 +33,28 @@ export default {
    * when roles in the future etc. Treasurser, come in to play, they can have a permission level to themselves, or even
    */
   roles: {
-    officer: {
-      level: 10,
-      name: 'officer'
+    admin:{
+      level: 5,
+      name: 'admin'
     },
-    lead: {
-      level: 8,
-      name: 'lead'
+    president:{
+      level: 5,
+      name: 'president'
     },
-    committee: {
-      level: 6,
-      name: 'committee'
+    officers: {
+      level: 4,
+      name: 'officers'
+    },
+    project_lead:{
+      level: 3,
+      name: 'project lead'
+    },
+    team_lead: {
+      level: 2,
+      name: ' team lead'
     },
     member: {
-      level: 4,
+      level: 1,
       name: 'member'
     },
     guest: {