From 333ed98b2011fa7a6f36f476f423596da7b10f38 Mon Sep 17 00:00:00 2001
From: Mikael <46541386+ahnl@users.noreply.github.com>
Date: Wed, 6 Nov 2024 16:00:54 +0200
Subject: [PATCH] feat: rss feed links on the site

design is my passion vai miten se meni
---
 app/syslog/page.tsx                             | 13 ++++++++++++-
 components/NavigateLink/NavigateLink.module.css |  4 ++--
 components/NavigateLink/NavigateLink.tsx        |  9 +++++----
 3 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/app/syslog/page.tsx b/app/syslog/page.tsx
index 657feee6..d4afc2af 100644
--- a/app/syslog/page.tsx
+++ b/app/syslog/page.tsx
@@ -6,10 +6,12 @@ import { Footer } from '@/components/Footer/Footer';
 import { PostsGrid } from '@/components/PostsGrid/PostsGrid';
 import { H2 } from '@/components/Title/Title';
 import { CapsuleButton } from '@/components/Button/CapsuleButton';
+import { FaRss } from "react-icons/fa";
 import MorePosts from './MorePosts';
 import posts from '@/utils/posts';
 import Separator from '@/components/Separator/Separator';
 import { Metadata } from 'next';
+import { NavigateLink } from '@/components/NavigateLink/NavigateLink';
 
 const perPage = 10;
 
@@ -17,6 +19,12 @@ export const metadata: Metadata = {
   title: "Syslog",
   description: "Testausserverin jäsenten kirjoittamia artikkeleja teknologiasta"
 }
+
+function RssIcon() {
+  return (
+    <FaRss size={16}/>
+  )
+}
 export default async function Page() {
   const list = await posts.list(0, perPage - 1);
   const { posts: basePosts } = list;
@@ -40,7 +48,10 @@ export default async function Page() {
           <H2>Testausauton uusimmat</H2>
           <PostsGrid posts={testausautoRecentPosts}/>
         </Content>
-
+        <Content>
+          <NavigateLink href="https://testausserveri.fi/syslog/rss.xml"><RssIcon /> Syslogin RSS-syöte</NavigateLink>
+          <NavigateLink href="https://testausauto.fi/rss"><RssIcon /> Testausauton RSS-syöte</NavigateLink>
+        </Content>
       <Footer />
     </div>
   )
diff --git a/components/NavigateLink/NavigateLink.module.css b/components/NavigateLink/NavigateLink.module.css
index 1a242a9d..c2ae274c 100644
--- a/components/NavigateLink/NavigateLink.module.css
+++ b/components/NavigateLink/NavigateLink.module.css
@@ -6,7 +6,7 @@
     margin-bottom: 1em;
 }
 
-.navigatelink svg {
+.navigatelink svg:nth-last-child(1) {
     vertical-align: middle;
     font-size: 1.4em;
     margin-left: 0.4em;
@@ -14,7 +14,7 @@
     transition: margin-left 0.2s ease-out;
 }
 
-.navigatelink:hover svg {
+.navigatelink:hover svg:nth-last-child(1) {
     margin-left: 0.8em !important;
     color: white;
 }
\ No newline at end of file
diff --git a/components/NavigateLink/NavigateLink.tsx b/components/NavigateLink/NavigateLink.tsx
index 6fa34465..875a5cd4 100644
--- a/components/NavigateLink/NavigateLink.tsx
+++ b/components/NavigateLink/NavigateLink.tsx
@@ -1,15 +1,16 @@
 import Link from 'next/link';
 import styles from './NavigateLink.module.css'
 import { HiOutlineArrowNarrowRight } from "react-icons/hi";
-import { PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
 
 type NavigateLinkProps = PropsWithChildren<{
-    href: string
+    href: string,
+    CustomIcon?: FC
 }>
 
-export function NavigateLink({ href, children }: NavigateLinkProps) {
+export function NavigateLink({ href, CustomIcon, children }: NavigateLinkProps) {
     return <Link href={href} className={styles.navigatelink}>
         {children}
-        <HiOutlineArrowNarrowRight />
+        {CustomIcon ? <CustomIcon /> : <HiOutlineArrowNarrowRight />}
     </Link>;
 }