feat: add live data to EntriesListSidebar

This commit is contained in:
Thomas Bishop 2025-07-18 16:13:05 +01:00
parent 335e935971
commit a21e5721d2
2 changed files with 37 additions and 30 deletions

View file

@ -4,8 +4,16 @@ import { SidebarMenuButton, SidebarMenuItem, SidebarMenuSub } from "@/components
import { Collapsible, CollapsibleTrigger } from "@radix-ui/react-collapsible" import { Collapsible, CollapsibleTrigger } from "@radix-ui/react-collapsible"
import { CollapsibleContent } from "../components/ui/collapsible" import { CollapsibleContent } from "../components/ui/collapsible"
import { mockEntries } from "@/mock-data/mock-entries" import { useQuery } from "@tanstack/react-query"
import api from "../api/eolas-api"
export default function EntriesListSidebar() { export default function EntriesListSidebar() {
const { data: entries, isLoading } = useQuery({
queryKey: ["entries_list"],
queryFn: () => api.get("/entries").then((res) => res.data),
})
console.log(entries)
return ( return (
<Collapsible className="group/collapsible"> <Collapsible className="group/collapsible">
<SidebarMenuItem key="entries"> <SidebarMenuItem key="entries">
@ -20,9 +28,9 @@ export default function EntriesListSidebar() {
</CollapsibleTrigger> </CollapsibleTrigger>
<CollapsibleContent> <CollapsibleContent>
<SidebarMenuSub> <SidebarMenuSub>
{mockEntries.map((item) => ( {entries?.entries.map((item, i) => (
<SidebarMenuItem> <SidebarMenuItem key={i}>
<a href={item.url}> <a>
<span className="text-xs">{item.title}</span> <span className="text-xs">{item.title}</span>
</a> </a>
</SidebarMenuItem> </SidebarMenuItem>

View file

@ -3,7 +3,6 @@ import { Tags, ChevronRight } from "lucide-react"
import { SidebarMenuButton, SidebarMenuItem, SidebarMenuSub } from "@/components/ui/sidebar" import { SidebarMenuButton, SidebarMenuItem, SidebarMenuSub } from "@/components/ui/sidebar"
import { Collapsible, CollapsibleTrigger } from "@radix-ui/react-collapsible" import { Collapsible, CollapsibleTrigger } from "@radix-ui/react-collapsible"
import { CollapsibleContent } from "../components/ui/collapsible" import { CollapsibleContent } from "../components/ui/collapsible"
import { mockTags } from "@/mock-data/mock-tags"
import { useQuery } from "@tanstack/react-query" import { useQuery } from "@tanstack/react-query"
import api from "../api/eolas-api" import api from "../api/eolas-api"
@ -29,8 +28,8 @@ export default function TagListSidebar() {
</CollapsibleTrigger> </CollapsibleTrigger>
<CollapsibleContent> <CollapsibleContent>
<SidebarMenuSub> <SidebarMenuSub>
{tags?.tags.map((item) => ( {tags?.tags.map((item, i) => (
<SidebarMenuItem> <SidebarMenuItem key={i}>
<a> <a>
<span className="text-xs">{item}</span> <span className="text-xs">{item}</span>
</a> </a>