feat: add pending page

bibbi-team · Jan 14, 2024 · 009a7b0 · 009a7b0
1 parent 56cd8c5
commit 009a7b0
Show file tree

Hide file tree

Showing 5 changed files with 120 additions and 1 deletion.
diff --git a/app/links/[id]/page.tsx b/app/links/[id]/page.tsx
@@ -0,0 +1,30 @@
+"use client"
+import {useEffect, useState} from "react";
+import Image from "next/image";
+import {usePathname, useRouter} from "next/navigation";
+
+export default function Page() {
+  const id = usePathname().split("/").pop();
+  const [platform, setPlatform] = useState<"unknown" | "ios" | "android">("unknown");
+  const router = useRouter();
+  useEffect(() => {
+    const detectPlatform = () => {
+      const unknownWindow = ((window as unknown) as any);
+      const userAgent = navigator.userAgent || navigator.vendor || unknownWindow.opera;
+      if (/iPad|iPhone|iPod/.test(userAgent) && !unknownWindow.MSStream) return "ios";
+      if (/android/i.test(userAgent)) return "android";
+      return "unknown";
+    }
+
+    const platform = detectPlatform();
+    setPlatform(platform);
+  }, []);
+  return <div className={"flex flex-col justify-center items-center h-screen w-screen gap-8"}>
+    <Image src="/oing_icon.png" width={200} height={200} alt={"logo"} />
+    <div className={"text-center text-lg text-gray-300"}>
+      {platform == "unknown" ? <span>모바일에서만 접근할 수 있어요</span> :
+          <div className={"bg-slate-500 text-gray-300 font-semibold py-3 px-6 rounded-md text-center"} onClick={() => router.push('/o/' + id)}>앱으로 이동</div>}
+    </div>
+
+  </div>;
+}
diff --git a/app/links/globals.css b/app/links/globals.css
@@ -0,0 +1,29 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@font-face {
+  font-family: 'Pretendard-Bold';
+  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/[email protected]/Pretendard-Bold.woff') format('woff');
+  font-weight: 700;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Pretendard-Regular';
+  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/[email protected]/Pretendard-Regular.woff') format('woff');
+  font-weight: 400;
+  font-style: normal;
+}
+
+body {
+  color: rgb(var(--foreground-rgb));
+  background: #242427;
+  font-family: Pretendard-Regular, sans-serif;
+}
+
+.privacy-heading {
+  font-weight: bold;
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
diff --git a/app/links/layout.tsx b/app/links/layout.tsx
@@ -0,0 +1,56 @@
+import type { Metadata } from 'next'
+import { Inter } from 'next/font/google'
+import './globals.css'
+import {ArticleJsonLd, DefaultSeo} from "next-seo";
+
+const inter = Inter({ subsets: ['latin'] })
+
+export const metadata: Metadata = {
+  title: '삐삐',
+  description: '가족 일상공유 어플리케이션',
+  openGraph: {
+    title: '삐삐 - 가족 초대 링크가 도착했어요',
+    description: '입장하고 일상공유를 시작해보세요',
+    url: 'https://no5ing.kr',
+    siteName: 'BbiBbi',
+    images: [
+      {
+        url: 'https://no5ing.kr/og_image.png',
+        width: 800,
+        height: 400,
+      }
+    ],
+    locale: 'ko_KR',
+    type: 'website',
+  },
+}
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="kr">
+      <head>
+        <ArticleJsonLd
+          useAppDir={true}
+          url="https://no5ing.kr"
+          title="삐삐 - 가족 초대 링크가 도착했어요"
+          authorName={"bbibbi"}
+          datePublished={
+            "2023-01-01T00:00:00+09:00"
+          }
+          description={"입장하고 일상공유를 시작해보세요"}
+          images={
+            [
+              "https://no5ing.kr/og_image.png"
+            ]
+          }
+        />
+      </head>
+
+      <body suppressHydrationWarning={true} className={inter.className}>{children}</body>
+    </html>
+  )
+}
diff --git a/app/links/page.tsx b/app/links/page.tsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return <a>개발자</a>;
+}
diff --git a/app/o/[id]/page.tsx b/app/o/[id]/page.tsx
@@ -1,7 +1,7 @@
 "use client"
 import {useEffect, useState} from "react";
 import Image from "next/image";
-import {usePathname} from "next/navigation";
+import {usePathname, useRouter} from "next/navigation";
 
 export default function Page() {
   const id = usePathname().split("/").pop();
@@ -10,6 +10,7 @@ export default function Page() {
   const appStoreInfo = (<span>AppStore로 이동중..<br/><a href={appStoreUrl}>직접 이동하기</a></span>);
   const playStoreInfo = (<span>PlayStore로 이동중..<br/><a href={playStoreUrl}>직접 이동하기</a></span>);
   const [platform, setPlatform] = useState<"unknown" | "ios" | "android">("unknown");
+  const router = useRouter();
   useEffect(() => {
     const detectPlatform = () => {
       const unknownWindow = ((window as unknown) as any);