Главная Обзор Помощь
Вход
wiki
/
weseek__growi
зеркало из https://github.com/weseek/growi
2
0
Ответвить 0
Файлы Задачи 0 Вики
Просмотр исходного кода

render tags page

keigo-h 3 лет назад
Родитель
3740ce4003
Сommit
0a31fd2408
2 измененных файлов с 69 добавлено и 1 удалено
Единый вид Показать статистику Diff
  1. 67 0
      packages/app/src/pages/tags.page.tsx
  2. 2 1
      packages/app/src/server/routes/index.js

+ 67 - 0
packages/app/src/pages/tags.page.tsx
Просмотреть файл 

@@ -0,0 +1,67 @@
 
+import React, { FC, useState, useCallback } from 'react';
 
+
 
+import { useTranslation } from 'next-i18next';
 
+import Head from 'next/head';
 
+
 
+import TagCloudBox from '~/components/TagCloudBox';
 
+import TagList from '~/components/TagList';
 
+import { IDataTagCount } from '~/interfaces/tag';
 
+import { useSWRxTagsList } from '~/stores/tag';
 
+
 
+import { BasicLayout } from '../components/BasicLayout';
 
+
 
+const PAGING_LIMIT = 10;
 
+
 
+const TagPage: FC = () => {
 
+  const [activePage, setActivePage] = useState<number>(1);
 
+  const [offset, setOffset] = useState<number>(0);
 
+
 
+  const { data: tagDataList, error } = useSWRxTagsList(PAGING_LIMIT, offset);
 
+  const tagData: IDataTagCount[] = tagDataList?.data || [];
 
+  const totalCount: number = tagDataList?.totalCount || 0;
 
+  const isLoading = tagDataList === undefined && error == null;
 
+
 
+  const { t } = useTranslation('');
 
+
 
+  const setOffsetByPageNumber = useCallback((selectedPageNumber: number) => {
 
+    setActivePage(selectedPageNumber);
 
+    setOffset((selectedPageNumber - 1) * PAGING_LIMIT);
 
+  }, []);
 
+
 
+  // todo: adjust margin and redesign tags page
 
+  return (
 
+    <>
 
+      <Head>
 
+      </Head>
 
+      <BasicLayout title="tags">
 
+        <div className="grw-container-convertible mb-5 pb-5">
 
+          <h2 className="my-3">{`${t('Tags')}(${totalCount})`}</h2>
 
+          <div className="px-3 mb-5 text-center">
 
+            <TagCloudBox tags={tagData} minSize={20} />
 
+          </div>
 
+          { isLoading
 
+            ? (
 
+              <div className="text-muted text-center">
 
+                <i className="fa fa-2x fa-spinner fa-pulse mt-3"></i>
 
+              </div>
 
+            )
 
+            : (
 
+              <div data-testid="grw-tags-list">
 
+                <TagList
 
+                  tagData={tagData}
 
+                  totalTags={totalCount}
 
+                  activePage={activePage}
 
+                  onChangePage={setOffsetByPageNumber}
 
+                  pagingLimit={PAGING_LIMIT}
 
+                />
 
+              </div>
 
+            )
 
+          }
 
+        </div>
 
+      </BasicLayout>
 
+    </>
 
+  );
 
+
 
+};
 
+
 
+export default TagPage;

+ 2 - 1
packages/app/src/server/routes/index.js
Просмотреть файл 

@@ -203,7 +203,8 @@ module.exports = function(crowi, app) {
 
 
 
   app.use(unavailableWhenMaintenanceMode);
 
   app.use(unavailableWhenMaintenanceMode);
 
 
 
-  app.get('/tags'                     , loginRequired, tag.showPage);
 
+  // app.get('/tags'                     , loginRequired, tag.showPage);
 
+  app.get('/tags', loginRequired, next.delegateToNext);
 
 
 
   app.get('/me'                                 , loginRequiredStrictly, injectUserUISettings, me.index);
 
   app.get('/me'                                 , loginRequiredStrictly, injectUserUISettings, me.index);
 
   // external-accounts
 
   // external-accounts