diff --git a/server/plugins/com.msgbyte.topic/types/tailchat.d.ts b/server/plugins/com.msgbyte.topic/types/tailchat.d.ts deleted file mode 100644 index eb43d216..00000000 --- a/server/plugins/com.msgbyte.topic/types/tailchat.d.ts +++ /dev/null @@ -1,300 +0,0 @@ -/* eslint-disable @typescript-eslint/no-explicit-any */ - -/** - * 该文件由 Tailchat 自动生成 - * 用于插件的类型声明 - * 生成命令: pnpm run plugins:declaration:generate - */ - -/** - * Tailchat 通用 - */ - -declare module '@capital/common' { - export const useGroupPanelParams: any; - - /** - * 打开模态框 - */ - export const openModal: ( - content: React.ReactNode, - - props?: { - /** - * 是否显示右上角的关闭按钮 - * @default false - */ - closable?: boolean; - - /** - * 遮罩层是否可关闭 - */ - maskClosable?: boolean; - - /** - * 关闭modal的回调 - */ - onCloseModal?: () => void; - } - ) => number; - - export const closeModal: any; - - export const ModalWrapper: any; - - export const useModalContext: any; - - export const openConfirmModal: any; - - export const openReconfirmModal: any; - - export const Loadable: any; - - export const getGlobalState: any; - - export const getJWTUserInfo: () => Promise<{ - _id?: string; - nickname?: string; - email?: string; - avatar?: string; - }>; - - export const dataUrlToFile: any; - - export const urlSearchStringify: any; - - export const urlSearchParse: any; - - export const appendUrlSearch: any; - - export const useGroupIdContext: any; - - export const getServiceUrl: () => string; - - export const getCachedUserInfo: ( - userId: string, - refetch?: boolean - ) => Promise<{ - _id: string; - email: string; - nickname: string; - discriminator: string; - avatar: string | null; - temporary: boolean; - }>; - - export const getCachedConverseInfo: any; - - export const localTrans: any; - - export const getLanguage: any; - - export const sharedEvent: any; - - export const useAsync: any; - - export const useAsyncFn: any; - - export const useAsyncRefresh: any; - - export const useAsyncRequest: any; - - export const uploadFile: any; - - export const showToasts: any; - - export const showErrorToasts: any; - - export const fetchAvailableServices: any; - - export const isValidStr: any; - - export const useGroupPanelInfo: any; - - export const sendMessage: any; - - export const useLocation: any; - - export const useHistory: any; - - export const createFastFormSchema: any; - - export const fieldSchema: any; - - export const useCurrentUserInfo: any; - - export const createPluginRequest: (pluginName: string) => { - get: (actionName: string, config?: any) => Promise; - post: (actionName: string, data?: any, config?: any) => Promise; - }; - - export const postRequest: any; - - export const pluginCustomPanel: any; - - export const regCustomPanel: any; - - export const pluginGroupPanel: any; - - export const regGroupPanel: any; - - export const messageInterpreter: any; - - export const regMessageInterpreter: any; - - export const getMessageRender: any; - - export const regMessageRender: any; - - export const getMessageTextDecorators: any; - - export const regMessageTextDecorators: any; - - export const ChatInputActionContextProps: any; - - export const pluginChatInputActions: any; - - export const regChatInputAction: any; - - export const regSocketEventListener: (item: { - eventName: string; - eventFn: (...args: any[]) => void; - }) => void; - - export const pluginColorScheme: any; - - export const regPluginColorScheme: any; - - export const pluginInspectServices: any; - - export const regInspectService: any; - - export const pluginMessageExtraParsers: any; - - export const regMessageExtraParser: any; - - export const pluginRootRoute: any; - - export const regPluginRootRoute: any; - - export const pluginPanelActions: any; - - export const regPluginPanelAction: any; - - export const pluginPermission: any; - - export const regPluginPermission: (permission: { - /** - * 权限唯一key, 用于写入数据库 - * 如果为插件则权限点应当符合命名规范, 如: plugin.com.msgbyte.github.manage - */ - key: string; - /** - * 权限点显示名称 - */ - title: string; - /** - * 权限描述 - */ - desc: string; - /** - * 是否默认开启 - */ - default: boolean; - /** - * 是否依赖其他权限点 - */ - required?: string[]; - }) => void; -} - -/** - * Tailchat 组件 - */ -declare module '@capital/component' { - export const Button: any; - - export const Checkbox: any; - - export const Input: any; - - export const Divider: any; - - export const Space: any; - - export const Menu: any; - - export const Table: any; - - export const Switch: any; - - export const Tooltip: any; - - /** - * @link https://ant.design/components/notification-cn/ - */ - export const notification: any; - - export const Avatar: any; - - export const SensitiveText: React.FC<{ className?: string; text: string }>; - - export const TextArea: any; - - export const Image: any; - - export const Icon: any; - - export const IconBtn: any; - - export const PillTabs: any; - - export const PillTabPane: any; - - export const LoadingSpinner: any; - - export const WebFastForm: any; - - export const WebMetaForm: any; - - export const createMetaFormSchema: any; - - export const metaFormFieldSchema: any; - - export const FullModalField: any; - - export const DefaultFullModalInputEditorRender: any; - - export const DefaultFullModalTextAreaEditorRender: any; - - export const openModal: any; - - export const closeModal: any; - - export const ModalWrapper: any; - - export const useModalContext: any; - - export const openConfirmModal: any; - - export const openReconfirmModal: any; - - export const Loading: any; - - export const SidebarView: any; - - export const GroupPanelSelector: any; - - export const Emoji: any; - - export const PortalAdd: any; - - export const PortalRemove: any; - - export const ErrorBoundary: any; - - export const UserName: React.FC<{ - userId: string; - className?: string; - }>; -} diff --git a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/components/TopicCard.less b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/components/TopicCard.less deleted file mode 100644 index 57585bdb..00000000 --- a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/components/TopicCard.less +++ /dev/null @@ -1,44 +0,0 @@ -.plugin-topic-card { - background-color: rgba(0, 0, 0, 0.25); - padding: 10px; - border-radius: 3px; - margin: 10px; - width: auto; - display: flex; - - .left { - margin-right: 10px; - } - - .right { - flex: 1; - user-select: text; - - .header { - display: flex; - line-height: 32px; - - .name { - margin-right: 4px; - } - - .date { - opacity: 0.6; - } - } - - .body { - .content { - margin-top: 6px; - margin-bottom: 6px; - } - - .reply { - padding: 10px; - margin-bottom: 6px; - border-radius: 3px; - background-color: rgba(0, 0, 0, 0.25); - } - } - } -} diff --git a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/components/TopicCard.tsx b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/components/TopicCard.tsx index 6c65060c..189e63da 100644 --- a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/components/TopicCard.tsx +++ b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/components/TopicCard.tsx @@ -1,10 +1,55 @@ import React from 'react'; import { Avatar, IconBtn } from '@capital/component'; -import './TopicCard.less'; +import styled from 'styled-components'; + +const Root = styled.div` + background-color: rgba(0, 0, 0, 0.25); + padding: 10px; + border-radius: 3px; + margin: 10px; + width: auto; + display: flex; + + .left { + margin-right: 10px; + } + + .right { + flex: 1; + user-select: text; + + .header { + display: flex; + line-height: 32px; + + .name { + margin-right: 4px; + } + + .date { + opacity: 0.6; + } + } + + .body { + .content { + margin-top: 6px; + margin-bottom: 6px; + } + + .reply { + padding: 10px; + margin-bottom: 6px; + border-radius: 3px; + background-color: rgba(0, 0, 0, 0.25); + } + } + } +`; export const TopicCard: React.FC = React.memo(() => { return ( -
+
@@ -24,10 +69,10 @@ export const TopicCard: React.FC = React.memo(() => {
- +
- + ); }); TopicCard.displayName = 'TopicCard'; diff --git a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/group/GroupTopicPanelRender.less b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/group/GroupTopicPanelRender.less deleted file mode 100644 index 92eac355..00000000 --- a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/group/GroupTopicPanelRender.less +++ /dev/null @@ -1,16 +0,0 @@ -.plugin-topic-group-panel { - display: flex; - flex-direction: column; - width: 100%; - position: relative; - - .create-btn { - position: absolute; - right: 20px; - bottom: 20px; - - > .anticon { - font-size: 24px; - } - } -} diff --git a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/group/GroupTopicPanelRender.tsx b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/group/GroupTopicPanelRender.tsx index e472ddd2..dff750ff 100644 --- a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/group/GroupTopicPanelRender.tsx +++ b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/src/group/GroupTopicPanelRender.tsx @@ -7,16 +7,34 @@ import { IconBtn, openModal, closeModal, + LoadingSpinner, } from '@capital/component'; import { request } from '../request'; import { Translate } from '../translate'; import { TopicCreate } from '../components/modals/TopicCreate'; -import './GroupTopicPanelRender.less'; +import styled from 'styled-components'; + +const Root = styled.div({ + display: 'flex', + flexDirection: 'column', + width: '100%', + position: 'relative', + + '.create-btn': { + position: 'absolute', + right: 20, + bottom: 20, + + '> .anticon': { + fontSize: 24, + }, + }, +}); const GroupTopicPanelRender: React.FC = React.memo(() => { const panelInfo = useGroupPanelContext(); - const [{ value: list = [] }, fetch] = useAsyncRequest(async () => { + const [{ value: list = [], loading }, fetch] = useAsyncRequest(async () => { if (!panelInfo.groupId || !panelInfo.panelId) { return []; } @@ -53,8 +71,12 @@ const GroupTopicPanelRender: React.FC = React.memo(() => { ); }, [panelInfo, fetch]); + if (loading) { + return ; + } + return ( -
+ {Array.isArray(list) && list.length > 0 ? ( list.map((_, i) => ) ) : ( @@ -72,7 +94,7 @@ const GroupTopicPanelRender: React.FC = React.memo(() => { title={Translate.createBtn} onClick={handleCreateTopic} /> -
+ ); }); GroupTopicPanelRender.displayName = 'GroupTopicPanelRender'; diff --git a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/types/tailchat.d.ts b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/types/tailchat.d.ts index d793d59e..db546de0 100644 --- a/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/types/tailchat.d.ts +++ b/server/plugins/com.msgbyte.topic/web/plugins/com.msgbyte.topic/types/tailchat.d.ts @@ -310,6 +310,7 @@ declare module '@capital/component' { size?: 'small' | 'middle' | 'large'; shape?: 'circle' | 'square'; title?: string; + onClick?: React.MouseEventHandler; }>; export const PillTabs: any;