Wrap project data social media links into organization object

Wrapped the social media URLs of the project `links` data object into a `organization` object for a better logical distinction with the `community` object. GH-106
nordtheme · Dec 25, 2018 · b9e326f · b9e326f
1 parent 0f73120
commit b9e326f
Show file tree

Hide file tree

Showing 5 changed files with 57 additions and 43 deletions.
diff --git a/src/components/atoms/core/Link/styles.js b/src/components/atoms/core/Link/styles.js
@@ -17,7 +17,7 @@
 import { css } from "styled-components";
 import { lighten, rgba } from "polished";
 
-import { colors, themedMode, MODE_BRIGHT_SNOW_FLURRY, MODE_DARK_NIGHT_FROST } from "styles/theme";
+import { colors, motion, themedMode, MODE_BRIGHT_SNOW_FLURRY, MODE_DARK_NIGHT_FROST } from "styles/theme";
 
 const backgroundColorHover = themedMode({
   [MODE_BRIGHT_SNOW_FLURRY]: rgba(colors.nord6, 0.45),
@@ -46,7 +46,8 @@ const fontColorHoverMinimal = themedMode({
 const calmly = css`
   border-radius: 0.25em;
   color: ${fontColor};
-  transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
+  transition: color ${motion.speed.duration.transition.text.fade}ms ease-in-out,
+    background-color ${motion.speed.duration.transition.text.fade}ms ease-in-out;
 
   &:hover,
   &:active,
@@ -59,7 +60,7 @@ const calmly = css`
 const decent = css`
   border-bottom: 1px solid ${fontColor};
   color: ${fontColorDecent};
-  transition: color 0.2s ease-in-out;
+  transition: color ${motion.speed.duration.transition.text.fade}ms ease-in-out;
 
   &:hover,
   &:active,
@@ -70,7 +71,7 @@ const decent = css`
 
 const minimal = css`
   border-bottom: 1px solid ${fontColor};
-  transition: border-bottom-color 0.2s ease-in-out;
+  transition: border-bottom-color ${motion.speed.duration.transition.text.fade}ms ease-in-out;
 
   &:hover,
   &:active,

diff --git a/src/components/atoms/core/SiteMetadata/SiteMetadata.jsx b/src/components/atoms/core/SiteMetadata/SiteMetadata.jsx
@@ -26,7 +26,9 @@ const PureSiteMetadata = ({
           description,
           keywords: keywordsNord,
           links: {
-            social: { twitter }
+            organization: {
+              social: { twitter }
+            }
           },
           title
         },
@@ -110,9 +112,11 @@ const SiteMetadata = ({ pathName, ...passProp }) => (
               description
               keywords
               links {
-                social {
-                  twitter {
-                    id
+                organization {
+                  social {
+                    twitter {
+                      id
+                    }
                   }
                 }
               }

diff --git a/src/data/project.js b/src/data/project.js
@@ -38,30 +38,37 @@ const links = {
       url: "https://spectrum.chat/arcticicestudio"
     }
   },
-  social: {
-    github: {
-      id: "arcticicestudio",
-      url: "https://github.com/arcticicestudio"
-    },
-    keybase: {
-      id: "arcticicestudio",
-      url: "https://keybase.io/arcticicestudio"
-    },
-    reddit: {
-      id: "arcticicestudio",
-      url: "https://www.reddit.com/user/arcticicestudio"
-    },
-    spectrum: {
-      id: "arcticicestudio",
-      url: "https://spectrum.chat/users/arcticicestudio"
-    },
-    stackoverflow: {
-      id: "4568698",
-      url: "https://stackoverflow.com/users/4568698/arctic-ice-studio"
-    },
-    twitter: {
-      id: "arcticicestudio",
-      url: "https://twitter.com/arcticicestudio"
+  organization: {
+    url: "https://arcticicestudio.com",
+    social: {
+      github: {
+        id: "arcticicestudio",
+        url: "https://github.com/arcticicestudio"
+      },
+      keybase: {
+        id: "arcticicestudio",
+        url: "https://keybase.io/arcticicestudio"
+      },
+      reddit: {
+        id: "arcticicestudio",
+        url: "https://www.reddit.com/user/arcticicestudio"
+      },
+      slack: {
+        id: "arcticicestudio",
+        url: "https://arcticicestudio.slack.com"
+      },
+      spectrum: {
+        id: "arcticicestudio",
+        url: "https://spectrum.chat/users/arcticicestudio"
+      },
+      stackoverflow: {
+        id: "4568698",
+        url: "https://stackoverflow.com/users/4568698/arctic-ice-studio"
+      },
+      twitter: {
+        id: "arcticicestudio",
+        url: "https://twitter.com/arcticicestudio"
+      }
     }
   }
 };

diff --git a/test/components/atoms/core/Link/__snapshots__/Link.test.jsx.snap b/test/components/atoms/core/Link/__snapshots__/Link.test.jsx.snap
@@ -18,8 +18,8 @@ exports[`theme styles matches the snapshot with \`calmly\` variant 1`] = `
 .c0 {
   border-radius: 0.25em;
   color: #5e81ac;
-  -webkit-transition: color 0.2s ease-in-out,background-color 0.2s ease-in-out;
-  transition: color 0.2s ease-in-out,background-color 0.2s ease-in-out;
+  -webkit-transition: color 200ms ease-in-out, background-color 200ms ease-in-out;
+  transition: color 200ms ease-in-out, background-color 200ms ease-in-out;
 }
 
 .c0:hover,
@@ -55,8 +55,8 @@ exports[`theme styles matches the snapshot with \`decent\` variant 1`] = `
 .c0 {
   border-bottom: 1px solid #5e81ac;
   color: #2e3440;
-  -webkit-transition: color 0.2s ease-in-out;
-  transition: color 0.2s ease-in-out;
+  -webkit-transition: color 200ms ease-in-out;
+  transition: color 200ms ease-in-out;
 }
 
 .c0:hover,
@@ -90,8 +90,8 @@ exports[`theme styles matches the snapshot with \`minimal\` variant 1`] = `
 
 .c0 {
   border-bottom: 1px solid #5e81ac;
-  -webkit-transition: border-bottom-color 0.2s ease-in-out;
-  transition: border-bottom-color 0.2s ease-in-out;
+  -webkit-transition: border-bottom-color 200ms ease-in-out;
+  transition: border-bottom-color 200ms ease-in-out;
 }
 
 .c0:hover,
@@ -126,8 +126,8 @@ exports[`theme styles matches the snapshot with default variant 1`] = `
 .c0 {
   border-radius: 0.25em;
   color: #5e81ac;
-  -webkit-transition: color 0.2s ease-in-out,background-color 0.2s ease-in-out;
-  transition: color 0.2s ease-in-out,background-color 0.2s ease-in-out;
+  -webkit-transition: color 200ms ease-in-out, background-color 200ms ease-in-out;
+  transition: color 200ms ease-in-out, background-color 200ms ease-in-out;
 }
 
 .c0:hover,

diff --git a/test/components/atoms/core/SiteMetadata/SiteMetadata.test.jsx b/test/components/atoms/core/SiteMetadata/SiteMetadata.test.jsx
@@ -26,8 +26,10 @@ const staticQueryResultDataMock = {
         description: metadataNord.description,
         keywords: metadataNord.keywords,
         links: {
-          social: {
-            twitter: metadataNord.links.social.twitter
+          organization: {
+            social: {
+              twitter: metadataNord.links.organization.social.twitter
+            }
           }
         },
         title: metadataNord.title
@@ -98,7 +100,7 @@ describe("data consistency", () => {
         }),
         expect.objectContaining({
           name: "twitter:site",
-          content: expect.stringContaining(metadataNord.links.social.twitter.id)
+          content: expect.stringContaining(metadataNord.links.organization.social.twitter.id)
         }),
         expect.objectContaining({
           name: "twitter:description",