Demographics page. userMarketplaceAnswer & userUpkAnswer redux stores.

1 files changed, 17 insertions, 1 deletions

diff --git a/src/components/nav-main.tsx b/src/components/nav-main.tsx
index 1f276b1..fbd0ff8 100644
--- a/src/components/nav-main.tsx
+++ b/src/components/nav-main.tsx
@@ -1,6 +1,6 @@
 "use client"
 
-import {ListIcon, NotebookText, Users} from "lucide-react"
+import {ListIcon, NotebookText, Users, User} from "lucide-react"
 import {
     SidebarGroup,
     SidebarGroupContent,
@@ -13,12 +13,14 @@ import {useAppDispatch, useAppSelector} from "@/hooks.ts";
 import {useSelector} from "react-redux";
 import {selectQuestions} from "@/models/questionSlice.ts";
 import {Badge} from "@/components/ui/badge"
+import {selectUserUpkAnswers} from "@/models/userUpkAnswerSlice.ts";
 
 export function NavMain() {
     const dispatch = useAppDispatch()
 
     const app = useAppSelector(state => state.app)
     const questions = useSelector(selectQuestions)
+    const upkAnswers = useSelector(selectUserUpkAnswers)
 
     return (
         <SidebarGroup>
@@ -56,6 +58,20 @@ export function NavMain() {
                         </SidebarMenuButton>
                     </SidebarMenuItem>
 
+                    <SidebarMenuItem key="demographics"
+                                     onClick={() => dispatch(setPage("demographics"))}
+                    >
+                        <SidebarMenuButton tooltip="User Demographics">
+                            <User/>
+                            <span>
+                                Demographics <Badge
+                                className="absolute top-2 right-2 h-5 min-w-5 rounded-full px-1 font-mono tabular-nums cursor-pointer"
+                                variant="outline"
+                            >{upkAnswers.length.toLocaleString()}</Badge>
+                            </span>
+                        </SidebarMenuButton>
+                    </SidebarMenuItem>
+
                     <SidebarMenuItem key="community">
                         <SidebarMenuButton tooltip="Community">
                             <Users/>