Merge pull request #203 from coldsurfers/release/surf-tree-v1.0.3

release(surf-tree): 🎨 v1.0.3

apps/surf-tree/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coldsurfers/surf-tree",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "private": true,
   "scripts": {
     "build": "next build",
@@ -22,7 +22,8 @@
     "react-lite-youtube-embed": "^2.4.0",
     "sst": "*",
     "ts-pattern": "*",
-    "zod": "*"
+    "zod": "*",
+    "zustand": "*"
   },
   "devDependencies": {
     "@eslint/eslintrc": "^3",

apps/surf-tree/src/app/page.tsx

@@ -1,3 +1,23 @@
+'use client'
+
+import { useLayoutEffect } from 'react'
+
+const TIME_DURATION = 5000
+
+const TITLE = 'Welcome to SurfTree'
+const SUBTITLE = 'Moving to COLDSURF main page in 5 seconds'
+
 export default function Home() {
-  return null
+  useLayoutEffect(() => {
+    setTimeout(() => {
+      window.location.href = 'https://coldsurf.io'
+    }, TIME_DURATION)
+  }, [])
+
+  return (
+    <>
+      <h1>{TITLE}</h1>
+      <h2>{SUBTITLE}</h2>
+    </>
+  )
 }

apps/surf-tree/src/app/shevil/(components)/index.ts

@@ -0,0 +1,2 @@
+export * from './link-items'
+export * from './share-modal'

apps/surf-tree/src/app/shevil/(components)/link-items/index.ts

@@ -0,0 +1 @@
+export * from './link-items'

apps/surf-tree/src/app/shevil/(components)/link-items/link-items.tsx

@@ -0,0 +1,35 @@
+'use client'
+
+import { useShallow } from 'zustand/shallow'
+import { shevilData } from '../../(data)'
+import { useCommonStore } from '../../(stores)'
+import { HighlightedLink, LinkItem, LinkItemsLayout } from '../../(ui)'
+import { parseYtId } from '../../(utils)'
+
+export function LinkItems() {
+  const { setSharedLink, toggleShareModalVisible } = useCommonStore(
+    useShallow((state) => ({
+      toggleShareModalVisible: state.toggleShareModalVisible,
+      setSharedLink: state.setSharedLink,
+    })),
+  )
+  return (
+    <LinkItemsLayout>
+      {shevilData.links.map((link) =>
+        link.isHighlighted ? (
+          <HighlightedLink key={link.title} type="youtube" youtubeId={parseYtId(link.url) ?? ''} title={link.title} />
+        ) : (
+          <LinkItem
+            key={link.title}
+            href={link.url}
+            title={link.title}
+            onClickShare={() => {
+              toggleShareModalVisible()
+              setSharedLink(link)
+            }}
+          />
+        ),
+      )}
+    </LinkItemsLayout>
+  )
+}

apps/surf-tree/src/app/shevil/(components)/share-modal/index.ts

@@ -0,0 +1 @@
+export * from './share-modal'

apps/surf-tree/src/app/shevil/(components)/share-modal/share-modal.tsx

@@ -0,0 +1,26 @@
+'use client'
+
+import { useShallow } from 'zustand/shallow'
+import { useCommonStore } from '../../(stores)'
+import { ShareModal as ShareModalUI } from '../../(ui)'
+
+export function ShareModal() {
+  const { shareModalVisible, sharedLink, toggleShareModalVisible, setSharedLink } = useCommonStore(
+    useShallow((state) => ({
+      shareModalVisible: state.isShareModalVisible,
+      sharedLink: state.sharedLink,
+      toggleShareModalVisible: state.toggleShareModalVisible,
+      setSharedLink: state.setSharedLink,
+    })),
+  )
+  return (
+    <ShareModalUI
+      visible={shareModalVisible}
+      sharedLink={sharedLink}
+      onClose={() => {
+        toggleShareModalVisible()
+        setSharedLink(null)
+      }}
+    />
+  )
+}

apps/surf-tree/src/app/shevil/(stores)/common-store.ts

@@ -0,0 +1,16 @@
+import { create } from 'zustand'
+import { Link } from '../(data)/data.types'
+
+export type CommonStore = {
+  isShareModalVisible: boolean
+  toggleShareModalVisible: () => void
+  sharedLink: Link | null
+  setSharedLink: (link: Link | null) => void
+}
+
+export const useCommonStore = create<CommonStore>((set) => ({
+  isShareModalVisible: false,
+  toggleShareModalVisible: () => set((state) => ({ isShareModalVisible: !state.isShareModalVisible })),
+  sharedLink: null,
+  setSharedLink: (link: Link | null) => set({ sharedLink: link }),
+}))

apps/surf-tree/src/app/shevil/(stores)/index.ts

@@ -0,0 +1 @@
+export * from './common-store'

apps/surf-tree/src/app/shevil/(ui)/powered-by/powered-by.tsx

@@ -5,10 +5,10 @@ import { StyledPoweredBy } from './powered-by.styled'
 
 export const PoweredBy = () => {
   return (
-    <StyledPoweredBy href="/">
+    <StyledPoweredBy href="https://coldsurf.io">
       <img src="/icons/favicon.ico" style={{ width: 25, height: 25, borderRadius: '50%', marginRight: '0.5rem' }} />
       <Text as="p" style={{ margin: 'unset' }}>
-        Powered by SurfTree
+        Powered by COLDSURF
       </Text>
     </StyledPoweredBy>
   )

apps/surf-tree/src/app/shevil/page.tsx

@@ -1,52 +1,25 @@
-'use client'
-
-import { useState } from 'react'
+import { Metadata } from 'next/types'
+import { LinkItems, ShareModal } from './(components)'
 import { shevilData } from './(data)'
-import { Link } from './(data)/data.types'
-import { useToggle } from './(hooks)'
-import { HeroInfo, HighlightedLink, LinkItem, LinkItemsLayout, PageLayout, ShareModal, TopCard } from './(ui)'
-import { parseYtId } from './(utils)'
+import { HeroInfo, PageLayout, TopCard } from './(ui)'
 
-export default function ShevilPage() {
-  const [shareModalVisible, toggleShareModalVisible] = useToggle()
-  const [sharedLink, setSharedLink] = useState<Link | null>(null)
+export const metadata: Metadata = {
+  title: 'Shevil | SurfTree',
+  description: shevilData.subtitle,
+  icons: {
+    icon: '/icons/favicon.ico',
+  },
+}
 
+export default function ShevilPage() {
   return (
     <>
       <PageLayout>
         <TopCard backgroundImageUrl={shevilData.profileImageUrl} />
         <HeroInfo title={shevilData.title} subtitle={shevilData.subtitle} />
-        <LinkItemsLayout>
-          {shevilData.links.map((link) =>
-            link.isHighlighted ? (
-              <HighlightedLink
-                key={link.title}
-                type="youtube"
-                youtubeId={parseYtId(link.url) ?? ''}
-                title={link.title}
-              />
-            ) : (
-              <LinkItem
-                key={link.title}
-                href={link.url}
-                title={link.title}
-                onClickShare={() => {
-                  toggleShareModalVisible()
-                  setSharedLink(link)
-                }}
-              />
-            ),
-          )}
-        </LinkItemsLayout>
+        <LinkItems />
       </PageLayout>
-      <ShareModal
-        visible={shareModalVisible}
-        sharedLink={sharedLink}
-        onClose={() => {
-          toggleShareModalVisible()
-          setSharedLink(null)
-        }}
-      />
+      <ShareModal />
     </>
   )
 }

yarn.lock

@@ -3856,6 +3856,7 @@ __metadata:
     ts-pattern: "npm:*"
     typescript: "npm:*"
     zod: "npm:*"
+    zustand: "npm:*"
   languageName: unknown
   linkType: soft