From 4f62f74563bce836d5d28b1bbd3d1489859faa3e Mon Sep 17 00:00:00 2001
From: Carrotzpc <zhang.pc3@gmail.com>
Date: Mon, 19 Aug 2024 11:26:47 +0800
Subject: [PATCH] fix: div is render to outsite of html tag when SSR

---
 src/plugin/index.ts        |  2 ++
 src/slots/Footer/index.tsx | 18 ++++++++++--------
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/plugin/index.ts b/src/plugin/index.ts
index fbdd5c5..65705d9 100644
--- a/src/plugin/index.ts
+++ b/src/plugin/index.ts
@@ -93,6 +93,8 @@ const SSRPlugin = (api: IApi) => {
           const cssFile = writeCSSFile(result!.key, result!.ids.join(''), result!.css);
 
           file.content = addLinkStyle(file.content, cssFile);
+          // @Todo: move '</body></html>' to the end for workaround
+          file.content = file.content.replace('</body></html>', '') + '</body></html>';
         }
 
         return file;
diff --git a/src/slots/Footer/index.tsx b/src/slots/Footer/index.tsx
index b3702a4..6446dba 100644
--- a/src/slots/Footer/index.tsx
+++ b/src/slots/Footer/index.tsx
@@ -1,7 +1,7 @@
 import { Footer as Foot, FooterProps } from '@lobehub/ui';
 import { Divider } from 'antd';
 import isEqual from 'fast-deep-equal';
-import { memo } from 'react';
+import { memo, useMemo } from 'react';
 import { Center, Flexbox } from 'react-layout-kit';
 import { shallow } from 'zustand/shallow';
 
@@ -18,15 +18,17 @@ const Footer = memo(() => {
   const { mobile } = useResponsive();
   const { styles, theme } = useStyles();
 
-  if (!footer) return;
-
-  const columns = footerConfig?.columns
-    ? footerConfig?.columns
-    : getColumns({ github: githubUrl || (pkg as any).homepage });
+  const columns = useMemo(() => {
+    const cs = footerConfig?.columns
+      ? footerConfig?.columns
+      : getColumns({ github: githubUrl || (pkg as any).homepage });
+    if (footerConfig?.resources) cs[0] = footerConfig?.resources;
+    if (footerConfig?.moreProducts) cs[3] = footerConfig?.moreProducts;
 
-  if (footerConfig?.resources) columns[0] = footerConfig?.resources;
-  if (footerConfig?.moreProducts) columns[3] = footerConfig?.moreProducts;
+    return cs.filter(c => c.items && c.items.length > 0);
+  }, [footerConfig?.columns, footerConfig?.moreProducts, footerConfig?.resources, githubUrl, pkg]);
 
+  if (!footer) return;
   const bottomFooter = footerConfig?.bottom || footer;
 
   return (