From 68c2f8ecc5e8d3f2b3ec17304b7f7a2cfc4e268a Mon Sep 17 00:00:00 2001
From: fantasticit <fantasticit@163.com>
Date: Tue, 31 May 2022 22:23:31 +0800
Subject: [PATCH] client: refresh templates when mount

---
 packages/client/src/components/template/list/index.tsx | 9 ++++++---
 packages/client/src/data/template.ts                   | 4 +++-
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/packages/client/src/components/template/list/index.tsx b/packages/client/src/components/template/list/index.tsx
index 8f810e5d..b74eedb6 100644
--- a/packages/client/src/components/template/list/index.tsx
+++ b/packages/client/src/components/template/list/index.tsx
@@ -2,7 +2,7 @@ import { List, Pagination } from '@douyinfe/semi-ui';
 import { DataRender } from 'components/data-render';
 import { Empty } from 'components/empty';
 import { IProps as ITemplateCardProps, TemplateCard, TemplateCardPlaceholder } from 'components/template/card';
-import React, { useMemo, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 
 const grid = {
   gutter: 16,
@@ -29,8 +29,7 @@ export const TemplateList: React.FC<IProps> = ({
   onClosePreview,
   pageSize = 5,
 }) => {
-  const { data, loading, error } = hook();
-
+  const { data, loading, error, refresh } = hook();
   const [page, onPageChange] = useState(1);
 
   const arr = useMemo(() => {
@@ -40,6 +39,10 @@ export const TemplateList: React.FC<IProps> = ({
     return arr.slice(start, end);
   }, [data, page, pageSize]);
 
+  useEffect(() => {
+    refresh();
+  }, [refresh]);
+
   return (
     <DataRender
       loading={loading}
diff --git a/packages/client/src/data/template.ts b/packages/client/src/data/template.ts
index fd42dbfd..9e8d0ba4 100644
--- a/packages/client/src/data/template.ts
+++ b/packages/client/src/data/template.ts
@@ -22,7 +22,7 @@ export const getPublicTemplates = (
 
 export const usePublicTemplates = () => {
   const [page, setPage] = useState(1);
-  const { data, error, isLoading } = useQuery([TemplateApiDefinition.public.client(), page], () =>
+  const { data, error, isLoading, refetch } = useQuery([TemplateApiDefinition.public.client(), page], () =>
     getPublicTemplates(page)
   );
 
@@ -31,6 +31,7 @@ export const usePublicTemplates = () => {
     loading: isLoading,
     error,
     setPage,
+    refresh: refetch,
   };
 };
 
@@ -79,6 +80,7 @@ export const useOwnTemplates = () => {
     error,
     setPage,
     addTemplate,
+    refresh: mutate,
   };
 };