Awesome-Mirrors/personal-security-checklist
1
0
Fork 0
mirror of https://github.com/Lissy93/personal-security-checklist.git synced 2024-10-01 01:35:37 -04:00
Code Issues Packages Projects Releases Wiki Activity

Update nav to use live data

Browse Source
This commit is contained in:
Alicia Sykes 2024-03-10 23:03:17 +00:00
parent f1d69b6b78
commit 2899f49625
1 changed files with 6 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/src/components/furniture/nav.tsx
View File

@ -1,14 +1,16 @@
import { $, component$ } from "@builder.io/qwik"; import { $, component$, useContext } from "@builder.io/qwik";
import Icon from "~/components/core/icon"; import Icon from "~/components/core/icon";
import { data } from '~/mock-data';
import type { Section } from '~/types/PSC'; import type { Section } from '~/types/PSC';
import { useTheme } from '~/store/theme-store'; import { useTheme } from '~/store/theme-store';
import articles from '~/data/articles'; import articles from '~/data/articles';
import { ChecklistContext } from '~/store/checklist-context';
export default component$(() => { export default component$(() => {
const data = useContext(ChecklistContext);
const { theme, setTheme } = useTheme(); const { theme, setTheme } = useTheme();
const themes = [ const themes = [
@ -50,7 +52,7 @@ export default component$(() => {
Checklists Checklists
</summary> </summary>
<ul class="p-2 bg-base-100 rounded-t-none z-10"> <ul class="p-2 bg-base-100 rounded-t-none z-10">
{data.map((item: Section, index: number) => ( {data.value.map((item: Section, index: number) => (
<li key={`checklist-nav-${index}`} class={`hover:bg-${item.color}-600 hover:bg-opacity-15`}> <li key={`checklist-nav-${index}`} class={`hover:bg-${item.color}-600 hover:bg-opacity-15`}>
<a href={`/checklist/${item.slug}`}> <a href={`/checklist/${item.slug}`}>
<Icon color={item.color} class="mr-2" icon={item.icon} width={16} height={16} /> <Icon color={item.color} class="mr-2" icon={item.icon} width={16} height={16} />
@ -106,7 +108,7 @@ export default component$(() => {
<li> <li>
<a href="/checklist"><Icon class="mr-2" icon="all" width={16} height={16} />Checklists</a> <a href="/checklist"><Icon class="mr-2" icon="all" width={16} height={16} />Checklists</a>
<ul> <ul>
{data.map((item: Section, index: number) => ( {data.value.map((item: Section, index: number) => (
<li key={`checklist-side-${index}`} class={`hover:bg-${item.color}-600 hover:bg-opacity-15`}> <li key={`checklist-side-${index}`} class={`hover:bg-${item.color}-600 hover:bg-opacity-15`}>
<a href={`/checklist/${item.slug}`}> <a href={`/checklist/${item.slug}`}>
<Icon color={item.color} class="mr-2" icon={item.icon} width={16} height={16} /> <Icon color={item.color} class="mr-2" icon={item.icon} width={16} height={16} />