diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx new file mode 100644 index 0000000..858d417 --- /dev/null +++ b/src/components/Footer/Footer.tsx @@ -0,0 +1,40 @@ +import { FunctionComponent, useEffect, useRef } from 'react'; +import { useIntl } from 'react-intl'; +import { ILocale } from '../../types'; + +const LOCALE_MAPPING: { + [TKey in ILocale]: string; +} = { + 'en-US': '', + 'zh-CN': '/zh_CN', +}; + +const BASE_URL = 'https://onekey.so'; + +export const Footer: FunctionComponent = () => { + const intl = useIntl(); + + const containerRef = useRef(null); + + useEffect(() => { + fetch( + `${BASE_URL}${LOCALE_MAPPING[intl.locale as ILocale]}/internal/footer/` + ) + .then((response) => response.text()) + .then((data) => { + const element = containerRef.current; + + if (!element) { + return; + } + + const shadowRoot = + element.shadowRoot ?? element.attachShadow({ mode: 'open' }); + + shadowRoot.innerHTML = data; + }) + .catch(console.error); + }, [intl.locale]); + + return
; +}; diff --git a/src/components/Footer/index.ts b/src/components/Footer/index.ts new file mode 100644 index 0000000..dc423da --- /dev/null +++ b/src/components/Footer/index.ts @@ -0,0 +1,3 @@ +import { Footer } from './Footer'; + +export default Footer; diff --git a/src/components/Layout/index.tsx b/src/components/Layout/index.tsx index 37ecc7c..f06c32d 100644 --- a/src/components/Layout/index.tsx +++ b/src/components/Layout/index.tsx @@ -1,11 +1,12 @@ import React from 'react'; import Header from '../Header'; +import Footer from '../Footer'; export default function Layout({ children }: { children: React.ReactElement }) { return ( -
+
-
+
@@ -14,6 +15,7 @@ export default function Layout({ children }: { children: React.ReactElement }) {
+
); } diff --git a/src/views/Dashboard.tsx b/src/views/Dashboard.tsx index 8c8ea80..9e273db 100644 --- a/src/views/Dashboard.tsx +++ b/src/views/Dashboard.tsx @@ -104,7 +104,7 @@ export default function Dashboard() { if (pageStatus === 'initialize') { return ( -
+
{intl.formatMessage({ id: 'TR_INIT' })}
);