token seo

lib/next/token/getSeo.ts

@@ -8,7 +8,7 @@ export default function getSeo(params: PageParams) {
   return {
     title: params ? `${ params.hash } - ${ networkTitle }` : '',
     description: params ?
-      `${ params.hash }, balances, and analytics on the on the ${ networkTitle }` :
+      `${ params.hash }, balances and analytics on the on the ${ networkTitle }` :
       '',
   };
 }

ui/pages/Token.tsx

 import { Skeleton, Box } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
-import React from 'react';
+import React, { useEffect } from 'react';
 
 import type { RoutedTab } from 'ui/shared/RoutedTabs/types';
 
@@ -30,6 +30,20 @@ const TokenPageContent = () => {
     queryOptions: { enabled: Boolean(router.query.hash) },
   });
 
+  useEffect(() => {
+    if (tokenQuery.data) {
+      const tokenName = `${ tokenQuery.data.name } (${ tokenQuery.data.symbol })`;
+      const title = document.getElementsByTagName('title')[0];
+      if (title) {
+        title.textContent = title.textContent?.replace(tokenQuery.data.address, tokenName) || title.textContent;
+      }
+      const description = document.getElementsByName('description')[0] as HTMLMetaElement;
+      if (description) {
+        description.content = description.content.replace(tokenQuery.data.address, tokenName) || description.content;
+      }
+    }
+  }, [ tokenQuery.data ]);
+
   const transfersQuery = useQueryWithPages({
     resourceName: 'token_transfers',
     pathParams: { hash: router.query.hash?.toString() },