feat: Add 'source_url' to news articles for original source attribution, display, and documentation, along with corresponding tests

Signed-off-by: Rishi Raj <rishiraj438gt@gmail.com>

Author: rishiraj38

.github/ISSUE_TEMPLATE/news.md

@@ -11,7 +11,7 @@ We're in the news! When this happens, we take a moment to reprint that news in o
 #### Task
 1. Create a copy of the [news template](https://github.com/layer5io/layer5/tree/master/src/collections/news/news-template/0000-00-00-news-title).
 1. Follow the instructions included in the news template and rename the new file after the title of the news article using lowercase, kebab casing.
-   1. Understand that this is a reprint request and that you are to copy/paste the published article verbatim. Be sure that you have included the filled in each of the front matter of properties. And have provided a hero image from the original article as well as that you use the original article authors name.
+   1. Understand that this is a reprint request and that you are to copy/paste the published article verbatim. Be sure that you have included the filled in each of the front matter of properties. And have provided a hero image from the original article as well as that you use the original article authors name. Use the `source_url` field to point to the original article for attribution.
 1. Please add the following article to [src/collections/news](https://github.com/layer5io/layer5/tree/master/src/collections/news):
 
 **Article:**

CONTRIBUTING.md

@@ -125,7 +125,7 @@ If you'd like to contribute a post to layer5.io/blog, please open an Issue and s
 
 ## Adding News
 
-1. In order to add/update news items, see the detailed instructions in the [news issue template](https://github.com/layer5io/layer5/issues/new?template=news.md).
+1. In order to add/update news items, see the detailed instructions in the [news issue template](https://github.com/layer5io/layer5/issues/new?template=news.md). When adding a reprint, use the optional `source_url` field in the frontmatter to link back to the original article for attribution.
 
 # Contributing to Layer5's Sistent
 

src/collections/news/news-template/0000-00-00-news-title/index.mdx

@@ -6,13 +6,15 @@ author: The Newsroom
 thumbnail_svg: ./sample.svg
 darkthumbnail_svg: ./sample.svg
 eurl: https://www.example.com/some/other/site
+source_url: https://original-source.com/article
 published: false
 ---
 
 {/* A template and instructions for creating news entries.
 
 subtitle:  If the "subtitle" variable is not defined, then put subtitle:""
 eurl:      If the "eurl" (external url) variable is not defined, then put eurl:""
+source_url: Optional. URL to the original article for "Originally published at" attribution.
         for any content to be directly entered below the front matter.
 published: "true" when ready to be public
 

src/sections/Company/News-single/index.js

@@ -87,6 +87,15 @@ const NewsSingle = ({ data, children }) => {
               </div>
             )
           }
+          {
+            frontmatter.source_url && (
+              <div style={{ display: "flex" }}>
+                <h5>
+                  Originally published at <a href={frontmatter.source_url} target="_blank" rel="noopener noreferrer">{frontmatter.source_url}</a>
+                </h5>
+              </div>
+            )
+          }
           <RelatedPosts
             postType="news"
             relatedPosts={relatedPosts}

src/sections/Company/News-single/source_url.test.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import NewsSingle from './index';
+import * as Gatsby from 'gatsby';
+
+const useStaticQuery = jest.spyOn(Gatsby, 'useStaticQuery');
+const mockUseStyledDarkMode = jest.fn();
+
+jest.mock('../../../theme/app/useStyledDarkMode', () => ({
+  useStyledDarkMode: () => ({ isDark: false }),
+}));
+
+describe('NewsSingle', () => {
+  beforeEach(() => {
+    useStaticQuery.mockImplementation(() => ({
+      allMdx: {
+        nodes: []
+      }
+    }));
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders "Originally published at" link when source_url is present', () => {
+    const data = {
+      mdx: {
+        frontmatter: {
+          title: 'Test',
+          source_url: 'https://original.com',
+          author: 'Me',
+          date: '2023-01-01'
+        },
+        fields: { slug: '/test' }
+      }
+    };
+
+    const wrapper = shallow(<NewsSingle data={data} />);
+    const link = wrapper.find('a[href="https://original.com"]');
+    expect(link.exists()).toBe(true);
+    expect(wrapper.text()).toContain('Originally published at');
+  });
+
+  it('does not render "Originally published at" link when source_url is missing', () => {
+    const data = {
+      mdx: {
+        frontmatter: {
+            title: 'Test',
+          author: 'Me',
+          date: '2023-01-01'
+        },
+        fields: { slug: '/test' }
+      }
+    };
+
+    const wrapper = shallow(<NewsSingle data={data} />);
+    expect(wrapper.text()).not.toContain('Originally published at');
+  });
+});

src/templates/news-single.js

@@ -15,6 +15,7 @@ export const query = graphql`
         date(formatString: "MMMM Do, YYYY")
         author
         eurl
+        source_url
         description
         presskit
         thumbnail {