diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..843828d
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,17 @@
+{
+    // Set the default
+    "editor.formatOnSave": false,
+    // Enable per-language
+    "[javascript]": {
+        "editor.formatOnSave": true
+    },
+    "[typescript]": {
+        "editor.formatOnSave": true
+    },
+    "[typescriptreact]": {
+        "editor.formatOnSave": true
+    },
+    "[html]": {
+        "editor.formatOnSave": true
+    },
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index cd7772f..04dd443 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -20,6 +20,7 @@
         "@radix-ui/react-navigation-menu": "^1.1.4",
         "@radix-ui/react-popover": "^1.0.7",
         "@radix-ui/react-scroll-area": "^1.0.5",
+        "@radix-ui/react-select": "^2.0.0",
         "@radix-ui/react-separator": "^1.0.3",
         "@radix-ui/react-slider": "^1.1.2",
         "@radix-ui/react-slot": "^1.0.2",
@@ -33,7 +34,7 @@
         "cmdk": "^0.2.1",
         "date-fns": "^3.3.1",
         "lucide-react": "^0.314.0",
-        "next": "14.1.0",
+        "next": "^14.2.3",
         "next-themes": "^0.2.1",
         "react": "^18",
         "react-day-picker": "^8.10.0",
@@ -294,9 +295,9 @@
       }
     },
     "node_modules/@next/env": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/env/-/env-14.1.0.tgz",
-      "integrity": "sha512-Py8zIo+02ht82brwwhTg36iogzFqGLPXlRGKQw5s+qP/kMNc4MAyDeEwBKDijk6zTIbegEgu8Qy7C1LboslQAw=="
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/env/-/env-14.2.3.tgz",
+      "integrity": "sha512-W7fd7IbkfmeeY2gXrzJYDx8D2lWKbVoTIj1o1ScPHNzvp30s1AuoEFSdr39bC5sjxJaxTtq3OTCZboNp0lNWHA=="
     },
     "node_modules/@next/eslint-plugin-next": {
       "version": "14.1.0",
@@ -308,9 +309,9 @@
       }
     },
     "node_modules/@next/swc-darwin-arm64": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.1.0.tgz",
-      "integrity": "sha512-nUDn7TOGcIeyQni6lZHfzNoo9S0euXnu0jhsbMOmMJUBfgsnESdjN97kM7cBqQxZa8L/bM9om/S5/1dzCrW6wQ==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.3.tgz",
+      "integrity": "sha512-3pEYo/RaGqPP0YzwnlmPN2puaF2WMLM3apt5jLW2fFdXD9+pqcoTzRk+iZsf8ta7+quAe4Q6Ms0nR0SFGFdS1A==",
       "cpu": [
         "arm64"
       ],
@@ -323,9 +324,9 @@
       }
     },
     "node_modules/@next/swc-darwin-x64": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.1.0.tgz",
-      "integrity": "sha512-1jgudN5haWxiAl3O1ljUS2GfupPmcftu2RYJqZiMJmmbBT5M1XDffjUtRUzP4W3cBHsrvkfOFdQ71hAreNQP6g==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.3.tgz",
+      "integrity": "sha512-6adp7waE6P1TYFSXpY366xwsOnEXM+y1kgRpjSRVI2CBDOcbRjsJ67Z6EgKIqWIue52d2q/Mx8g9MszARj8IEA==",
       "cpu": [
         "x64"
       ],
@@ -338,9 +339,9 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-gnu": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.1.0.tgz",
-      "integrity": "sha512-RHo7Tcj+jllXUbK7xk2NyIDod3YcCPDZxj1WLIYxd709BQ7WuRYl3OWUNG+WUfqeQBds6kvZYlc42NJJTNi4tQ==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.3.tgz",
+      "integrity": "sha512-cuzCE/1G0ZSnTAHJPUT1rPgQx1w5tzSX7POXSLaS7w2nIUJUD+e25QoXD/hMfxbsT9rslEXugWypJMILBj/QsA==",
       "cpu": [
         "arm64"
       ],
@@ -353,9 +354,9 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-musl": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.1.0.tgz",
-      "integrity": "sha512-v6kP8sHYxjO8RwHmWMJSq7VZP2nYCkRVQ0qolh2l6xroe9QjbgV8siTbduED4u0hlk0+tjS6/Tuy4n5XCp+l6g==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.3.tgz",
+      "integrity": "sha512-0D4/oMM2Y9Ta3nGuCcQN8jjJjmDPYpHX9OJzqk42NZGJocU2MqhBq5tWkJrUQOQY9N+In9xOdymzapM09GeiZw==",
       "cpu": [
         "arm64"
       ],
@@ -368,9 +369,9 @@
       }
     },
     "node_modules/@next/swc-linux-x64-gnu": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.1.0.tgz",
-      "integrity": "sha512-zJ2pnoFYB1F4vmEVlb/eSe+VH679zT1VdXlZKX+pE66grOgjmKJHKacf82g/sWE4MQ4Rk2FMBCRnX+l6/TVYzQ==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.3.tgz",
+      "integrity": "sha512-ENPiNnBNDInBLyUU5ii8PMQh+4XLr4pG51tOp6aJ9xqFQ2iRI6IH0Ds2yJkAzNV1CfyagcyzPfROMViS2wOZ9w==",
       "cpu": [
         "x64"
       ],
@@ -383,9 +384,9 @@
       }
     },
     "node_modules/@next/swc-linux-x64-musl": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.1.0.tgz",
-      "integrity": "sha512-rbaIYFt2X9YZBSbH/CwGAjbBG2/MrACCVu2X0+kSykHzHnYH5FjHxwXLkcoJ10cX0aWCEynpu+rP76x0914atg==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.3.tgz",
+      "integrity": "sha512-BTAbq0LnCbF5MtoM7I/9UeUu/8ZBY0i8SFjUMCbPDOLv+un67e2JgyN4pmgfXBwy/I+RHu8q+k+MCkDN6P9ViQ==",
       "cpu": [
         "x64"
       ],
@@ -398,9 +399,9 @@
       }
     },
     "node_modules/@next/swc-win32-arm64-msvc": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.1.0.tgz",
-      "integrity": "sha512-o1N5TsYc8f/HpGt39OUQpQ9AKIGApd3QLueu7hXk//2xq5Z9OxmV6sQfNp8C7qYmiOlHYODOGqNNa0e9jvchGQ==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.3.tgz",
+      "integrity": "sha512-AEHIw/dhAMLNFJFJIJIyOFDzrzI5bAjI9J26gbO5xhAKHYTZ9Or04BesFPXiAYXDNdrwTP2dQceYA4dL1geu8A==",
       "cpu": [
         "arm64"
       ],
@@ -413,9 +414,9 @@
       }
     },
     "node_modules/@next/swc-win32-ia32-msvc": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.1.0.tgz",
-      "integrity": "sha512-XXIuB1DBRCFwNO6EEzCTMHT5pauwaSj4SWs7CYnME57eaReAKBXCnkUE80p/pAZcewm7hs+vGvNqDPacEXHVkw==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.3.tgz",
+      "integrity": "sha512-vga40n1q6aYb0CLrM+eEmisfKCR45ixQYXuBXxOOmmoV8sYST9k7E3US32FsY+CkkF7NtzdcebiFT4CHuMSyZw==",
       "cpu": [
         "ia32"
       ],
@@ -428,9 +429,9 @@
       }
     },
     "node_modules/@next/swc-win32-x64-msvc": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.1.0.tgz",
-      "integrity": "sha512-9WEbVRRAqJ3YFVqEZIxUqkiO8l1nool1LmNxygr5HWF8AcSYsEpneUDhmjUVJEzO2A04+oPtZdombzzPPkTtgg==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.3.tgz",
+      "integrity": "sha512-Q1/zm43RWynxrO7lW4ehciQVj+5ePBhOK+/K2P7pLFX3JaJ/IZVC69SHidrmZSOkqz7ECIOhhy7XhAFG4JYyHA==",
       "cpu": [
         "x64"
       ],
@@ -1204,6 +1205,49 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-select": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-select/-/react-select-2.0.0.tgz",
+      "integrity": "sha512-RH5b7af4oHtkcHS7pG6Sgv5rk5Wxa7XI8W5gvB1N/yiuDGZxko1ynvOiVhFM7Cis2A8zxF9bTOUVbRDzPepe6w==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/number": "1.0.1",
+        "@radix-ui/primitive": "1.0.1",
+        "@radix-ui/react-collection": "1.0.3",
+        "@radix-ui/react-compose-refs": "1.0.1",
+        "@radix-ui/react-context": "1.0.1",
+        "@radix-ui/react-direction": "1.0.1",
+        "@radix-ui/react-dismissable-layer": "1.0.5",
+        "@radix-ui/react-focus-guards": "1.0.1",
+        "@radix-ui/react-focus-scope": "1.0.4",
+        "@radix-ui/react-id": "1.0.1",
+        "@radix-ui/react-popper": "1.1.3",
+        "@radix-ui/react-portal": "1.0.4",
+        "@radix-ui/react-primitive": "1.0.3",
+        "@radix-ui/react-slot": "1.0.2",
+        "@radix-ui/react-use-callback-ref": "1.0.1",
+        "@radix-ui/react-use-controllable-state": "1.0.1",
+        "@radix-ui/react-use-layout-effect": "1.0.1",
+        "@radix-ui/react-use-previous": "1.0.1",
+        "@radix-ui/react-visually-hidden": "1.0.3",
+        "aria-hidden": "^1.1.1",
+        "react-remove-scroll": "2.5.5"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0",
+        "react-dom": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@radix-ui/react-separator": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-separator/-/react-separator-1.0.3.tgz",
@@ -1565,11 +1609,17 @@
       "integrity": "sha512-hw437iINopmQuxWPSUEvqE56NCPsiU8N4AYtfHmJFckclktzK9YQJieD3XkDCDH4OjL+C7zgPUh73R/nrcHrqw==",
       "dev": true
     },
+    "node_modules/@swc/counter": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/@swc/counter/-/counter-0.1.3.tgz",
+      "integrity": "sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ=="
+    },
     "node_modules/@swc/helpers": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.2.tgz",
-      "integrity": "sha512-E4KcWTpoLHqwPHLxidpOqQbcrZVgi0rsmmZXUle1jXmJfuIf/UWpczUJ7MZZ5tlxytgJXyp0w4PGkkeLiuIdZw==",
+      "version": "0.5.5",
+      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.5.tgz",
+      "integrity": "sha512-KGYxvIOXcceOAbEk4bi/dVLEK9z8sZ0uBB3Il5b1rhfClSpcX0yfRO0KmTkqR2cnQDymwLB+25ZyMzICg/cm/A==",
       "dependencies": {
+        "@swc/counter": "^0.1.3",
         "tslib": "^2.4.0"
       }
     },
@@ -4694,12 +4744,12 @@
       "dev": true
     },
     "node_modules/next": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/next/-/next-14.1.0.tgz",
-      "integrity": "sha512-wlzrsbfeSU48YQBjZhDzOwhWhGsy+uQycR8bHAOt1LY1bn3zZEcDyHQOEoN3aWzQ8LHCAJ1nqrWCc9XF2+O45Q==",
+      "version": "14.2.3",
+      "resolved": "https://registry.npmjs.org/next/-/next-14.2.3.tgz",
+      "integrity": "sha512-dowFkFTR8v79NPJO4QsBUtxv0g9BrS/phluVpMAt2ku7H+cbcBJlopXjkWlwxrk/xGqMemr7JkGPGemPrLLX7A==",
       "dependencies": {
-        "@next/env": "14.1.0",
-        "@swc/helpers": "0.5.2",
+        "@next/env": "14.2.3",
+        "@swc/helpers": "0.5.5",
         "busboy": "1.6.0",
         "caniuse-lite": "^1.0.30001579",
         "graceful-fs": "^4.2.11",
@@ -4713,18 +4763,19 @@
         "node": ">=18.17.0"
       },
       "optionalDependencies": {
-        "@next/swc-darwin-arm64": "14.1.0",
-        "@next/swc-darwin-x64": "14.1.0",
-        "@next/swc-linux-arm64-gnu": "14.1.0",
-        "@next/swc-linux-arm64-musl": "14.1.0",
-        "@next/swc-linux-x64-gnu": "14.1.0",
-        "@next/swc-linux-x64-musl": "14.1.0",
-        "@next/swc-win32-arm64-msvc": "14.1.0",
-        "@next/swc-win32-ia32-msvc": "14.1.0",
-        "@next/swc-win32-x64-msvc": "14.1.0"
+        "@next/swc-darwin-arm64": "14.2.3",
+        "@next/swc-darwin-x64": "14.2.3",
+        "@next/swc-linux-arm64-gnu": "14.2.3",
+        "@next/swc-linux-arm64-musl": "14.2.3",
+        "@next/swc-linux-x64-gnu": "14.2.3",
+        "@next/swc-linux-x64-musl": "14.2.3",
+        "@next/swc-win32-arm64-msvc": "14.2.3",
+        "@next/swc-win32-ia32-msvc": "14.2.3",
+        "@next/swc-win32-x64-msvc": "14.2.3"
       },
       "peerDependencies": {
         "@opentelemetry/api": "^1.1.0",
+        "@playwright/test": "^1.41.2",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "sass": "^1.3.0"
@@ -4733,6 +4784,9 @@
         "@opentelemetry/api": {
           "optional": true
         },
+        "@playwright/test": {
+          "optional": true
+        },
         "sass": {
           "optional": true
         }
diff --git a/package.json b/package.json
index 3c8f1bf..69b79a2 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
     "@radix-ui/react-navigation-menu": "^1.1.4",
     "@radix-ui/react-popover": "^1.0.7",
     "@radix-ui/react-scroll-area": "^1.0.5",
+    "@radix-ui/react-select": "^2.0.0",
     "@radix-ui/react-separator": "^1.0.3",
     "@radix-ui/react-slider": "^1.1.2",
     "@radix-ui/react-slot": "^1.0.2",
@@ -34,7 +35,7 @@
     "cmdk": "^0.2.1",
     "date-fns": "^3.3.1",
     "lucide-react": "^0.314.0",
-    "next": "14.1.0",
+    "next": "^14.2.3",
     "next-themes": "^0.2.1",
     "react": "^18",
     "react-day-picker": "^8.10.0",
diff --git a/src/app/coaching-sessions/page.tsx b/src/app/coaching-sessions/page.tsx
index dea5a61..e084e03 100644
--- a/src/app/coaching-sessions/page.tsx
+++ b/src/app/coaching-sessions/page.tsx
@@ -18,6 +18,8 @@ import {
   CollapsibleTrigger,
 } from "@/components/ui/collapsible";
 
+import { LockClosedIcon } from "@radix-ui/react-icons";
+
 import {
   Tooltip,
   TooltipContent,
@@ -211,12 +213,15 @@ export default function CoachingSessionsPage() {
           <div className="grid h-full items-stretch gap-6 md:grid-cols-[1fr_200px]">
             <div className="flex-col space-y-4 sm:flex md:order-1">
               <Tabs defaultValue="notes" className="flex-1">
-                <TabsList className="grid w-full grid-cols-4">
+                <TabsList className="grid flex w-96 grid-cols-4 justify-start">
                   <TabsTrigger value="notes">Notes</TabsTrigger>
                   <TabsTrigger value="program">Program</TabsTrigger>
                   <TabsTrigger value="console">Console</TabsTrigger>
                   <TabsTrigger value="coachs_notes">
-                    Coach&#39;s Notes
+                    <div className="flex gap-2 items-start">
+                      <LockClosedIcon className="mt-1" />
+                      Coach&#39;s Notes
+                    </div>
                   </TabsTrigger>
                 </TabsList>
                 <TabsContent value="notes">
@@ -228,10 +233,14 @@ export default function CoachingSessionsPage() {
                   </div>
                 </TabsContent>
                 <TabsContent value="program">
-                  <div className="p-4 min-h-[400px] md:min-h-[630px] lg:min-h-[630px] bg-red-500 text-white">Program</div>
+                  <div className="p-4 min-h-[400px] md:min-h-[630px] lg:min-h-[630px] bg-red-500 text-white">
+                    Program
+                  </div>
                 </TabsContent>
                 <TabsContent value="console">
-                  <div className="p-4 min-h-[400px] md:min-h-[630px] lg:min-h-[630px] bg-blue-500 text-white">Console</div>
+                  <div className="p-4 min-h-[400px] md:min-h-[630px] lg:min-h-[630px] bg-blue-500 text-white">
+                    Console
+                  </div>
                 </TabsContent>
                 <TabsContent value="coachs_notes">
                   <div className="flex h-full flex-col space-y-4">
diff --git a/src/app/dashboard/layout.tsx b/src/app/dashboard/layout.tsx
new file mode 100644
index 0000000..b053e54
--- /dev/null
+++ b/src/app/dashboard/layout.tsx
@@ -0,0 +1,25 @@
+import type { Metadata } from "next";
+import "@/styles/globals.css";
+import { siteConfig } from "@/site.config.ts"
+
+import { SiteHeader } from "@/components/ui/site-header"
+
+export const metadata: Metadata = {
+  title: siteConfig.name,
+  description: "Generated by create next app",
+};
+
+export default function CoachingSessionLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <>
+      <SiteHeader />
+      <main>
+        {children}
+      </main>
+    </>
+  );
+}
\ No newline at end of file
diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
new file mode 100644
index 0000000..4b873fd
--- /dev/null
+++ b/src/app/dashboard/page.tsx
@@ -0,0 +1,65 @@
+"use client";
+
+// import { Metadata } from "next";
+
+import * as React from "react";
+
+import Image from "next/image";
+
+import { cn } from "@/lib/utils";
+
+import { SelectCoachingSession } from "@/components/ui/dashboard/select-coaching-session";
+import { useEffect, useState } from "react";
+import { Organization } from "@/types/organization";
+import { fetchOrganizationsByUserId } from "@/lib/api/organizations";
+import { useAuthStore } from "@/lib/providers/auth-store-provider";
+
+// export const metadata: Metadata = {
+//   title: "Dashboard",
+//   description: "Coaching dashboard",
+// };
+
+function DashboardContainer({
+  className,
+  ...props
+}: React.HTMLAttributes<HTMLDivElement>) {
+  return (
+    <div
+      className={cn(
+        "flex items-center justify-center [&>div]:w-full",
+        className
+      )}
+      {...props}
+    />
+  );
+}
+
+export default function DashboardPage() {
+  const { userUUID } = useAuthStore((state) => state);
+
+  return (
+    <>
+      <div className="md:hidden">
+        <Image
+          src="/examples/cards-light.png"
+          width={1280}
+          height={1214}
+          alt="Cards"
+          className="block dark:hidden"
+        />
+        <Image
+          src="/examples/cards-dark.png"
+          width={1280}
+          height={1214}
+          alt="Cards"
+          className="hidden dark:block"
+        />
+      </div>
+      <div className="hidden items-start justify-center gap-6 rounded-lg p-8 md:grid lg:grid-cols-2 xl:grid-cols-3">
+        <DashboardContainer>
+          <SelectCoachingSession userUUID={userUUID} />
+        </DashboardContainer>
+      </div>
+    </>
+  );
+}
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
new file mode 100644
index 0000000..afa13ec
--- /dev/null
+++ b/src/components/ui/card.tsx
@@ -0,0 +1,79 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+const Card = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn(
+      "rounded-lg border bg-card text-card-foreground shadow-sm",
+      className
+    )}
+    {...props}
+  />
+))
+Card.displayName = "Card"
+
+const CardHeader = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("flex flex-col space-y-1.5 p-6", className)}
+    {...props}
+  />
+))
+CardHeader.displayName = "CardHeader"
+
+const CardTitle = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLHeadingElement>
+>(({ className, ...props }, ref) => (
+  <h3
+    ref={ref}
+    className={cn(
+      "text-2xl font-semibold leading-none tracking-tight",
+      className
+    )}
+    {...props}
+  />
+))
+CardTitle.displayName = "CardTitle"
+
+const CardDescription = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLParagraphElement>
+>(({ className, ...props }, ref) => (
+  <p
+    ref={ref}
+    className={cn("text-sm text-muted-foreground", className)}
+    {...props}
+  />
+))
+CardDescription.displayName = "CardDescription"
+
+const CardContent = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
+))
+CardContent.displayName = "CardContent"
+
+const CardFooter = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("flex items-center p-6 pt-0", className)}
+    {...props}
+  />
+))
+CardFooter.displayName = "CardFooter"
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
diff --git a/src/components/ui/dashboard/select-coaching-session.tsx b/src/components/ui/dashboard/select-coaching-session.tsx
new file mode 100644
index 0000000..57d7dc5
--- /dev/null
+++ b/src/components/ui/dashboard/select-coaching-session.tsx
@@ -0,0 +1,111 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+import { Textarea } from "@/components/ui/textarea";
+import { fetchOrganizationsByUserId } from "@/lib/api/organizations";
+import { Organization, defaultOrganizations } from "@/types/organization";
+import { useEffect, useState } from "react";
+
+export interface CoachingSessionProps {
+  /** The current logged in user's UUID */
+  userUUID: string;
+}
+
+export function SelectCoachingSession({
+  userUUID,
+  ...props
+}: CoachingSessionProps) {
+  const [organizations, setOrganizations] = useState<Organization[]>(
+    defaultOrganizations()
+  );
+  useEffect(() => {
+    async function loadOrganizations() {
+      if (!userUUID) return;
+
+      await fetchOrganizationsByUserId(userUUID)
+        .then(([orgs]) => {
+          setOrganizations(orgs);
+        })
+        .catch(([err]) => {
+          console.error("Failed to fetch Organizations: " + err);
+        });
+    }
+    loadOrganizations();
+  }, [userUUID]);
+
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle>Organization Relationship</CardTitle>
+        <CardDescription>Select current organization & coachee</CardDescription>
+      </CardHeader>
+      <CardContent className="grid gap-6">
+        <div className="grid gap-2">
+          <Label htmlFor="organization">Organization</Label>
+          <Select defaultValue="0">
+            <SelectTrigger id="organization">
+              <SelectValue placeholder="Select" />
+            </SelectTrigger>
+            <SelectContent>
+              {organizations.map((organization, index) => (
+                <SelectItem value={index.toString()} key={organization.id}>
+                  {organization.name}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        </div>
+        <div className="grid gap-2">
+          <Label htmlFor="relationship">Relationship</Label>
+          <Select defaultValue="caleb">
+            <SelectTrigger id="relationship">
+              <SelectValue placeholder="Select" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="caleb">
+                Jim Hodapp -&gt; Caleb Bourg
+              </SelectItem>
+              <SelectItem value="other_coachee">
+                Jim Hodapp -&gt; Other Coachee
+              </SelectItem>
+            </SelectContent>
+          </Select>
+        </div>
+        <div className="grid gap-2">
+          <Label htmlFor="session">Coaching Session</Label>
+          <Select defaultValue="today">
+            <SelectTrigger id="session">
+              <SelectValue placeholder="Select" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="today">Today @ 5 pm</SelectItem>
+              <SelectItem value="tomorrow">Tomorrow @ 5 pm</SelectItem>
+            </SelectContent>
+          </Select>
+        </div>
+      </CardContent>
+      <CardFooter>
+        <Button variant="outline" className="w-full">
+          Apply
+        </Button>
+      </CardFooter>
+    </Card>
+  );
+}
diff --git a/src/components/ui/main-nav-menu.tsx b/src/components/ui/main-nav-menu.tsx
new file mode 100644
index 0000000..6fe02f9
--- /dev/null
+++ b/src/components/ui/main-nav-menu.tsx
@@ -0,0 +1,282 @@
+"use client";
+
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+import { Dialog } from "@radix-ui/react-dialog";
+
+import { Button } from "@/components/ui/button";
+import {
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Icons } from "@/components/ui/icons";
+import {
+  NavigationMenu,
+  NavigationMenuContent,
+  NavigationMenuItem,
+  NavigationMenuLink,
+  NavigationMenuList,
+  NavigationMenuTrigger,
+} from "@/components/ui/navigation-menu";
+import { PresetSelector } from "@/components/ui/preset-selector";
+
+import { current, future, past } from "../../data/presets";
+
+import { ChevronDownIcon } from "@radix-ui/react-icons";
+
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+} from "@/components/ui/command";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@/components/ui/popover";
+
+export function MainNavMenu() {
+  const [open, setIsOpen] = React.useState(false);
+
+  return (
+    <>
+      <NavigationMenu>
+        <NavigationMenuList>
+          <NavigationMenuItem>
+            <NavigationMenuTrigger>
+              <span className="hidden font-bold sm:inline-block">
+                {/* TODO: Replace this with currently selected organization's name */}
+                Refactor Coaching
+              </span>
+            </NavigationMenuTrigger>
+            <NavigationMenuContent>
+              <ul className="grid gap-3 p-6 md:w-[500px] lg:w-[600px] lg:grid-cols-[.75fr_1fr]">
+                <li className="row-span-3">
+                  <NavigationMenuLink asChild>
+                    <a
+                      className="flex h-full w-full select-none flex-col justify-end rounded-md bg-gradient-to-b from-muted/50 to-muted p-6 no-underline outline-none focus:shadow-md"
+                      href="/"
+                    >
+                      <Icons.logo className="h-6 w-6" />
+                      <div className="mb-2 mt-4 text-lg font-medium">
+                        Refactor Coaching
+                      </div>
+                      <p className="text-sm leading-tight text-muted-foreground">
+                        Professional software engineer coaching.
+                      </p>
+                    </a>
+                  </NavigationMenuLink>
+                </li>
+
+                <Card>
+                  <CardHeader>
+                    <CardTitle>Organization & Relationship</CardTitle>
+                    <CardDescription>
+                      Set your current organization and coaching relationship.
+                    </CardDescription>
+                  </CardHeader>
+                  <CardContent className="grid gap-6">
+                    <div className="flex items-center justify-between space-x-4">
+                      <div className="flex items-center space-x-4">
+                        <div>
+                          <p className="text-sm font-medium leading-none">
+                            Organization
+                          </p>
+                        </div>
+                      </div>
+                      <Popover>
+                        <PopoverTrigger asChild>
+                          <Button variant="outline" className="ml-auto">
+                            Owner{" "}
+                            <ChevronDownIcon className="ml-2 h-4 w-4 text-muted-foreground" />
+                          </Button>
+                        </PopoverTrigger>
+                        <PopoverContent className="p-0" align="end">
+                          <Command>
+                            <CommandInput placeholder="Select new role..." />
+                            <CommandList>
+                              <CommandEmpty>No roles found.</CommandEmpty>
+                              <CommandGroup>
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Viewer</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Can view and comment.
+                                  </p>
+                                </CommandItem>
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Developer</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Can view, comment and edit.
+                                  </p>
+                                </CommandItem>
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Billing</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Can view, comment and manage billing.
+                                  </p>
+                                </CommandItem>
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Owner</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Admin-level access to all resources.
+                                  </p>
+                                </CommandItem>
+                              </CommandGroup>
+                            </CommandList>
+                          </Command>
+                        </PopoverContent>
+                      </Popover>
+                    </div>
+                    <div className="flex items-center justify-between space-x-4">
+                      <div className="flex items-center space-x-4">
+                        <div>
+                          <p className="text-sm font-medium leading-none">
+                            Relationship
+                          </p>
+                        </div>
+                      </div>
+                      <Popover>
+                        <PopoverTrigger asChild>
+                          <Button variant="outline" className="ml-auto">
+                            Member{" "}
+                            <ChevronDownIcon className="ml-2 h-4 w-4 text-muted-foreground" />
+                          </Button>
+                        </PopoverTrigger>
+                        <PopoverContent className="p-0" align="end">
+                          <Command>
+                            <CommandInput placeholder="Select new role..." />
+                            <CommandList>
+                              <CommandEmpty>No roles found.</CommandEmpty>
+                              <CommandGroup className="p-1.5">
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Viewer</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Can view and comment.
+                                  </p>
+                                </CommandItem>
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Developer</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Can view, comment and edit.
+                                  </p>
+                                </CommandItem>
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Billing</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Can view, comment and manage billing.
+                                  </p>
+                                </CommandItem>
+                                <CommandItem className="teamaspace-y-1 flex flex-col items-start px-4 py-2">
+                                  <p>Owner</p>
+                                  <p className="text-sm text-muted-foreground">
+                                    Admin-level access to all resources.
+                                  </p>
+                                </CommandItem>
+                              </CommandGroup>
+                            </CommandList>
+                          </Command>
+                        </PopoverContent>
+                      </Popover>
+                    </div>
+                  </CardContent>
+                </Card>
+
+                {/* <ListItem
+                  onClick={() => setIsOpen(true)}
+                  title="Select Organization"
+                >
+                  Set your current organization and coaching relationship.
+                </ListItem>
+                <ListItem href="/docs/installation" title="Installation">
+                  How to install dependencies and structure your app.
+                </ListItem>
+                <ListItem href="/docs/primitives/typography" title="Typography">
+                  Styles for headings, paragraphs, lists...etc
+                </ListItem> */}
+              </ul>
+            </NavigationMenuContent>
+          </NavigationMenuItem>
+        </NavigationMenuList>
+      </NavigationMenu>
+      <Dialog open={open} onOpenChange={setIsOpen}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>
+              Current Organization & Coaching Relationship
+            </DialogTitle>
+            <DialogDescription>
+              Select your current organization and coaching relationship to
+              access specific coaching sessions across multiple organizations
+              and coaches/coachees.
+            </DialogDescription>
+          </DialogHeader>
+          <div className="py-6 w-full">
+            <h4 className="text-sm text-muted-foreground">
+              Select Your Organization
+            </h4>
+            <div className="flex pt-3">
+              <PresetSelector current={current} future={future} past={past} />
+            </div>
+            <h4 className="text-sm text-muted-foreground pt-6">
+              Select Your Coaching Relationship
+            </h4>
+            <div className="flex pt-3">
+              <PresetSelector current={current} future={future} past={past} />
+            </div>
+          </div>
+          <DialogFooter>
+            <div className="flex flex-col sm:flex-row gap-2">
+              <Button variant="secondary" onClick={() => setIsOpen(true)}>
+                Set Default
+              </Button>
+              <Button variant="secondary" onClick={() => setIsOpen(false)}>
+                Close
+              </Button>
+            </div>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </>
+  );
+}
+
+const ListItem = React.forwardRef<
+  React.ElementRef<"a">,
+  React.ComponentPropsWithoutRef<"a">
+>(({ className, title, children, ...props }, ref) => {
+  return (
+    <li>
+      <NavigationMenuLink asChild>
+        <a
+          ref={ref}
+          className={cn(
+            "block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
+            className
+          )}
+          {...props}
+        >
+          <div className="text-sm font-medium leading-none">{title}</div>
+          <p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
+            {children}
+          </p>
+        </a>
+      </NavigationMenuLink>
+    </li>
+  );
+});
+ListItem.displayName = "ListItem";
diff --git a/src/components/ui/main-nav.tsx b/src/components/ui/main-nav.tsx
index 721f4b3..db383e2 100644
--- a/src/components/ui/main-nav.tsx
+++ b/src/components/ui/main-nav.tsx
@@ -4,21 +4,12 @@ import * as React from "react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 
-import { siteConfig } from "@/site.config.ts";
 import { cn } from "@/lib/utils";
 import { Icons } from "@/components/ui/icons";
+import { MainNavMenu } from "@/components/ui/main-nav-menu";
 import { buttonVariants } from "@/components/ui/button";
-import { Badge } from "@/components/ui/badge";
 
-import {
-  NavigationMenu,
-  NavigationMenuContent,
-  NavigationMenuItem,
-  NavigationMenuLink,
-  NavigationMenuList,
-  NavigationMenuTrigger,
-  navigationMenuTriggerStyle,
-} from "@/components/ui/navigation-menu";
+import { NavigationMenuLink } from "@/components/ui/navigation-menu";
 
 export function MainNav() {
   const pathname = usePathname();
@@ -40,51 +31,7 @@ export function MainNav() {
         </div>
       </Link>
       <span>
-        <NavigationMenu>
-          <NavigationMenuList>
-            <NavigationMenuItem>
-              <NavigationMenuTrigger>
-                <span className="hidden font-bold sm:inline-block">
-                  {siteConfig.name}
-                </span>
-              </NavigationMenuTrigger>
-              <NavigationMenuContent>
-                <ul className="grid gap-3 p-6 md:w-[400px] lg:w-[500px] lg:grid-cols-[.75fr_1fr]">
-                  <li className="row-span-3">
-                    <NavigationMenuLink asChild>
-                      <a
-                        className="flex h-full w-full select-none flex-col justify-end rounded-md bg-gradient-to-b from-muted/50 to-muted p-6 no-underline outline-none focus:shadow-md"
-                        href="/"
-                      >
-                        <Icons.logo className="h-6 w-6" />
-                        <div className="mb-2 mt-4 text-lg font-medium">
-                          Refactor Coaching
-                        </div>
-                        <p className="text-sm leading-tight text-muted-foreground">
-                          Beautifully designed components that you can copy and
-                          paste into your apps. Accessible. Customizable. Open
-                          Source.
-                        </p>
-                      </a>
-                    </NavigationMenuLink>
-                  </li>
-                  <ListItem href="/docs" title="Introduction">
-                    Re-usable components built using Radix UI and Tailwind CSS.
-                  </ListItem>
-                  <ListItem href="/docs/installation" title="Installation">
-                    How to install dependencies and structure your app.
-                  </ListItem>
-                  <ListItem
-                    href="/docs/primitives/typography"
-                    title="Typography"
-                  >
-                    Styles for headings, paragraphs, lists...etc
-                  </ListItem>
-                </ul>
-              </NavigationMenuContent>
-            </NavigationMenuItem>
-          </NavigationMenuList>
-        </NavigationMenu>
+        <MainNavMenu />
       </span>
     </div>
   );
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
new file mode 100644
index 0000000..cbe5a36
--- /dev/null
+++ b/src/components/ui/select.tsx
@@ -0,0 +1,160 @@
+"use client"
+
+import * as React from "react"
+import * as SelectPrimitive from "@radix-ui/react-select"
+import { Check, ChevronDown, ChevronUp } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const Select = SelectPrimitive.Root
+
+const SelectGroup = SelectPrimitive.Group
+
+const SelectValue = SelectPrimitive.Value
+
+const SelectTrigger = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
+>(({ className, children, ...props }, ref) => (
+  <SelectPrimitive.Trigger
+    ref={ref}
+    className={cn(
+      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      className
+    )}
+    {...props}
+  >
+    {children}
+    <SelectPrimitive.Icon asChild>
+      <ChevronDown className="h-4 w-4 opacity-50" />
+    </SelectPrimitive.Icon>
+  </SelectPrimitive.Trigger>
+))
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
+
+const SelectScrollUpButton = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.ScrollUpButton
+    ref={ref}
+    className={cn(
+      "flex cursor-default items-center justify-center py-1",
+      className
+    )}
+    {...props}
+  >
+    <ChevronUp className="h-4 w-4" />
+  </SelectPrimitive.ScrollUpButton>
+))
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
+
+const SelectScrollDownButton = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.ScrollDownButton
+    ref={ref}
+    className={cn(
+      "flex cursor-default items-center justify-center py-1",
+      className
+    )}
+    {...props}
+  >
+    <ChevronDown className="h-4 w-4" />
+  </SelectPrimitive.ScrollDownButton>
+))
+SelectScrollDownButton.displayName =
+  SelectPrimitive.ScrollDownButton.displayName
+
+const SelectContent = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
+>(({ className, children, position = "popper", ...props }, ref) => (
+  <SelectPrimitive.Portal>
+    <SelectPrimitive.Content
+      ref={ref}
+      className={cn(
+        "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        position === "popper" &&
+          "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+        className
+      )}
+      position={position}
+      {...props}
+    >
+      <SelectScrollUpButton />
+      <SelectPrimitive.Viewport
+        className={cn(
+          "p-1",
+          position === "popper" &&
+            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+        )}
+      >
+        {children}
+      </SelectPrimitive.Viewport>
+      <SelectScrollDownButton />
+    </SelectPrimitive.Content>
+  </SelectPrimitive.Portal>
+))
+SelectContent.displayName = SelectPrimitive.Content.displayName
+
+const SelectLabel = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Label>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.Label
+    ref={ref}
+    className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
+    {...props}
+  />
+))
+SelectLabel.displayName = SelectPrimitive.Label.displayName
+
+const SelectItem = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
+>(({ className, children, ...props }, ref) => (
+  <SelectPrimitive.Item
+    ref={ref}
+    className={cn(
+      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    )}
+    {...props}
+  >
+    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+      <SelectPrimitive.ItemIndicator>
+        <Check className="h-4 w-4" />
+      </SelectPrimitive.ItemIndicator>
+    </span>
+
+    <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
+  </SelectPrimitive.Item>
+))
+SelectItem.displayName = SelectPrimitive.Item.displayName
+
+const SelectSeparator = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Separator>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.Separator
+    ref={ref}
+    className={cn("-mx-1 my-1 h-px bg-muted", className)}
+    {...props}
+  />
+))
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName
+
+export {
+  Select,
+  SelectGroup,
+  SelectValue,
+  SelectTrigger,
+  SelectContent,
+  SelectLabel,
+  SelectItem,
+  SelectSeparator,
+  SelectScrollUpButton,
+  SelectScrollDownButton,
+}
diff --git a/src/components/user-auth-form.tsx b/src/components/user-auth-form.tsx
index 6144eb3..ff0192d 100644
--- a/src/components/user-auth-form.tsx
+++ b/src/components/user-auth-form.tsx
@@ -15,26 +15,22 @@ interface UserAuthFormProps extends React.HTMLAttributes<HTMLDivElement> {}
 
 export function UserAuthForm({ className, ...props }: UserAuthFormProps) {
   const router = useRouter();
-  const { userUUID } = useAuthStore(
-    (state) => state,
-  );
-  const { login } = useAuthStore(
-    (action) => action,
-  );
+  const { userUUID } = useAuthStore((state) => state);
+  const { login } = useAuthStore((action) => action);
 
   const [isLoading, setIsLoading] = React.useState<boolean>(false);
   const [email, setEmail] = React.useState<string>("");
   const [password, setPassword] = React.useState<string>("");
   const [error, setError] = React.useState<string>("");
 
-  async function login_user(event: React.SyntheticEvent) {
+  async function loginUserSubmit(event: React.SyntheticEvent) {
     event.preventDefault();
     setIsLoading(true);
 
     const [userUUID, err] = await loginUser(email, password);
     if (userUUID.length > 0 && err.length == 0) {
       login(userUUID);
-      router.push("/coaching-sessions");
+      router.push("/dashboard");
     } else {
       console.error("err: " + err);
       setError(err);
@@ -55,7 +51,7 @@ export function UserAuthForm({ className, ...props }: UserAuthFormProps) {
 
   return (
     <div className={cn("grid gap-6", className)} {...props}>
-      <form onSubmit={login_user}>
+      <form onSubmit={loginUserSubmit}>
         <div className="grid gap-2">
           <div className="grid gap-1">
             <Label className="sr-only" htmlFor="email">
diff --git a/src/lib/api/organizations.ts b/src/lib/api/organizations.ts
index 098e431..7e607c0 100644
--- a/src/lib/api/organizations.ts
+++ b/src/lib/api/organizations.ts
@@ -1,8 +1,15 @@
 // Interacts with the Organizations endpoints
 
-import { Organization, defaultOrganization,
-         defaultOrganizations, isOrganization,
-         isOrganizationsArray, organizationToString } from "@/types/organization";
+import { Id } from "@/types/general";
+import {
+  Organization,
+  defaultOrganization,
+  defaultOrganizations,
+  isOrganization,
+  isOrganizationsArray,
+  organizationToString,
+  organizationsToString,
+} from "@/types/organization";
 import { AxiosError, AxiosResponse } from "axios";
 
 // TODO:
@@ -10,224 +17,282 @@ import { AxiosError, AxiosResponse } from "axios";
 //    method that shares dealing with errors in a less repetitive way?
 // 2. Create a config item for specifying the X-Version to use for requests.
 
-export const fetchOrganizations = async (): Promise<[Organization[], string]> => {
-    const axios = require("axios");
-
-    var organizations: Organization[] = defaultOrganizations();
-    var err: string = "";
-
-    const data = await axios
-      .get(
-            "http://localhost:4000/organizations",
-            {
-                withCredentials: true,
-                setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
-                headers: {
-                    "X-Version": "0.0.1",
-                },
-            }
-        )
-        .then(function (response: AxiosResponse) {
-            // handle success
-            console.debug(response);
-            if (isOrganizationsArray(response.data.data)) {
-                organizations = response.data.data;
-                //console.debug(`Organizations: ` + organizationToString(organizations) + `.`);
-            }
-        })
-        .catch(function (error: AxiosError) {
-            // handle error
-            console.log(error.response?.status);
-            if (error.response?.status == 401) {
-                console.error("Retrieval of Organization failed: unauthorized.");
-                err = "Retrieval of Organization failed: unauthorized.";
-            } else {
-                console.log(error);
-                console.error("Retrieval of Organization failed.");
-                err = "Retrieval of Organization failed.";
-            }
-        })
-
-        return [organizations, err];
-}
-
-export const fetchOrganization = async (id: number): Promise<[Organization, string]> => {
-    const axios = require("axios");
-
-    var organization: Organization = defaultOrganization();
-    var err: string = "";
-
-    const data = await axios
-      .get(
-            `http://localhost:4000/organizations/${id}`,
-            {
-                withCredentials: true,
-                setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
-                headers: {
-                    "X-Version": "0.0.1",
-                },
-            }
-        )
-        .then(function (response: AxiosResponse) {
-            // handle success
-            console.debug(response);
-            if (isOrganization(response.data.data)) {
-                organization = response.data.data;
-                //console.debug(`Organization(` + id + `): ` + organizationToString(organization) + `.`);
-            }
-        })
-        .catch(function (error: AxiosError) {
-            // handle error
-            console.error(error.response?.status);
-            if (error.response?.status == 401) {
-                console.error("Retrieval of Organization failed: unauthorized.");
-                err = "Retrieval of Organization failed: unauthorized.";
-            } else {
-                console.log(error);
-                console.error(`Retrieval of Organization(` + id + `) failed.`);
-                err = `Retrieval of Organization(` + id + `) failed.`;
-            }
-        })
-
-        return [organization, err];
-}
-
-export const createOrganization = async (organization: Organization): Promise<[Organization, string]> => {
-    const axios = require("axios");
-
-    var createdOrganization: Organization = defaultOrganization();
-    var err: string = "";
-
-    var strOrganization: string = organizationToString(organization);
-    const data = await axios
-      .post(
-            `http://localhost:4000/organizations`,
-             strOrganization,
-            {
-                withCredentials: true,
-                setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
-                headers: {
-                    "X-Version": "0.0.1",
-                    'Content-Type': 'application/json'
-                },
-            }
-        )
-        .then(function (response: AxiosResponse) {
-            // handle success
-            console.debug(response);
-            if (isOrganization(response.data.data)) {
-                createdOrganization = response.data.data;
-                console.debug(`Successfully created new Organization: ` + organizationToString(createdOrganization) + `.`);
-            }
-        })
-        .catch(function (error: AxiosError) {
-            // handle error
-            console.error(error.response?.status);
-            if (error.response?.status == 401) {
-                console.error("Creation of Organization failed: unauthorized.");
-                err = "Creation of Organization failed: unauthorized.";
-            } else if (error.response?.status == 500) {
-                console.error("Creation of Organization failed: internal server error.");
-                err = "Creation of Organization failed: internal server error.";
-            } else {
-                console.log(error);
-                console.error(`Creation of new Organization failed.`);
-                err = `Creation of new Organization failed.`;
-            }
-        })
-
-        return [createdOrganization, err];
-}
-
-export const updateOrganization = async (id: number, organization: Organization): Promise<[Organization, string]> => {
-    const axios = require("axios");
-
-    var updatedOrganization: Organization = defaultOrganization();
-    var err: string = "";
-
-    var strOrganization: string = organizationToString(organization);
-    const data = await axios
-      .put(
-            `http://localhost:4000/organizations/${id}`,
-             strOrganization,
-            {
-                withCredentials: true,
-                setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
-                headers: {
-                    "X-Version": "0.0.1",
-                    'Content-Type': 'application/json'
-                },
-            }
-        )
-        .then(function (response: AxiosResponse) {
-            // handle success
-            console.debug(response);
-            if (isOrganization(response.data.data)) {
-                updatedOrganization = response.data.data;
-                console.debug(`Successfully updated Organization(` + id + `): ` + organizationToString(updatedOrganization) + `.`);
-            }
-        })
-        .catch(function (error: AxiosError) {
-            // handle error
-            console.error(error.response?.status);
-            if (error.response?.status == 401) {
-                console.error("Update of Organization failed: unauthorized.");
-                err = "Update of Organization failed: unauthorized.";
-            } else if (error.response?.status == 500) {
-                console.error("Update of Organization failed: internal server error.");
-                err = "Update of Organization failed: internal server error.";
-            } else {
-                console.log(error);
-                console.error(`Update of new Organization failed.`);
-                err = `Update of new Organization failed.`;
-            }
-        })
-
-        return [updatedOrganization, err];
-}
-
-export const deleteOrganization = async (id: number): Promise<[string, string]> => {
-    const axios = require("axios");
-
-    var deleted_id: string = "";
-    var err: string = "";
-
-    const data = await axios
-      .delete(
-            `http://localhost:4000/organizations/${id}`,
-            {
-                withCredentials: true,
-                setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
-                headers: {
-                    "X-Version": "0.0.1",
-                },
-            }
-        )
-        .then(function (response: AxiosResponse) {
-            // handle success
-            console.debug(response);
-            //console.debug(`Organization(` + id + `) successfully deleted.`);
-            var json = response.data;
-            if ("id" in json) {
-                deleted_id = json.id;
-                console.debug("Organization id: " + deleted_id + " successfully deleted.");
-            }
-        })
-        .catch(function (error: AxiosError) {
-            // handle error
-            console.error(error.response?.status);
-            if (error.response?.status == 401) {
-                console.error("Deletion of Organization failed: unauthorized.");
-                err = "Deletion of Organization failed: unauthorized.";
-            } else if (error.response?.status == 500) {
-                console.error("Deletion of Organization failed: internal server error.");
-                err = "Deletion of Organization failed: internal server error.";
-            } else {
-                console.log(error);
-                console.error(`Deletion of Organization(` + id + `) failed.`);
-                err = `Deletion of Organization(` + id + `) failed.`;
-            }
-        })
-
-        return [deleted_id, err];
-}
+export const fetchOrganizations = async (): Promise<
+  [Organization[], string]
+> => {
+  const axios = require("axios");
+
+  var organizations: Organization[] = defaultOrganizations();
+  var err: string = "";
+
+  const data = await axios
+    .get("http://localhost:4000/organizations", {
+      withCredentials: true,
+      setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
+      headers: {
+        "X-Version": "0.0.1",
+      },
+    })
+    .then(function (response: AxiosResponse) {
+      // handle success
+      console.debug(response);
+      if (isOrganizationsArray(response.data.data)) {
+        organizations = response.data.data;
+        //console.debug(`Organizations: ` + organizationToString(organizations) + `.`);
+      }
+    })
+    .catch(function (error: AxiosError) {
+      // handle error
+      console.log(error.response?.status);
+      if (error.response?.status == 401) {
+        console.error("Retrieval of Organization failed: unauthorized.");
+        err = "Retrieval of Organization failed: unauthorized.";
+      } else {
+        console.log(error);
+        console.error("Retrieval of Organization failed.");
+        err = "Retrieval of Organization failed.";
+      }
+    });
+
+  return [organizations, err];
+};
+
+export const fetchOrganization = async (
+  id: Id
+): Promise<[Organization, string]> => {
+  const axios = require("axios");
+
+  var organization: Organization = defaultOrganization();
+  var err: string = "";
+
+  const data = await axios
+    .get(`http://localhost:4000/organizations/${id}`, {
+      withCredentials: true,
+      setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
+      headers: {
+        "X-Version": "0.0.1",
+      },
+    })
+    .then(function (response: AxiosResponse) {
+      // handle success
+      console.debug(response);
+      if (isOrganization(response.data.data)) {
+        organization = response.data.data;
+        //console.debug(`Organization(` + id + `): ` + organizationToString(organization) + `.`);
+      }
+    })
+    .catch(function (error: AxiosError) {
+      // handle error
+      console.error(error.response?.status);
+      if (error.response?.status == 401) {
+        console.error("Retrieval of Organization failed: unauthorized.");
+        err = "Retrieval of Organization failed: unauthorized.";
+      } else {
+        console.log(error);
+        console.error(`Retrieval of Organization(` + id + `) failed.`);
+        err = `Retrieval of Organization(` + id + `) failed.`;
+      }
+    });
+
+  return [organization, err];
+};
+
+export const fetchOrganizationsByUserId = async (
+  userId: Id
+): Promise<[Organization[], string]> => {
+  const axios = require("axios");
+
+  var organizations: Organization[] = defaultOrganizations();
+  var err: string = "";
+
+  const data = await axios
+    .get(`http://localhost:4000/organizations`, {
+      params: {
+        user_id: userId,
+      },
+      withCredentials: true,
+      setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
+      headers: {
+        "X-Version": "0.0.1",
+      },
+    })
+    .then(function (response: AxiosResponse) {
+      // handle success
+      console.debug(response);
+      if (isOrganizationsArray(response.data.data)) {
+        organizations = response.data.data;
+        console.debug(
+          `Organizations: ` + organizationsToString(organizations) + `.`
+        );
+      }
+    })
+    .catch(function (error: AxiosError) {
+      // handle error
+      console.error(error.response?.status);
+      if (error.response?.status == 401) {
+        console.error("Retrieval of Organizations failed: unauthorized.");
+        err = "Retrieval of Organization failed: unauthorized.";
+      } else {
+        console.log(error);
+        console.error(
+          `Retrieval of Organization(s) by user Id (` + userId + `) failed.`
+        );
+        err =
+          `Retrieval of Organization(s) by user Id (` + userId + `) failed.`;
+      }
+    });
+
+  return [organizations, err];
+};
+
+export const createOrganization = async (
+  organization: Organization
+): Promise<[Organization, string]> => {
+  const axios = require("axios");
+
+  var createdOrganization: Organization = defaultOrganization();
+  var err: string = "";
+
+  var strOrganization: string = organizationToString(organization);
+  const data = await axios
+    .post(`http://localhost:4000/organizations`, strOrganization, {
+      withCredentials: true,
+      setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
+      headers: {
+        "X-Version": "0.0.1",
+        "Content-Type": "application/json",
+      },
+    })
+    .then(function (response: AxiosResponse) {
+      // handle success
+      console.debug(response);
+      if (isOrganization(response.data.data)) {
+        createdOrganization = response.data.data;
+        console.debug(
+          `Successfully created new Organization: ` +
+            organizationToString(createdOrganization) +
+            `.`
+        );
+      }
+    })
+    .catch(function (error: AxiosError) {
+      // handle error
+      console.error(error.response?.status);
+      if (error.response?.status == 401) {
+        console.error("Creation of Organization failed: unauthorized.");
+        err = "Creation of Organization failed: unauthorized.";
+      } else if (error.response?.status == 500) {
+        console.error(
+          "Creation of Organization failed: internal server error."
+        );
+        err = "Creation of Organization failed: internal server error.";
+      } else {
+        console.log(error);
+        console.error(`Creation of new Organization failed.`);
+        err = `Creation of new Organization failed.`;
+      }
+    });
+
+  return [createdOrganization, err];
+};
+
+export const updateOrganization = async (
+  id: number,
+  organization: Organization
+): Promise<[Organization, string]> => {
+  const axios = require("axios");
+
+  var updatedOrganization: Organization = defaultOrganization();
+  var err: string = "";
+
+  var strOrganization: string = organizationToString(organization);
+  const data = await axios
+    .put(`http://localhost:4000/organizations/${id}`, strOrganization, {
+      withCredentials: true,
+      setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
+      headers: {
+        "X-Version": "0.0.1",
+        "Content-Type": "application/json",
+      },
+    })
+    .then(function (response: AxiosResponse) {
+      // handle success
+      console.debug(response);
+      if (isOrganization(response.data.data)) {
+        updatedOrganization = response.data.data;
+        console.debug(
+          `Successfully updated Organization(` +
+            id +
+            `): ` +
+            organizationToString(updatedOrganization) +
+            `.`
+        );
+      }
+    })
+    .catch(function (error: AxiosError) {
+      // handle error
+      console.error(error.response?.status);
+      if (error.response?.status == 401) {
+        console.error("Update of Organization failed: unauthorized.");
+        err = "Update of Organization failed: unauthorized.";
+      } else if (error.response?.status == 500) {
+        console.error("Update of Organization failed: internal server error.");
+        err = "Update of Organization failed: internal server error.";
+      } else {
+        console.log(error);
+        console.error(`Update of new Organization failed.`);
+        err = `Update of new Organization failed.`;
+      }
+    });
+
+  return [updatedOrganization, err];
+};
+
+export const deleteOrganization = async (
+  id: number
+): Promise<[string, string]> => {
+  const axios = require("axios");
+
+  var deleted_id: string = "";
+  var err: string = "";
+
+  const data = await axios
+    .delete(`http://localhost:4000/organizations/${id}`, {
+      withCredentials: true,
+      setTimeout: 5000, // 5 seconds before timing out trying to log in with the backend
+      headers: {
+        "X-Version": "0.0.1",
+      },
+    })
+    .then(function (response: AxiosResponse) {
+      // handle success
+      console.debug(response);
+      //console.debug(`Organization(` + id + `) successfully deleted.`);
+      var json = response.data;
+      if ("id" in json) {
+        deleted_id = json.id;
+        console.debug(
+          "Organization id: " + deleted_id + " successfully deleted."
+        );
+      }
+    })
+    .catch(function (error: AxiosError) {
+      // handle error
+      console.error(error.response?.status);
+      if (error.response?.status == 401) {
+        console.error("Deletion of Organization failed: unauthorized.");
+        err = "Deletion of Organization failed: unauthorized.";
+      } else if (error.response?.status == 500) {
+        console.error(
+          "Deletion of Organization failed: internal server error."
+        );
+        err = "Deletion of Organization failed: internal server error.";
+      } else {
+        console.log(error);
+        console.error(`Deletion of Organization(` + id + `) failed.`);
+        err = `Deletion of Organization(` + id + `) failed.`;
+      }
+    });
+
+  return [deleted_id, err];
+};
diff --git a/src/types/general.ts b/src/types/general.ts
new file mode 100644
index 0000000..9b5487b
--- /dev/null
+++ b/src/types/general.ts
@@ -0,0 +1,2 @@
+// A type alias for each entity's Id field (UUID)
+export type Id = string;
\ No newline at end of file
diff --git a/src/types/organization.ts b/src/types/organization.ts
index 9a897fa..08334ca 100644
--- a/src/types/organization.ts
+++ b/src/types/organization.ts
@@ -1,51 +1,54 @@
 import { DateTime } from "ts-luxon";
+import { Id } from "@/types/general";
 
 // This must always reflect the Rust struct on the backend
 // entity::organizations::Model
 export interface Organization {
-    external_id: string
-    name: string
-    logo?: string
-    created_at: DateTime
-    updated_at: DateTime
-  }
+  id: Id;
+  name: string;
+  logo?: string;
+  created_at: DateTime;
+  updated_at: DateTime;
+}
 
 export function isOrganization(value: unknown): value is Organization {
-    if (!value || typeof value !== 'object') {
-      return false
-    }
-    const object = value as Record<string, unknown>
-  
-    return (
-      typeof object.external_id === 'string' &&
-      typeof object.name === 'string' &&
-      typeof object.created_at === 'string' &&
-      typeof object.updated_at === 'string' ||
-      typeof object.logo === 'string' // logo is optional
-    )
+  if (!value || typeof value !== "object") {
+    return false;
   }
+  const object = value as Record<string, unknown>;
 
-  export function isOrganizationsArray(value: unknown): value is Organization[] {
-    return Array.isArray(value) && value.every(isOrganization)
-  }
+  return (
+    (typeof object.id === "string" &&
+      typeof object.name === "string" &&
+      typeof object.created_at === "string" &&
+      typeof object.updated_at === "string") ||
+    typeof object.logo === "string" // logo is optional
+  );
+}
 
-  export function defaultOrganization(): Organization {
-    var now = DateTime.now();
-    return {
-        external_id: "",
-        name: "",
-        logo: "",
-        created_at: now,
-        updated_at: now,
-    }
-  }
+export function isOrganizationsArray(value: unknown): value is Organization[] {
+  return Array.isArray(value) && value.every(isOrganization);
+}
 
-  export function defaultOrganizations(): Organization[] {
-    return [
-        defaultOrganization(),
-    ]
-  }
+export function defaultOrganization(): Organization {
+  var now = DateTime.now();
+  return {
+    id: "",
+    name: "",
+    logo: "",
+    created_at: now,
+    updated_at: now,
+  };
+}
+
+export function defaultOrganizations(): Organization[] {
+  return [defaultOrganization()];
+}
+
+export function organizationToString(organization: Organization): string {
+  return JSON.stringify(organization);
+}
 
-  export function organizationToString(organization: Organization): string {
-    return JSON.stringify(organization)
-  }
\ No newline at end of file
+export function organizationsToString(organizations: Organization[]): string {
+  return JSON.stringify(organizations);
+}