[WMAS-39] IR 페이지 추가 (#589)

* wip * ir 페이지 작업 * ir.daangn.com 사이트 리디렉션 추가 * 페이지 타이틀 추가
daangn · May 12, 2022 · 2a93224 · 2a93224 · vercel · May 12, 2022
1 parent f889c99
commit 2a93224
Show file tree

Hide file tree

Showing 17 changed files with 595 additions and 114 deletions.
diff --git a/_packages/@karrotmarket/gatsby-theme-team-website/src/components/JobPostList.tsx b/_packages/@karrotmarket/gatsby-theme-team-website/src/components/JobPostList.tsx
@@ -44,8 +44,10 @@ const List = styled(motion.ul, {
 const JobPostLink = styled(Link, {
   display: 'block',
   color: 'inherit',
-  transition: 'color .3s',
   textDecoration: 'none',
+  '@media not (prefers-reduced-motion: reduce)': {
+    transition: 'color .3s',
+  },
   '&:hover': {
     color: vars.$scale.color.gray600,
   },

diff --git a/_packages/@karrotmarket/gatsby-theme-team-website/src/layouts/DefaultLayout.tsx b/_packages/@karrotmarket/gatsby-theme-team-website/src/layouts/DefaultLayout.tsx
@@ -14,8 +14,6 @@ import _Header from '@karrotmarket/gatsby-theme-website/src/components/Header';
 import _Footer from '@karrotmarket/gatsby-theme-website/src/components/Footer';
 import { useTranslation } from '@karrotmarket/gatsby-plugin-lokalise-translation/src/translation';
 
-import { usePrefersColorScheme } from '../utils/usePreferColorScheme';
-
 type DefaultLayoutProps = OverrideProps<
   PageProps<GatsbyTypes.TeamWebsite_DefaultLayout_queryFragment>,
   {
@@ -78,14 +76,22 @@ const DefaultLayout: React.FC<DefaultLayoutProps> = ({
   data,
   children,
 }) => {
+  try {
+    required(data.prismicSiteNavigation);
+    required(data.prismicTeamContents?.data);
+  } catch {
+    return (
+      <div id="layout">
+        {children}
+      </div>
+    );
+  }
+
   const messages = useTranslation();
 
   const siteOrigin = useSiteOrigin();
   const { pathname: currentPath } = useLocation();
 
-  required(data.prismicSiteNavigation);
-  required(data.prismicTeamContents?.data);
-
   return (
     <>
       <Helmet>

diff --git a/_packages/@karrotmarket/gatsby-theme-team-website/src/layouts/JobPostLayout.tsx b/_packages/@karrotmarket/gatsby-theme-team-website/src/layouts/JobPostLayout.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
 import type { PageProps } from 'gatsby';
-import { navigate } from 'gatsby';
+import { } from 'gatsby';
 import { rem } from 'polished';
 import { motion, AnimateSharedLayout } from 'framer-motion';
-import { graphql, Link } from 'gatsby';
+import { graphql, navigate, Link } from 'gatsby';
 import { styled } from 'gatsby-theme-stitches/src/config';
 import { GatsbySeo } from 'gatsby-plugin-next-seo';
 import type { OverrideProps } from '@cometjs/core';

diff --git a/_packages/@karrotmarket/gatsby-theme-team-website/src/layouts/index.tsx b/_packages/@karrotmarket/gatsby-theme-team-website/src/layouts/index.tsx
@@ -55,22 +55,6 @@ const LayoutSwitch: React.FC<LayoutSwitchProps> = ({
 
   const { pathname: path } = useLocation();
 
-  if (path === '/') {
-    return (
-      <DefaultLayout {...props}>
-        {children}
-      </DefaultLayout>
-    );
-  }
-
-  if (/\/jobs\/faq\/?$/.test(path)) {
-    return (
-      <DefaultLayout {...props}>
-        {children}
-      </DefaultLayout>
-    );
-  }
-
   if (/\/jobs\/\d+\/?/.test(path)) {
     return (
       <DefaultLayout {...props}>
@@ -81,31 +65,11 @@ const LayoutSwitch: React.FC<LayoutSwitchProps> = ({
     );
   }
 
-  if (/\/jobs\/.+\/?/.test(path)) {
-    return (
-      <DefaultLayout {...props}>
-        {children}
-      </DefaultLayout>
-    );
-  }
-
-  if (/\/faq\/.+\/?/.test(path)) {
-    return (
-      <DefaultLayout {...props}>
-        {children}
-      </DefaultLayout>
-    );
-  }
-
-  if (/\/(jobs|preview|culture|faq)\/?/.test(path)) {
-    return (
-      <DefaultLayout {...props}>
-        {children}
-      </DefaultLayout>
-    );
-  }
-
-  return <>{children}</>;
+  return (
+    <DefaultLayout {...props}>
+      {children}
+    </DefaultLayout>
+  );
 }
 
 export default LayoutSwitch;
diff --git a/_packages/@karrotmarket/gatsby-theme-team-website/src/pages/404.tsx b/_packages/@karrotmarket/gatsby-theme-team-website/src/pages/404.tsx
@@ -6,7 +6,6 @@ import { styled } from 'gatsby-theme-stitches/src/config';
 import { GatsbySeo } from 'gatsby-plugin-next-seo';
 import { mapLink, useLinkParser } from '@karrotmarket/gatsby-theme-website/src/link';
 import { required } from '@cometjs/core';
-import DefaultLayout from '../layouts/DefaultLayout';
 import ButtonLink from '../components/Button';
 
 import { withPrismicUnpublishedPreview } from 'gatsby-plugin-prismic-previews';
@@ -70,54 +69,53 @@ const Control = styled('div', {
   },
 });
 
-const NotFoundPage: React.FC<NotFoundPageProps> = pageProps => {
-  const { data } = pageProps;
-  const parseLink = useLinkParser();
-
+const NotFoundPage: React.FC<NotFoundPageProps> = ({
+  data,
+}) => {
   required(data.prismicTeamContents?.data);
 
+  const parseLink = useLinkParser();
+
   return (
-    <DefaultLayout {...pageProps}>
+    <Container>
       <GatsbySeo noindex nofollow />
-      <Container>
-        <Title>
-          {data.prismicTeamContents.data.notfound_page_title.text}
-        </Title>
-        <Illustration />
-        <Control>
-          {data.prismicTeamContents.data.notfound_page_link_group
-            .map((entry, i) => {
-              const link = parseLink(entry.link.url);
-              return mapLink(link, {
-                Internal: link => (
-                  <ButtonLink
-                    key={i}
-                    to={link.pathname}
-                    type={i === 0 ? 'primary' : 'default'}
-                    fullWidth={{ initial: true, '@sm': false }}
-                  >
-                    {entry.display_text}
-                  </ButtonLink>
-                ),
-                External: link => (
-                  <ButtonLink
-                    as="a"
-                    target="_blank"
-                    rel="external noopener"
-                    key={i}
-                    href={link.url.href}
-                    type={i === 0 ? 'primary' : 'default'}
-                    fullWidth={{ initial: true, '@sm': false }}
-                  >
-                    {entry.display_text}
-                  </ButtonLink>
-                ),
-              });
-            })
-          }
-        </Control>
-      </Container>
-    </DefaultLayout>
+      <Title>
+        {data.prismicTeamContents.data.notfound_page_title.text}
+      </Title>
+      <Illustration />
+      <Control>
+        {data.prismicTeamContents.data.notfound_page_link_group
+          .map((entry, i) => {
+            const link = parseLink(entry.link.url);
+            return mapLink(link, {
+              Internal: link => (
+                <ButtonLink
+                  key={i}
+                  to={link.pathname}
+                  type={i === 0 ? 'primary' : 'default'}
+                  fullWidth={{ initial: true, '@sm': false }}
+                >
+                  {entry.display_text}
+                </ButtonLink>
+              ),
+              External: link => (
+                <ButtonLink
+                  as="a"
+                  target="_blank"
+                  rel="external noopener"
+                  key={i}
+                  href={link.url.href}
+                  type={i === 0 ? 'primary' : 'default'}
+                  fullWidth={{ initial: true, '@sm': false }}
+                >
+                  {entry.display_text}
+                </ButtonLink>
+              ),
+            });
+          })
+        }
+      </Control>
+    </Container>
   );
 };
 

diff --git a/_packages/@karrotmarket/gatsby-theme-team-website/src/types/svgr.d.ts b/_packages/@karrotmarket/gatsby-theme-team-website/src/types/svgr.d.ts
@@ -1,5 +1,6 @@
 declare module '*.svg' {
   import type * as React from 'react';
+
   interface SvgrComponent extends React.StatelessComponent<React.SVGAttributes<SVGElement>> {}
 
   const url: string;

diff --git a/ir.daangn.com/vercel.json b/ir.daangn.com/vercel.json
@@ -0,0 +1,9 @@
+{
+  "redirects": [
+    {
+      "source": "/(.*)",
+      "destination": "https://team.daangn.com/ir/",
+      "permanent": false
+    }
+  ]
+}
diff --git a/team.daangn.com/gatsby-node.ts b/team.daangn.com/gatsby-node.ts
@@ -1,4 +1,6 @@
+import * as path from 'path';
 import type { GatsbyNode } from 'gatsby';
+import { createRemoteFileNode } from 'gatsby-source-filesystem';
 
 export const onCreateBabelConfig: GatsbyNode['onCreateBabelConfig'] = ({
   actions,
@@ -20,3 +22,106 @@ export const onPostBootstrap: GatsbyNode['onPostBootstrap'] = ({
     isPermanent: true,
   });
 };
+
+export const createResolvers: GatsbyNode['createResolvers'] = ({
+  createResolvers,
+  actions: {
+    createNode,
+  },
+  store,
+  cache,
+  reporter,
+  createNodeId,
+}) => {
+  createResolvers({
+    PrismicLinkType: {
+      localFileFixed: {
+        type: 'File',
+        description: 'See https://github.com/gatsbyjs/gatsby/issues/35636',
+        resolve(source: any) {
+          if (!source.url) {
+            return null;
+          }
+
+          const url = new URL(source.url);
+
+          let name: string | undefined = undefined;
+          let ext: string | undefined = undefined;
+
+          const match = url.pathname.match(/\/([^/\\&\?]+)(\.\w{3,4})$/);
+          if (match) {
+            name = decodeURIComponent(match[1]);
+            ext = match[2] ?? undefined;
+            url.pathname.replace(match[1], name);
+            url.searchParams.set('_fix35636', 'true');
+          }
+
+          return createRemoteFileNode({
+            url: url.toString(),
+            cache,
+            createNode,
+            createNodeId,
+            store,
+            reporter,
+            name,
+            ext,
+          });
+        },
+      },
+    },
+  });
+};
+
+export const createPages: GatsbyNode['createPages'] = async ({
+  graphql,
+  actions,
+  reporter,
+  store,
+}) => {
+  const { program } = store.getState();
+  const basePath = program.directory as string;
+
+  const gql = String.raw;
+
+  type Data = {
+    allPrismicIr: {
+      nodes: Array<{
+        uid: string,
+      }>,
+    },
+  };
+  const { data, errors } = await graphql<Data>(gql`
+    {
+      allPrismicIr(
+        filter: {
+          uid: {
+            ne: null
+          }
+          tags: {
+            in: ["team.daangn.com"]
+          }
+        }
+      ) {
+        nodes {
+          uid
+        }
+      }
+    }
+  `);
+
+  if (errors) {
+    reporter.panicOnBuild(errors);
+  }
+
+  console.log(data);
+
+  for (const ir of data.allPrismicIr.nodes) {
+    actions.createPage({
+      path: `/ir/${ir.uid}/`,
+      component: path.resolve(basePath, 'src/templates/IrPage.tsx'),
+      context: {
+        uid: ir.uid,
+      },
+    });
+  }
+};
diff --git a/team.daangn.com/package.json b/team.daangn.com/package.json
@@ -28,6 +28,7 @@
     "@karrotmarket/gatsby-source-greenhouse-jobboard": "0.6.0",
     "@karrotmarket/gatsby-theme-team-website": "workspace:^",
     "@karrotmarket/gatsby-transformer-job-post": "workspace:^",
+    "@seed-design/design-token": "alpha",
     "cjk-slug": "0.3.0",
     "gatsby": "4.14.0",
     "gatsby-plugin-advanced-sitemap": "2.1.0",