feat: integrate ConfirmationModal for quitting all courses with user confirmation

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

@@ -12,6 +12,7 @@ import useSWR from 'swr'
 import { removeCourse } from '@services/courses/activity'
 import { revalidateTags } from '@services/utils/ts/requests'
 import { useRouter } from 'next/navigation'
+import ConfirmationModal from '@components/Objects/StyledElements/ConfirmationModal/ConfirmationModal'
 
 function Trail(params: any) {
   let orgslug = params.orgslug
@@ -59,8 +60,12 @@ function Trail(params: any) {
       <div className="flex justify-between items-center mb-6">
         <TypeOfContentTitle title="Trail" type="tra" />
         {trail?.runs?.length > 0 && (
+          <ConfirmationModal
+            confirmationButtonText={isQuittingAll ? `Quitting Courses (${quittingProgress}%)` : "Quit All Courses"}
+            confirmationMessage="Are you sure you want to quit all courses? This action cannot be undone and you will lose all your progress."
+            dialogTitle="Quit All Courses?"
+            dialogTrigger={
               <button
-            onClick={handleQuitAllCourses}
                 disabled={isQuittingAll}
                 className={`px-4 py-2 rounded-lg font-medium text-sm transition-all
                   ${isQuittingAll 
@@ -73,6 +78,10 @@ function Trail(params: any) {
                   : 'Quit All Courses'
                 }
               </button>
+            }
+            functionToExecute={handleQuitAllCourses}
+            status="warning"
+          />
         )}
       </div>
       {!trail ? (