fix: trail related bugs + general design improvements

apps/web/app/orgs/[orgslug]/(withmenu)/collections/page.tsx

@@ -8,7 +8,7 @@ import { Metadata } from "next";
 import { cookies } from "next/headers";
 import Link from "next/link";
 import { getAccessTokenFromRefreshTokenCookie } from "@services/auth/auth";
-import CollectionThumbnail from "@components/Objects/Other/CollectionThumbnail";
+import CollectionThumbnail from "@components/Objects/Thumbnails/CollectionThumbnail";
 import NewCollectionButton from "@components/StyledElements/Buttons/NewCollectionButton";
 
 type MetadataProps = {

apps/web/app/orgs/[orgslug]/(withmenu)/course/[courseuuid]/activity/[activityid]/activity.tsx

@@ -57,7 +57,7 @@ function ActivityClient(props: ActivityClientProps) {
               <h1 className="font-bold text-gray-950 text-2xl first-letter:uppercase" >{course.name}</h1>
             </div>
           </div>
-          <ActivityIndicators course_uuid={courseuuid} current_activity={activityid} orgslug={orgslug} course={course} />
+          <ActivityIndicators course_uuid={courseuuid} current_activity={activityid} activity={activity} orgslug={orgslug} course={course} />
 
           <div className="flex justify-between items-center">
             <div className="flex flex-col -space-y-1">
@@ -66,7 +66,7 @@ function ActivityClient(props: ActivityClientProps) {
             </div>
             <div className="flex space-x-2">
               <AuthenticatedClientElement checkMethod="authentication">
-                <MarkStatus activityid={activityid} course={course} orgslug={orgslug} courseid={courseuuid} />
+                <MarkStatus activity={activity} activityid={activityid} course={course} orgslug={orgslug} />
 
               </AuthenticatedClientElement>
             </div>
@@ -91,23 +91,26 @@ function ActivityClient(props: ActivityClientProps) {
 
 
 
-export function MarkStatus(props: { activityid: string, course: any, orgslug: string, courseid: string }) {
+export function MarkStatus(props: { activity: any, activityid: string, course: any, orgslug: string }) {
   const router = useRouter();
-
+  console.log(props.course.trail)
 
   async function markActivityAsCompleteFront() {
-    const trail = await markActivityAsComplete(props.orgslug, props.courseid, props.activityid);
+    const trail = await markActivityAsComplete(props.orgslug, props.course.course_uuid, 'activity_' + props.activityid);
     router.refresh();
-
-    // refresh page (FIX for Next.js BUG)
-    //window.location.reload();
-
   }
 
+  const isActivityCompleted = () => {
+    let run = props.course.trail.runs.find((run: any) => run.course_id == props.course.id);
+    if (run) {
+      return run.steps.find((step: any) => step.activity_id == props.activity.id);
+    }
+  }
+
+  console.log('isActivityCompleted', isActivityCompleted());
+
   return (
-    <>{props.course.trail.activities_marked_complete &&
-      props.course.trail.activities_marked_complete.includes("activity_" + props.activityid) &&
-      props.course.trail.status == "ongoing" ? (
+    <>{ isActivityCompleted() ? (
       <div className="bg-teal-600 rounded-md drop-shadow-md flex flex-col p-3 text-sm text-white hover:cursor-pointer transition delay-150 duration-300 ease-in-out" >
         <i>
           <Check size={15}></Check>

apps/web/app/orgs/[orgslug]/(withmenu)/courses/courses.tsx

@@ -6,7 +6,7 @@ import { useSearchParams } from 'next/navigation';
 import GeneralWrapperStyled from '@components/StyledElements/Wrappers/GeneralWrapper';
 import TypeOfContentTitle from '@components/StyledElements/Titles/TypeOfContentTitle';
 import AuthenticatedClientElement from '@components/Security/AuthenticatedClientElement';
-import CourseThumbnail from '@components/Objects/Other/CourseThumbnail';
+import CourseThumbnail from '@components/Objects/Thumbnails/CourseThumbnail';
 import NewCourseButton from '@components/StyledElements/Buttons/NewCourseButton';
 
 interface CourseProps {

apps/web/app/orgs/[orgslug]/(withmenu)/page.tsx

@@ -9,8 +9,8 @@ import { cookies } from 'next/headers';
 import GeneralWrapperStyled from '@components/StyledElements/Wrappers/GeneralWrapper';
 import TypeOfContentTitle from '@components/StyledElements/Titles/TypeOfContentTitle';
 import { getAccessTokenFromRefreshTokenCookie } from '@services/auth/auth';
-import CourseThumbnail from '@components/Objects/Other/CourseThumbnail';
-import CollectionThumbnail from '@components/Objects/Other/CollectionThumbnail';
+import CourseThumbnail from '@components/Objects/Thumbnails/CourseThumbnail';
+import CollectionThumbnail from '@components/Objects/Thumbnails/CollectionThumbnail';
 import AuthenticatedClientElement from '@components/Security/AuthenticatedClientElement';
 import { Plus, PlusCircle } from 'lucide-react';
 import NewCourseButton from '@components/StyledElements/Buttons/NewCourseButton';

apps/web/app/orgs/[orgslug]/(withmenu)/trail/trail.tsx

@@ -1,4 +1,5 @@
 "use client";
+import { useOrg } from "@components/Contexts/OrgContext";
 import PageLoading from "@components/Objects/Loaders/PageLoading";
 import TrailCourseElement from "@components/Pages/Trail/TrailCourseElement";
 import TypeOfContentTitle from "@components/StyledElements/Titles/TypeOfContentTitle";
@@ -6,13 +7,18 @@ import GeneralWrapperStyled from "@components/StyledElements/Wrappers/GeneralWra
 import { getAPIUrl } from "@services/config/config";
 import { removeCourse } from "@services/courses/activity";
 import { revalidateTags, swrFetcher } from "@services/utils/ts/requests";
-import React from "react";
+import React, { useEffect } from "react";
 import useSWR, { mutate } from "swr";
 
 function Trail(params: any) {
   let orgslug = params.orgslug;
-  const { data: trail, error: error } = useSWR(`${getAPIUrl()}trail/org_slug/${orgslug}/trail`, swrFetcher);
+  const org = useOrg() as any;
+  const orgID = org?.id;
+  const { data: trail, error: error } = useSWR(`${getAPIUrl()}trail/org/${orgID}/trail`, swrFetcher);
 
+  useEffect(() => {
+  }
+    , [trail,org]);
 
   return (
     <GeneralWrapperStyled>
@@ -21,12 +27,10 @@ function Trail(params: any) {
         <PageLoading></PageLoading>
       ) : (
         <div className="space-y-6">
-          {trail.courses.map((course: any) => (
-            !course.masked ? (
-              <TrailCourseElement key={trail.trail_id} orgslug={orgslug} course={course} />
-            ) : (
-              <></>
-            )
+          {trail.runs.map((run: any) => (
+            <>
+              <TrailCourseElement run={run} course={run.course} orgslug={orgslug} />
+            </>
 
           ))}
 

apps/web/app/orgs/[orgslug]/dash/courses/client.tsx

@@ -1,7 +1,7 @@
 'use client';
 import BreadCrumbs from '@components/Dashboard/UI/BreadCrumbs'
 import CreateCourseModal from '@components/Objects/Modals/Course/Create/CreateCourse';
-import CourseThumbnail from '@components/Objects/Other/CourseThumbnail';
+import CourseThumbnail from '@components/Objects/Thumbnails/CourseThumbnail';
 import AuthenticatedClientElement from '@components/Security/AuthenticatedClientElement';
 import NewCourseButton from '@components/StyledElements/Buttons/NewCourseButton';
 import Modal from '@components/StyledElements/Modal/Modal';