chore: demo app metadata (#83)

ArdentHQ · Feb 27, 2024 · 6697311 · 6697311
1 parent 6990532
commit 6697311
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 1 deletion.
diff --git a/i18n/locales/en/common.json b/i18n/locales/en/common.json
@@ -1,5 +1,6 @@
 {
   "APP_NAME": "ARKCONNECT DEMO",
+  "PAGE_TITLE": "Demo App | ARK Connect",
   "CONNECT_WALLET": "Connect Wallet",
   "INSTALL_WALLET": "Install ARK Connect",
   "CONNECT": "Connect",

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ark-connect-demo",
-  "version": "0.0.1",
+  "version": "1.0.1",
   "private": true,
   "engines": {
     "node": ">=18.11.0"

diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -1,4 +1,5 @@
 import { Html, Head, Main, NextScript } from "next/document";
+
 export default function Document() {
   return (
     <Html>
@@ -25,6 +26,30 @@ export default function Document() {
         <meta name="msapplication-TileColor" content="#058751" />
         <meta name="theme-color" content="#ffffff" />
         <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
+
+        <meta
+          name="description"
+          content="Discover the power of ARK Connect with our demo app. Seamlessly interact with your ARK addresses: effortlessly view balances, track latest transactions, initiate transfers, sign messages, and even vote for delegates."
+        />
+        <meta property="og:title" content="Demo App | ARK Connect" />
+        <meta
+          property="og:description"
+          content="Discover the power of ARK Connect with our demo app. Seamlessly interact with your ARK addresses: effortlessly view balances, track latest transactions, initiate transfers, sign messages, and even vote for delegates."
+        />
+        <meta
+          property="og:image"
+          content="https://demo.arkconnect.io/images/meta/home.png"
+        />
+        <meta name="twitter:card" content="summary_large_image" />
+        <meta name="twitter:title" content="Demo App | ARK Connect" />
+        <meta
+          name="twitter:description"
+          content="Discover the power of ARK Connect with our demo app. Seamlessly interact with your ARK addresses: effortlessly view balances, track latest transactions, initiate transfers, sign messages, and even vote for delegates."
+        />
+        <meta
+          name="twitter:image"
+          content="https://demo.arkconnect.io/images/meta/home.png"
+        />
       </Head>
       <body className="bg-theme-gray-50">
         <Main />

diff --git a/public/images/meta/home.png b/public/images/meta/home.png
diff --git a/src/app/components/Layout/Layout.tsx b/src/app/components/Layout/Layout.tsx
@@ -1,10 +1,18 @@
+import Head from "next/head";
+
 import { ReactElement } from "react";
 import { Toaster } from "react-hot-toast";
+import { useTranslation } from "react-i18next";
+
 import { Navbar } from "@/app/components/Navbar";
 
 export const Layout = ({ children }: { children: ReactElement }) => {
+  const { t } = useTranslation();
   return (
     <div id="layout" className="flex flex-col min-h-screen">
+      <Head>
+        <title>{t("PAGE_TITLE")}</title>
+      </Head>
       <Navbar />
       {children}
       <Toaster position="bottom-right" gutter={15} />