Merge pull request #124 from Linaro/webdev-2012-rss-feed

Add rss feed and link
Linaro · Oct 1, 2024 · 5c3d39d · 5c3d39d
2 parents 04d93ba + 77edbb1
commit 5c3d39d
Show file tree

Hide file tree

Showing 8 changed files with 138 additions and 26 deletions.
diff --git a/package.json b/package.json
@@ -22,6 +22,7 @@
   "dependencies": {
     "@astrojs/check": "^0.6.0",
     "@astrojs/mdx": "^2.2.4",
+    "@astrojs/rss": "^4.0.7",
     "@astrojs/sitemap": "^3.1.2",
     "@astrojs/solid-js": "^4.0.1",
     "@astrojs/tailwind": "^5.1.0",

diff --git a/src/assets/icons/rss.svg b/src/assets/icons/rss.svg
diff --git a/src/components/common/SocialIcons.astro b/src/components/common/SocialIcons.astro
@@ -17,25 +17,59 @@ const iconColor = color ? `text-${color}` : "text-white";
 const borderColor = color ? `border-${color}` : `border-white`;
 ---
 
-<ul class:list={["not-prose flex flex-wrap", styles]}>
-  {
-    icons.map(
-      ({ label, url, icon }: { url: string; icon: string; label: string }) => (
-        <li
-          class:list={[
-            borderColor,
-            outline ? `p-3 border-2 rounded-full` : "border-none",
-          ]}
-        >
-          <a href={url} target="_blank" aria-label={label}>
-            <Icon
-              name={icon}
-              size={size || 20}
-              class:list={[iconColor, "hover:text-linaro-yellow"]}
-            />
-          </a>
-        </li>
+<>
+  <ul class:list={["not-prose flex flex-wrap", styles]}>
+    {
+      icons.map(
+        ({
+          label,
+          url,
+          icon,
+        }: {
+          url: string;
+          icon: string;
+          label: string;
+        }) => (
+          <li
+            class:list={[
+              borderColor,
+              outline ? `p-3 border-2 rounded-full` : "border-none",
+            ]}
+          >
+            <a href={url} target="_blank" aria-label={label}>
+              <Icon
+                name={icon}
+                size={size || 20}
+                class:list={[iconColor, "hover:text-linaro-yellow"]}
+              />
+            </a>
+          </li>
+        ),
       )
-    )
-  }
-</ul>
+    }
+  </ul>
+  <ul class:list={["not-prose flex flex-wrap mt-2", styles]}>
+    <li class="flex basis-3/7 items-center gap-1">
+      <a
+        href="rss/news.xml"
+        target="_blank"
+        aria-label="RSS-feed"
+        class="flex items-center hover:text-linaro-yellow"
+      >
+        <Icon name="rss" size={size || 20} class="text-current" />
+        News
+      </a>
+    </li>
+    <li class="flex basis-3/7 items-center gap-1">
+      <a
+        href="rss/blog.xml"
+        target="_blank"
+        aria-label="RSS-feed"
+        class="flex items-center hover:text-linaro-yellow"
+      >
+        <Icon name="rss" size={size || 20} class="text-current" />
+        Blog
+      </a>
+    </li>
+  </ul>
+</>
diff --git a/src/components/head/BaseHead.astro b/src/components/head/BaseHead.astro
@@ -31,6 +31,18 @@ const social_image = "";
   <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
   <link rel="manifest" href="/site.webmanifest" />
   <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#000000" />
+  <link
+  rel="alternate"
+  type="application/rss+xml"
+  title="Linaro.org"
+  href={new URL("rss/news.xml", Astro.site)}
+/>
+<link
+  rel="alternate"
+  type="application/rss+xml"
+  title="Linaro.org"
+  href={new URL("rss/blog.xml", Astro.site)}
+/>
   <meta name="msapplication-TileColor" content="#da532c" />
   <meta name="theme-color" content="#ffffff" />
   <SEO

diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
@@ -37,7 +37,7 @@ const { title, description, type = "website" } = Astro.props;
         },
         {
           rootMargin: "-300px 0px -300px 0px",
-        }
+        },
       );
 
       animatedElements.forEach((el) => {
@@ -51,7 +51,7 @@ const { title, description, type = "website" } = Astro.props;
 
       function addListeners() {
         const forms = document.querySelectorAll(
-          "[data-contact-form]"
+          "[data-contact-form]",
         ) as NodeListOf<HTMLFormElement>;
 
         forms.forEach((form) => {
@@ -64,7 +64,7 @@ const { title, description, type = "website" } = Astro.props;
 
         const feedback = form.parentElement!.querySelector("#contact-feedback");
         const feedbackText = form.parentElement!.querySelector(
-          "#contact-feedback-text"
+          "#contact-feedback-text",
         ) as HTMLParagraphElement;
 
         const button = form.querySelector("#contact-submit");
@@ -76,7 +76,7 @@ const { title, description, type = "website" } = Astro.props;
         const payload = {} as Record<string, any>;
 
         data.forEach((value, key) => (payload[key] = value));
-        delete payload.agreed
+        delete payload.agreed;
 
         button?.classList.add("hidden");
         loader?.classList.remove("hidden");
@@ -89,7 +89,7 @@ const { title, description, type = "website" } = Astro.props;
             headers: {
               "X-Api-Key": "ox9fSkYfRK16mxy5Gv6pM121H7iAubAQ6uzsDmoW",
             },
-          }
+          },
         )
           .then((response) => response.json())
           .then((result) => {

diff --git a/src/pages/rss/blog.xml.js b/src/pages/rss/blog.xml.js
@@ -0,0 +1,24 @@
+import rss from "@astrojs/rss";
+import { getCollection } from "astro:content";
+
+export async function GET(context) {
+  const blog = await getCollection("blogs");
+
+  const items = [
+    ...blog.map((item) => ({
+      title: item.data.title,
+      pubDate: item.data.date,
+      description: item.data.description,
+      link: `/blog/${item.slug}`,
+    })),
+  ].sort((a, b) => {
+    return b.pubDate - a.pubDate;
+  });
+
+  return rss({
+    title: "Linaro Blog RSS Feed",
+    description: "Linaro Blog",
+    site: context.site,
+    items: items,
+  });
+}
diff --git a/src/pages/rss/news.xml.js b/src/pages/rss/news.xml.js
@@ -0,0 +1,24 @@
+import rss from "@astrojs/rss";
+import { getCollection } from "astro:content";
+
+export async function GET(context) {
+  const news = await getCollection("news");
+
+  const items = [
+    ...news.map((item) => ({
+      title: item.data.title,
+      pubDate: item.data.date,
+      description: item.data.description,
+      link: `/news/${item.slug}`,
+    })),
+  ].sort((a, b) => {
+    return b.pubDate - a.pubDate;
+  });
+
+  return rss({
+    title: "Linaro News RSS Feed",
+    description: "Linaro News",
+    site: context.site,
+    items: items,
+  });
+}
diff --git a/yarn.lock b/yarn.lock
@@ -164,6 +164,14 @@
   dependencies:
     prismjs "^1.29.0"
 
+"@astrojs/rss@^4.0.7":
+  version "4.0.7"
+  resolved "https://registry.yarnpkg.com/@astrojs/rss/-/rss-4.0.7.tgz#af08243ed3c6e29448ecf2c2546f86cd5cf23f27"
+  integrity sha512-ZEG55XFB19l+DplUvBISmz04UbjDtKliRO4Y5+ERRhAMjgCVVobEBNE6ZwWG1h6orWUocy4nfPihKXDyB73x9g==
+  dependencies:
+    fast-xml-parser "^4.4.0"
+    kleur "^4.1.5"
+
 "@astrojs/sitemap@^3.1.2":
   version "3.1.4"
   resolved "https://registry.yarnpkg.com/@astrojs/sitemap/-/sitemap-3.1.4.tgz#9805bd69343572c9da2febd722cbca9797f66f94"
@@ -5265,6 +5273,13 @@ [email protected]:
   dependencies:
     strnum "^1.0.5"
 
+fast-xml-parser@^4.4.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/fast-xml-parser/-/fast-xml-parser-4.5.0.tgz#2882b7d01a6825dfdf909638f2de0256351def37"
+  integrity sha512-/PlTQCI96+fZMAOLMZK4CWG1ItCbfZ/0jx7UIJFChPNrx7tcEgerUgWbeieCM9MfHInUDyK8DWYZ+YrywDJuTg==
+  dependencies:
+    strnum "^1.0.5"
+
 fastq@^1.6.0:
   version "1.17.1"
   resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.17.1.tgz#2a523f07a4e7b1e81a42b91b8bf2254107753b47"