Passing in onClick for FullProfileQuestion so that Profile Question and SoftPair are different. Using API models to POST to Softpair submission (with offerwall_id saved). Updating from Conditional to Ineligible buckets. Availability Count to app state. Using / exploring sidebar to show filtered questions for specific Bucket.

1 files changed, 9 insertions, 2 deletions

diff --git a/src/components/nav-main.tsx b/src/components/nav-main.tsx
index 34fa5a8..1f276b1 100644
--- a/src/components/nav-main.tsx
+++ b/src/components/nav-main.tsx
@@ -9,7 +9,7 @@ import {
     SidebarMenuItem,
 } from "@/components/ui/sidebar"
 import {setPage} from "@/models/appSlice.ts";
-import {useAppDispatch} from "@/hooks.ts";
+import {useAppDispatch, useAppSelector} from "@/hooks.ts";
 import {useSelector} from "react-redux";
 import {selectQuestions} from "@/models/questionSlice.ts";
 import {Badge} from "@/components/ui/badge"
@@ -17,6 +17,7 @@ import {Badge} from "@/components/ui/badge"
 export function NavMain() {
     const dispatch = useAppDispatch()
 
+    const app = useAppSelector(state => state.app)
     const questions = useSelector(selectQuestions)
 
     return (
@@ -29,7 +30,13 @@ export function NavMain() {
                     >
                         <SidebarMenuButton tooltip="Surveys">
                             <NotebookText/>
-                            <span>Surveys</span>
+                            <span>
+                                Surveys <Badge
+                                className="absolute top-2 right-2 h-5 min-w-5 rounded-full px-1 font-mono tabular-nums cursor-pointer"
+                                variant="outline"
+                                title={`${(app.availability_count ?? 0).toLocaleString()} live surveys`}
+                            >{(app.availability_count ?? 0).toLocaleString()}</Badge>
+                            </span>
                         </SidebarMenuButton>
                     </SidebarMenuItem>