From 0e60743d140aff66eca6df712f653ee20f5d4ef3 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Tue, 3 Oct 2023 19:36:03 +0200
Subject: refactor(components): rewrite SocialLink component

* replace default label with a label prop
* rename name prop to icon prop
---
 .../atoms/links/social-link/social-link.test.tsx   | 62 ++++++++++++++++++++++
 1 file changed, 62 insertions(+)
 create mode 100644 src/components/atoms/links/social-link/social-link.test.tsx

(limited to 'src/components/atoms/links/social-link/social-link.test.tsx')

diff --git a/src/components/atoms/links/social-link/social-link.test.tsx b/src/components/atoms/links/social-link/social-link.test.tsx
new file mode 100644
index 0000000..9129c27
--- /dev/null
+++ b/src/components/atoms/links/social-link/social-link.test.tsx
@@ -0,0 +1,62 @@
+import { describe, expect, it } from '@jest/globals';
+import { render, screen as rtlScreen } from '@testing-library/react';
+import { SocialLink } from './social-link';
+
+/**
+ * Next.js mock images to use next/image component. So for now, I need to mock
+ * the svg files manually.
+ */
+jest.mock('@assets/images/social-media/github.svg', () => 'svg-file');
+jest.mock('@assets/images/social-media/gitlab.svg', () => 'svg-file');
+jest.mock('@assets/images/social-media/linkedin.svg', () => 'svg-file');
+jest.mock('@assets/images/social-media/twitter.svg', () => 'svg-file');
+
+describe('SocialLink', () => {
+  it('render a Github social link', () => {
+    const label = 'sed ea impedit';
+    const target = '/voluptas';
+
+    render(<SocialLink icon="Github" label={label} url={target} />);
+
+    expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
+      'href',
+      target
+    );
+  });
+
+  it('render a Gitlab social link', () => {
+    const label = 'rerum velit asperiores';
+    const target = '/enim';
+
+    render(<SocialLink icon="Gitlab" label={label} url={target} />);
+
+    expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
+      'href',
+      target
+    );
+  });
+
+  it('render a LinkedIn social link', () => {
+    const label = 'in dolores sed';
+    const target = '/ut';
+
+    render(<SocialLink icon="LinkedIn" label={label} url={target} />);
+
+    expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
+      'href',
+      target
+    );
+  });
+
+  it('render a Twitter social link', () => {
+    const label = 'voluptatibus temporibus expedita';
+    const target = '/magni';
+
+    render(<SocialLink icon="Twitter" label={label} url={target} />);
+
+    expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
+      'href',
+      target
+    );
+  });
+});
-- 
cgit v1.2.3