fix(sitemap): fix sitemap format and update timestamp dynamically (#24)

fix(sitemap): fix sitemap format and update timestamp dynamically

app/model/timestamp.ts

@@ -0,0 +1,8 @@
+/* eslint-disable-next-line import/no-unresolved */
+import timestamp from '../data/timestamp.json'
+
+export type Timestamp = {
+  readonly lastUpdated: string
+}
+
+export const lastUpdated = (timestamp as unknown as Timestamp).lastUpdated

app/routes/sitemap[.]xml.tsx

@@ -0,0 +1,55 @@
+import { categories } from '../model/categories'
+import { lastUpdated } from '../model/timestamp'
+
+const composeCategoryURL = ({
+  domain,
+  slug,
+}: {
+  domain: string
+  slug: string
+}) => `
+<url>
+  <loc>${domain}/activities/${slug}</loc>
+  <lastmod>${lastUpdated}</lastmod>
+  <changefreq>weekly</changefreq>
+</url>
+`
+
+export const loader = async ({ request }) => {
+  const host =
+    request.headers.get('X-Forwarded-Host') ?? request.headers.get('host')
+  if (!host) {
+    throw new Error('Could not determine domain URL.')
+  }
+
+  const protocol = host.includes('localhost') ? 'http' : 'https'
+  const domain = `${protocol}://${host}`
+
+  // TODO: updated the lastModified logic
+  const sitemapString = `
+<?xml version="1.0" encoding="UTF-8"?>
+  <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+    <url>
+      <loc>${domain}</loc>
+      <lastmod>${lastUpdated}</lastmod>
+    </url>
+    <url>
+      <loc>${domain}/tentang-kami</loc>
+      <lastmod>${lastUpdated}</lastmod>
+    </url>
+    <url>
+      <loc>${domain}/activities</loc>
+      <lastmod>${lastUpdated}</lastmod>
+    </url>
+    ${categories
+      .map(({ slug }) => composeCategoryURL({ domain, slug }))
+      .reduce((acc, curr) => acc + curr)}
+  </urlset>
+  `.trim()
+  return new Response(sitemapString, {
+    headers: {
+      'Cache-Control': `public, max-age=${60 * 10}, s-maxage=${60 * 60 * 24}`,
+      'Content-Type': 'application/xml',
+    },
+  })
+}

app/scripts/fetch-db.ts

@@ -70,6 +70,15 @@ export async function fetchDatabase() {
     path.resolve(__dirname, '../data/senarai-db.json'),
     JSON.stringify(sheetList)
   )
+  const date = new Date()
+  const monthPad = (date.getMonth() + 1).toString().padStart(2, '0')
+  const datePad = date.getDate().toString().padStart(2, '0')
+  fs.writeFileSync(
+    path.resolve(__dirname, '../data/timestamp.json'),
+    JSON.stringify({
+      lastUpdated: date.getFullYear() + '-' + monthPad + '-' + datePad,
+    })
+  )
 }
 
 ;(function fetchSenarai() {