리딤코드 퍼블리싱

apps/website/src/routes/(default)/UserMenu.svelte

@@ -10,6 +10,7 @@
   import IconPigMoney from '~icons/tabler/pig-money';
   import IconPlanet from '~icons/tabler/planet';
   import IconPlus from '~icons/tabler/plus';
+  import IconScan from '~icons/tabler/scan';
   import { afterNavigate, goto } from '$app/navigation';
   import { fragment, graphql } from '$glitch';
   import { mixpanel } from '$lib/analytics';
@@ -338,6 +339,22 @@
               수익/출금
             </a>
 
+            <a
+              class={flex({
+                align: 'center',
+                gap: '6px',
+                borderBottomWidth: '1px',
+                borderBottomColor: 'gray.100',
+                padding: '14px',
+                fontSize: '14px',
+                width: 'full',
+              })}
+              href="/me/redeem"
+            >
+              <Icon icon={IconScan} />
+              리딤코드 등록
+            </a>
+
             <Link
               style={flex.raw({
                 align: 'center',

apps/website/src/routes/(default)/[space]/dashboard/+layout.svelte

@@ -2,7 +2,7 @@
   import IconBook2 from '~icons/tabler/book2';
   import IconNotes from '~icons/tabler/notes';
   import IconPlanet from '~icons/tabler/planet';
-  // import IconScan from '~icons/tabler/scan';
+  import IconScan from '~icons/tabler/scan';
   import IconUserX from '~icons/tabler/user-x';
   import { graphql } from '$glitch';
   import { flex } from '$styled-system/patterns';
@@ -73,7 +73,7 @@
     <NavItem icon={IconPlanet} pathname="/{$query.space.slug}/dashboard/settings" title="스페이스" />
     <NavItem icon={IconNotes} pathname="/{$query.space.slug}/dashboard/posts" title="포스트" />
     <NavItem icon={IconBook2} pathname="/{$query.space.slug}/dashboard/collections" title="컬렉션" />
-    <!-- <NavItem icon={IconScan} pathname="/{$query.space.slug}/dashboard/redeem" title="리딤코드" /> -->
+    <NavItem icon={IconScan} pathname="/{$query.space.slug}/dashboard/redeem" title="리딤코드" />
     <NavItem icon={IconUserX} pathname="/{$query.space.slug}/dashboard/subscribers/blocked" title="차단" />
   </nav>
 

apps/website/src/routes/(default)/[space]/dashboard/redeem/(create)/+page.svelte

@@ -0,0 +1,70 @@
+<script lang="ts">
+  import IconChevronRight from '~icons/tabler/chevron-right';
+  import { graphql } from '$glitch';
+  import { Button, Helmet, Icon } from '$lib/components';
+  import { css } from '$styled-system/css';
+  import { flex } from '$styled-system/patterns';
+
+  $: query = graphql(`
+    query SpaceDashboardRedeemIndexPage_Query($slug: String!) {
+      space(slug: $slug) {
+        id
+        name
+      }
+    }
+  `);
+</script>
+
+<Helmet description={`${$query.space.name} 스페이스 리딤코드`} title={`리딤코드 | ${$query.space.name}`} />
+
+<div
+  class={css({
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'center',
+    paddingTop: { base: '60px', sm: '68px' },
+    paddingBottom: { base: '120px', sm: '140px' },
+    textAlign: 'center',
+  })}
+>
+  <h2
+    class={css({
+      marginBottom: { base: '6px', sm: '4px' },
+      fontSize: { base: '22px', sm: '30px' },
+      fontWeight: '[800]',
+    })}
+  >
+    종이책에 전자책 혜택을 더하다
+  </h2>
+
+  <p class={css({ fontSize: { base: '13px', sm: '14px' }, color: 'gray.600' })}>
+    리딤코드는 종이책과 유료포스트를 함께 이용할 수 있게 도와주는 서비스로
+    <br />
+    해당 코드를 스캔하거나 입력하면
+    <mark class={css({ color: 'brand.400' })}>글리프에서 발행한 유료포스트가 자동으로 구매 완료</mark>
+    되도록 설정할 수 있어요.
+    <br />
+    코드는 한 계정에만 등록할 수 있어 안전하게 관리가 가능해요.
+  </p>
+
+  <Button
+    style={flex.raw({ align: 'center', gap: '4px', marginTop: '40px', hideFrom: 'sm' })}
+    href="redeem/create"
+    size="sm"
+    type="link"
+    variant="gradation-fill"
+  >
+    리딤 코드 만들기
+    <Icon icon={IconChevronRight} />
+  </Button>
+  <Button
+    style={flex.raw({ align: 'center', gap: '4px', marginTop: '40px', hideBelow: 'sm' })}
+    href="redeem/create"
+    size="md"
+    type="link"
+    variant="gradation-fill"
+  >
+    리딤 코드 만들기
+    <Icon icon={IconChevronRight} size={20} />
+  </Button>
+</div>

apps/website/src/routes/(default)/[space]/dashboard/redeem/(create)/+page.ts

@@ -0,0 +1,5 @@
+import type { PageLoadEvent } from './$types';
+
+export const _SpaceDashboardRedeemIndexPage_QueryVariables = (event: PageLoadEvent) => {
+  return { slug: event.params.space };
+};

apps/website/src/routes/(default)/[space]/dashboard/redeem/(create)/complete/+page.ts

@@ -0,0 +1,6 @@
+import qs from 'query-string';
+import type { PageLoadEvent } from './$types';
+
+export const _SpaceDashboardRedeemCompletePage_QueryVariables = (event: PageLoadEvent) => {
+  return { permalink: qs.parseUrl(event.url.search).query.p };
+};