From 04122a2d566888928ccf637af2dee7a8c7c3e92c Mon Sep 17 00:00:00 2001
From: fantasticit <fantasticit@163.com>
Date: Mon, 28 Mar 2022 22:51:43 +0800
Subject: [PATCH] feat: improve share link

---
 .../document/reader/public/index.tsx          | 26 ++++++++++--
 .../src/components/document/share/index.tsx   | 19 +++++++++
 .../src/components/wiki/tocs/NavItem.tsx      | 15 ++++++-
 .../client/src/components/wiki/tocs/index.tsx | 42 ++++++++++++++++++-
 packages/client/src/data/document.ts          |  4 +-
 .../server/src/services/document.service.ts   |  3 +-
 6 files changed, 99 insertions(+), 10 deletions(-)

diff --git a/packages/client/src/components/document/reader/public/index.tsx b/packages/client/src/components/document/reader/public/index.tsx
index 52995bc0..eec226b3 100644
--- a/packages/client/src/components/document/reader/public/index.tsx
+++ b/packages/client/src/components/document/reader/public/index.tsx
@@ -1,7 +1,20 @@
 import React, { useMemo, useEffect } from 'react';
 import cls from 'classnames';
-import { Layout, Nav, Space, Button, Typography, Skeleton, Input, Popover, Modal, BackTop } from '@douyinfe/semi-ui';
+import {
+  Layout,
+  Nav,
+  Space,
+  Button,
+  Typography,
+  Skeleton,
+  Input,
+  Popover,
+  Modal,
+  Breadcrumb,
+  BackTop,
+} from '@douyinfe/semi-ui';
 import { IconArticle } from '@douyinfe/semi-icons';
+import Link from 'next/link';
 import { Seo } from 'components/seo';
 import { LogoImage, LogoText } from 'components/logo';
 import { DataRender } from 'components/data-render';
@@ -91,9 +104,14 @@ export const DocumentPublicReader: React.FC<IProps> = ({ documentId, hideLogo =
               <Skeleton active placeholder={<Skeleton.Title style={{ width: 80, marginBottom: 8 }} />} loading={true} />
             }
             normalContent={() => (
-              <Text strong ellipsis={{ showTooltip: true }} style={{ width: ~~(windowWidth / 4) }}>
-                {data.title}
-              </Text>
+              <Breadcrumb>
+                <Breadcrumb.Item>
+                  <Link href="/share/wiki/[wikiId]" as={`/share/wiki/${data.wikiId}`}>
+                    <a>{data?.wiki?.name}</a>
+                  </Link>
+                </Breadcrumb.Item>
+                <Breadcrumb.Item>{data.title}</Breadcrumb.Item>
+              </Breadcrumb>
             )}
           />
         </Nav>
diff --git a/packages/client/src/components/document/share/index.tsx b/packages/client/src/components/document/share/index.tsx
index 6c6f6742..24fb9a83 100644
--- a/packages/client/src/components/document/share/index.tsx
+++ b/packages/client/src/components/document/share/index.tsx
@@ -49,6 +49,25 @@ export const DocumentShare: React.FC<IProps> = ({ documentId, render }) => {
         onCancel={() => toggleVisible(false)}
         maskClosable={false}
         style={{ maxWidth: '96vw' }}
+        footer={
+          <>
+            <Button onClick={() => toggleVisible(false)}>取消</Button>
+            <Button theme="solid" type={isPublic ? 'danger' : 'primary'} onClick={handleOk}>
+              {isPublic ? '关闭分享' : '开启分享'}
+            </Button>
+            {isPublic && (
+              <Button
+                theme="solid"
+                type="primary"
+                onClick={() => {
+                  window.open(shareUrl, '_blank');
+                }}
+              >
+                查看文档
+              </Button>
+            )}
+          </>
+        }
       >
         <DataRender
           loading={loading}
diff --git a/packages/client/src/components/wiki/tocs/NavItem.tsx b/packages/client/src/components/wiki/tocs/NavItem.tsx
index dd709653..c4a89e23 100644
--- a/packages/client/src/components/wiki/tocs/NavItem.tsx
+++ b/packages/client/src/components/wiki/tocs/NavItem.tsx
@@ -14,9 +14,18 @@ interface IProps {
   };
   isActive?: boolean;
   hoverable?: boolean;
+  openNewTab?: boolean;
 }
 
-export const NavItem: React.FC<IProps> = ({ icon, text, rightNode, href, isActive = false, hoverable = true }) => {
+export const NavItem: React.FC<IProps> = ({
+  icon,
+  text,
+  rightNode,
+  href,
+  isActive = false,
+  hoverable = true,
+  openNewTab = false,
+}) => {
   const right = rightNode ? <span className={styles.rightWrap}>{rightNode}</span> : null;
   const content = (
     <>
@@ -32,7 +41,9 @@ export const NavItem: React.FC<IProps> = ({ icon, text, rightNode, href, isActiv
     >
       {href ? (
         <Link href={href as UrlObject}>
-          <a className={styles.navItem}>{content}</a>
+          <a className={styles.navItem} target={openNewTab ? '_blank' : '_self'}>
+            {content}
+          </a>
         </Link>
       ) : (
         <div className={styles.navItem}>{content}</div>
diff --git a/packages/client/src/components/wiki/tocs/index.tsx b/packages/client/src/components/wiki/tocs/index.tsx
index cb3420c9..1b9b618b 100644
--- a/packages/client/src/components/wiki/tocs/index.tsx
+++ b/packages/client/src/components/wiki/tocs/index.tsx
@@ -1,6 +1,6 @@
 import { useRouter } from 'next/router';
 import { useEffect, useState } from 'react';
-import { Avatar, Button, Typography, Skeleton } from '@douyinfe/semi-ui';
+import { Avatar, Button, Typography, Skeleton, Tooltip } from '@douyinfe/semi-ui';
 import { IconPlus } from '@douyinfe/semi-icons';
 import { useWikiDetail, useWikiTocs } from 'data/wiki';
 import { useToggle } from 'hooks/use-toggle';
@@ -13,6 +13,7 @@ import { EventEmitter } from 'helpers/event-emitter';
 import { NavItem } from './NavItem';
 import { Tree } from './tree';
 import styles from './index.module.scss';
+import { isPublicWiki } from '@think/domains';
 
 const em = new EventEmitter();
 const EVENT_KEY = 'REFRESH_TOCS';
@@ -127,6 +128,45 @@ export const WikiTocs: React.FC<IProps> = ({
         isActive={pathname === '/wiki/[wikiId]/setting'}
       />
 
+      <DataRender
+        loading={wikiLoading}
+        loadingContent={
+          <NavItem
+            icon={
+              <Skeleton.Avatar
+                size="small"
+                style={{
+                  marginRight: 8,
+                  width: 24,
+                  height: 24,
+                  borderRadius: 4,
+                }}
+              ></Skeleton.Avatar>
+            }
+            text={<Skeleton.Title style={{ width: 120 }} />}
+          />
+        }
+        error={wikiError}
+        normalContent={() =>
+          isPublicWiki(wiki.status) ? (
+            <NavItem
+              icon={<IconOverview />}
+              text={
+                <Tooltip content="该知识库已公开，点我查看" position="right">
+                  公开地址
+                </Tooltip>
+              }
+              href={{
+                pathname: `/share/wiki/[wikiId]`,
+                query: { wikiId },
+              }}
+              isActive={pathname === '/share/wiki/[wikiId]'}
+              openNewTab
+            />
+          ) : null
+        }
+      />
+
       <DataRender
         loading={wikiLoading}
         loadingContent={
diff --git a/packages/client/src/data/document.ts b/packages/client/src/data/document.ts
index ce49e028..3a85290f 100644
--- a/packages/client/src/data/document.ts
+++ b/packages/client/src/data/document.ts
@@ -1,4 +1,4 @@
-import type { IUser, IDocument } from '@think/domains';
+import type { IUser, IDocument, IWiki } from '@think/domains';
 import useSWR from 'swr';
 import { useState, useCallback, useEffect } from 'react';
 import { useAsyncLoading } from 'hooks/use-async-loading';
@@ -128,7 +128,7 @@ export const useStaredDocuments = () => {
  */
 export const usePublicDocument = (documentId: string) => {
   const [fetch] = useAsyncLoading(getPublicDocumentDetail);
-  const [document, setDocument] = useState<IDocument | null>(null);
+  const [document, setDocument] = useState<(IDocument & { createUse: IUser; wiki: IWiki }) | null>(null);
   const [error, setError] = useState<(Error & { statusCode?: number }) | null>(null);
   const loading = !document && !error;
 
diff --git a/packages/server/src/services/document.service.ts b/packages/server/src/services/document.service.ts
index 04aa7d72..5469192b 100644
--- a/packages/server/src/services/document.service.ts
+++ b/packages/server/src/services/document.service.ts
@@ -552,8 +552,9 @@ export class DocumentService {
     await this.viewService.create({ userId: 'public', documentId, userAgent });
     const views = await this.viewService.getDocumentTotalViews(documentId);
     const createUser = await this.userService.findById(document.createUserId);
+    const wiki = await this.wikiService.getPublicWikiDetail(document.wikiId);
 
-    return { ...document, views, createUser };
+    return { ...document, views, wiki, createUser };
   }
 
   /**