Merge pull request #120 from MaddyGuthridge/maddy-sitemap-xml

Improvement for v1.1.7

Author: MaddyGuthridge

eslint.config.mjs

@@ -56,6 +56,7 @@ export default ts.config(
       // strictness in areas where it really doesn't matter (eg error handling)
       '@typescript-eslint/no-unsafe-assignment': 'off',
       '@typescript-eslint/no-unsafe-argument': 'off',
+      '@typescript-eslint/no-unsafe-return': 'off',
       // Also disable template expression checks, since they're also error handling stuff
       // TODO: Enable them at some point when I get around to actually tidying things up
       '@typescript-eslint/no-base-to-string': 'off',

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "minifolio",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "private": true,
   "license": "GPL-3.0-only",
   "scripts": {
@@ -39,6 +39,7 @@
     "superstruct": "^2.0.2",
     "tippy.js": "^6.3.7",
     "validator": "^13.12.0",
+    "xmlbuilder2": "^3.1.1",
     "yauzl": "^3.2.0"
   },
   "devDependencies": {

package.json

@@ -55,11 +55,20 @@
 </div>
 
 <style>
+  /* Justify text */
   .markdown-render :global(p) {
     text-align: justify;
   }
 
+  /* Make images fit in their allocated space */
+  .markdown-render :global(img) {
+    width: 100%;
+    border-radius: 10px;
+  }
+
   /*
+    Inline code
+
     It's pretty annoying needing to select all of these manually so many times. I wonder if there's
     a better way...
   */
@@ -69,7 +78,6 @@
     padding: 2px 5px;
     border-radius: 3px;
   }
-
   .markdown-render :global(p code),
   .markdown-render :global(ol code),
   .markdown-render :global(ul code),
@@ -81,11 +89,15 @@
     /* Kinda bold but not obnoxiously so */
     font-weight: 600;
   }
+  /* Code blocks */
   .markdown-render :global(pre) {
     padding: 1em;
     border-radius: 5px;
   }
-
+  /*
+    hljs adds its own padding in the themes which conflicts with our own definitions, causing
+    annoying visual glitches.
+  */
   .markdown-render :global(pre code.hljs) {
     padding: 0 !important;
   }
@@ -112,10 +124,17 @@
     display: inline;
   }
 
-  .markdown-render :global(a) {
-    text-decoration: none;
-  }
-  .markdown-render :global(a):hover {
-    text-decoration: underline;
+  /*
+    Make links not have an underline unless hovered.
+
+    This is disabled when high contrast is enabled, which improves visibility.
+  */
+  @media not (prefers-contrast) {
+    .markdown-render :global(a) {
+      text-decoration: none;
+    }
+    .markdown-render :global(a):hover {
+      text-decoration: underline;
+    }
   }
 </style>

src/components/markdown/Markdown.svelte

@@ -1,3 +1,4 @@
+import { convert } from 'xmlbuilder2';
 import ApiError from './ApiError';
 
 /** Process a text response, returning the text as a string */
@@ -17,6 +18,25 @@ export async function text(response: Promise<Response>): Promise<string> {
   return text;
 }
 
+/** Process an XML response, converting it to a JS object */
+export async function xml(response: Promise<Response>): Promise<object> {
+  // TODO: Fix this coed duplication
+  const res = await response;
+  if ([404, 405].includes(res.status)) {
+    throw new ApiError(404, `Error ${res.status} at ${res.url}`);
+  }
+  const text = await res.text();
+  if ([400, 401, 403].includes(res.status)) {
+    throw new ApiError(res.status, text);
+  }
+  if (![200, 304].includes(res.status)) {
+    // Unknown error
+    throw new ApiError(res.status, `Request got status code ${res.status}`);
+  }
+
+  return convert(text, { format: 'object' });
+}
+
 /** Process a JSON response, returning the data as a JS object */
 export async function json(response: Promise<Response>): Promise<object> {
   const res = await response;
@@ -81,6 +101,7 @@ export async function buffer(response: Promise<Response>): Promise<Uint8Array> {
  */
 export default (response: Promise<Response>) => ({
   json: () => json(response),
+  xml: () => xml(response),
   text: () => text(response),
   buffer: () => buffer(response),
   response,

src/endpoints/fetch/response.ts

@@ -3,9 +3,14 @@ import type { ItemId } from '$lib/itemId';
 import admin from './admin';
 import config from './config';
 import debug from './debug';
+import { apiFetch } from './fetch';
 import item from './item';
 import page from './pages';
 
+export function sitemap(fetchFn: typeof fetch, token: string | undefined) {
+  return apiFetch(fetchFn, 'GET', '/sitemap.xml', { token }).xml();
+}
+
 /** Create an instance of the API client with the given token */
 export default function api(fetchFn: typeof fetch = fetch, token?: string) {
   return {
@@ -17,6 +22,8 @@ export default function api(fetchFn: typeof fetch = fetch, token?: string) {
     config: config(fetchFn, token),
     /** Item data endpoints */
     item: (itemId: ItemId) => item(fetchFn, token, itemId),
+    /** Sitemap.xml, converted to JS object */
+    sitemap: () => sitemap(fetchFn, token),
     /** An HTML page */
     page: page(fetchFn, token),
     /** Create a new API client with the given token */

src/endpoints/index.ts

@@ -24,6 +24,6 @@ export default function page(fetchFn: typeof fetch, token: string | undefined) {
     /** AT Protocol decentralized ID */
     atProtoDid: async () => {
       return apiFetch(fetchFn, 'GET', '/.well-known/atproto-did', {token}).text();
-    }
+    },
   };
 }

src/endpoints/pages.ts

@@ -28,18 +28,15 @@ export function createItemFilter(portfolio: ItemData, parentId: ItemId): FilterO
 /**
  * Returns a list of itemIds within the given groupId that match the given filter
  *
- * @param globals global data
- * @param groupId group ID to find items within
+ * @param portfolio global data
+ * @param items list of items to filter on
  * @param filter filter options
  */
 export function applyFiltersToItemChildren(
   portfolio: ItemData,
-  id: ItemId,
+  items: ItemId[],
   filter: FilterOptions,
 ): ItemId[] {
-  // Figure out what items to show to start with
-  const items: ItemId[] = getDescendant(portfolio, id).info.children.map(child => itemId.child(id, child));
-
   // Reduce items based on the filter
   return filter.reduce(
     (prevItems, filterSet) => {

src/lib/itemFilter.ts

@@ -101,8 +101,6 @@ export function validateUrl(url: string): string {
     error(400, 'URL protocol must be HTTP or HTTPS');
   }
 
-  console.log('Protocol:', parsed.protocol);
-
   return url;
 }
 

src/lib/validate.ts

@@ -58,11 +58,12 @@
     } else {
       return applyFiltersToItemChildren(
         data.portfolio,
-        data.itemId,
+        items,
         filterItems,
       );
     }
   });
+
   // Janky workaround for allowing PageData to be bindable.
   // Based on https://www.reddit.com/r/sveltejs/comments/1gx65ho/comment/lykrc6c/
   $effect.pre(() => {