diff --git a/web/src/components/psc/checklist-table.tsx b/web/src/components/psc/checklist-table.tsx index 23b82dd..18edee3 100644 --- a/web/src/components/psc/checklist-table.tsx +++ b/web/src/components/psc/checklist-table.tsx @@ -119,21 +119,52 @@ export default component$((props: { section: Section }) => { filterState.show = originalFilters.show; }); + const calculateProgress = (): { done: number, total: number, percent: number, disabled: number} => { + let done = 0; + let disabled = 0; + let total = 0; + + props.section.checklist.forEach((item) => { + const itemId = generateId(item.point); + if (isIgnored(itemId)) { + disabled += 1; + } else if (isChecked(itemId)) { + done += 1; + total += 1; + } else { + total += 1; + } + }); + + const percent = Math.round((done / total) * 100); + return { done, total: props.section.checklist.length, percent, disabled }; + }; + + const { done, total, percent, disabled } = calculateProgress(); + return ( <> +
+
+ +

+ {done} out of {total} ({percent}%) + complete, {disabled} ignored

+
-
- {(sortState.column || JSON.stringify(filterState) !== JSON.stringify(originalFilters)) && ( - + )} + - )} - +
{showFilters.value && ( diff --git a/web/src/routes/article/[slug]/index.tsx b/web/src/routes/article/[slug]/index.tsx index def0808..1336b46 100644 --- a/web/src/routes/article/[slug]/index.tsx +++ b/web/src/routes/article/[slug]/index.tsx @@ -1,6 +1,6 @@ // src/routes/articles/[slug].tsx import { component$, Resource, useResource$, useStore } from '@builder.io/qwik'; -import { useLocation } from '@builder.io/qwik-city'; +import { type DocumentHead, useLocation, useDocumentHead } from '@builder.io/qwik-city'; import { marked } from "marked"; import articles from '~/data/articles'; @@ -14,6 +14,20 @@ export default component$(() => { const slug = location.params.slug; const article = articles.find(a => a.slug === slug); + // useDocumentHead(() => { + // if (!article) { + // return { + // title: '404 Not Found | Your Site Name', + // meta: [{ name: 'description', content: 'The requested article was not found.' }], + // }; + // } + + // return { + // title: `${article.title} | Your Site Name`, + // meta: [{ name: 'description', content: article.description }], + // }; + // }); + const parseMarkdown = (text: string | undefined): string => { if (!text) return ''; @@ -98,3 +112,13 @@ export default component$(() => { ); }); +export const head: DocumentHead = { + title: "Article | Digital Defense", + meta: [ + { + name: "description", + content: "", + }, + ], +}; + diff --git a/web/src/routes/checklist/[title]/index.tsx b/web/src/routes/checklist/[title]/index.tsx index 125ce88..ab8b674 100644 --- a/web/src/routes/checklist/[title]/index.tsx +++ b/web/src/routes/checklist/[title]/index.tsx @@ -4,19 +4,17 @@ import { marked } from 'marked'; import Icon from '~/components/core/icon'; import { ChecklistContext } from '~/store/checklist-context'; -import { useChecklist } from '~/store/local-checklist-store'; import type { Section } from "~/types/PSC"; import Table from '~/components/psc/checklist-table'; export default component$(() => { const checklists = useContext(ChecklistContext); - const localChecklist = useChecklist(); const loc = useLocation(); const slug = loc.params.title; - const section: Section | undefined = (localChecklist.checklist.checklist || checklists.value) + const section: Section | undefined = (checklists.value) .find((item: Section) => item.slug === slug); const parseMarkdown = (text: string | undefined): string => { @@ -36,6 +34,20 @@ export default component$(() => { {section && ()} + {section && section.softwareLinks && ( + <> +
Useful Links
+

Recommended Software

+ + + )} + ); diff --git a/web/src/routes/layout.tsx b/web/src/routes/layout.tsx index 180d311..d16df41 100644 --- a/web/src/routes/layout.tsx +++ b/web/src/routes/layout.tsx @@ -8,7 +8,7 @@ import { ChecklistContext } from "~/store/checklist-context"; import type { Sections } from "~/types/PSC"; export const useChecklists = routeLoader$(async () => { - const remoteUrl = 'https://gist.githubusercontent.com/Lissy93/0c26e4255b6fabc2c027ac72a4428aeb/raw/4ccdbc71e0fffdef53472cf98acbe40b0acf982b/personal-security-checklist.yml'; + const remoteUrl = 'https://gist.githubusercontent.com/Lissy93/0c26e4255b6fabc2c027ac72a4428aeb/raw/c36fc0430df223534eaf76c035943f4b343915e4/personal-security-checklist.yml'; // TODO: Update this URL to point to the Git repository return fetch(remoteUrl) .then((res) => res.text()) diff --git a/web/src/types/PSC.ts b/web/src/types/PSC.ts index 30fe5cb..bc65064 100644 --- a/web/src/types/PSC.ts +++ b/web/src/types/PSC.ts @@ -13,7 +13,9 @@ export interface Section { icon: string, color: string, checklist: Checklist[], - furtherLinks?: FurtherLink[], + softwareLinks?: Link[], + helpfulTools?: Link[], + furtherResources?: Link[], } export type Priority = 'recommended' | 'optional' | 'advanced'; @@ -24,8 +26,8 @@ export interface Checklist { details: string, } -export interface FurtherLink { +export interface Link { title: string, url: string, - description: string, + description?: string, }