refactor(dashboard): add entry trigger icon

src/containers/digest/CommunityDigest/ClassicLayout/AccountUnit.tsx

@@ -1,12 +1,14 @@
 import { FC, memo } from 'react'
 
+import { EVENT, THREAD } from '@/constant'
+import { send } from '@/utils/helper'
+
 import {
   Wrapper,
   Avatar,
   NotifyIcon,
+  DashboardIcon,
   SubscribeButton,
-  SubText,
-  // SearchIcon,
 } from '../styles/classic_layout/account_unit'
 import { mockUsers } from '@/utils/mock'
 // import { onShowEditorList, onShowSubscriberList, setViewport } from '../logic'
@@ -19,6 +21,12 @@ const AccountUnit: FC = () => {
         订阅
       </SubscribeButton>
 
+      <DashboardIcon
+        onClick={() =>
+          send(EVENT.COMMUNITY_THREAD_CHANGE, { data: THREAD.DASHBOARD })
+        }
+      />
+
       <NotifyIcon />
       <Avatar src={`${mockUsers(1)[0].avatar}`} />
     </Wrapper>

src/containers/digest/CommunityDigest/SimpleLayout/AccountUnit.tsx

@@ -1,8 +1,12 @@
 import { FC, memo } from 'react'
 
+import { EVENT, THREAD } from '@/constant'
+import { send } from '@/utils/helper'
+
 import {
   Wrapper,
   Avatar,
+  DashboardIcon,
   NotifyIcon,
   SubscribeButton,
 } from '../styles/simple_layout/account_unit'
@@ -17,6 +21,11 @@ const AccountUnit: FC = () => {
         订阅
       </SubscribeButton>
 
+      <DashboardIcon
+        onClick={() =>
+          send(EVENT.COMMUNITY_THREAD_CHANGE, { data: THREAD.DASHBOARD })
+        }
+      />
       <NotifyIcon />
       <Avatar src={`${mockUsers(1)[0].avatar}`} />
     </Wrapper>

src/containers/digest/CommunityDigest/styles/classic_layout/account_unit.ts

@@ -5,6 +5,7 @@ import css, { theme } from '@/utils/css'
 import Button from '@/widgets/Buttons/Button'
 import Img from '@/Img'
 import NotifySVG from '@/icons/Notify'
+import DashboardSVG from '@/icons/Dashboard'
 import SearchSVG from '@/icons/HeaderSearch'
 
 export const Wrapper = styled.div`
@@ -32,6 +33,18 @@ export const NotifyIcon = styled(NotifySVG)`
   margin-right: 18px;
   opacity: 0.8;
 `
+export const DashboardIcon = styled(DashboardSVG)`
+  fill: ${theme('thread.articleDigest')};
+  ${css.size(20)};
+  margin-right: 16px;
+  opacity: 0.8;
+
+  &:hover {
+    opacity: 1;
+    cursor: pointer;
+  }
+  transition: all 0.2s;
+`
 export const SearchIcon = styled(SearchSVG)`
   fill: ${theme('thread.articleDigest')};
   ${css.size(20)};

src/containers/digest/CommunityDigest/styles/simple_layout/account_unit.ts

@@ -5,6 +5,7 @@ import css, { theme } from '@/utils/css'
 import Button from '@/widgets/Buttons/Button'
 import Img from '@/Img'
 import NotifySVG from '@/icons/Notify'
+import DashboardSVG from '@/icons/Dashboard'
 import SearchSVG from '@/icons/HeaderSearch'
 
 export const Wrapper = styled.div`
@@ -29,6 +30,18 @@ export const NotifyIcon = styled(NotifySVG)`
   margin-right: 18px;
   opacity: 0.8;
 `
+export const DashboardIcon = styled(DashboardSVG)`
+  fill: ${theme('thread.articleDigest')};
+  ${css.size(20)};
+  margin-right: 16px;
+  opacity: 0.8;
+
+  &:hover {
+    opacity: 1;
+    cursor: pointer;
+  }
+  transition: all 0.2s;
+`
 export const SearchIcon = styled(SearchSVG)`
   fill: ${theme('thread.articleDigest')};
   ${css.size(20)};

src/widgets/Icons/Dashboard.tsx

@@ -0,0 +1,18 @@
+import { memo, SVGProps } from 'react'
+
+const SVG = (props: SVGProps<SVGSVGElement>) => {
+  return (
+    <svg
+      className="icon"
+      viewBox="0 0 1024 1024"
+      xmlns="http://www.w3.org/2000/svg"
+      width={200}
+      height={200}
+      {...props}
+    >
+      <path d="M518.113 784.244h-417.45a42.571 42.571 0 1 1 0-85.142h417.45c18.998-73.285 85.135-127.764 164.188-127.764 79.109 0 145.144 54.478 164.19 127.764h76.963a42.571 42.571 0 0 1 0 85.142h-76.956c-19.05 73.336-85.08 127.764-164.193 127.764-79.057 0-145.194-54.428-164.192-127.764zm79.057-42.57a85.11 85.11 0 1 0 85.135-85.195 85.24 85.24 0 0 0-85.135 85.194zM234.414 329.966h-133.75a42.571 42.571 0 1 1 0-85.142h133.75c18.998-73.285 85.084-127.763 164.142-127.763 79.108 0 145.143 54.478 164.244 127.763h360.662a42.571 42.571 0 0 1 0 85.142H562.8c-19.1 73.337-85.136 127.764-164.244 127.764-79.058 0-145.144-54.428-164.142-127.764zm79.007-42.57a85.135 85.135 0 1 0 85.135-85.195 85.24 85.24 0 0 0-85.135 85.194z" />
+    </svg>
+  )
+}
+
+export default memo(SVG)

utils/helper.ts

@@ -628,6 +628,7 @@ export const plural = (value: string, opt = null): string => {
       THREAD.HELP,
       THREAD.KANBAN,
       THREAD.ABOUT,
+      THREAD.DASHBOARD,
     ])
   ) {
     return doCovert(value, opt)