{
@@ -128,7 +146,8 @@ function Root() {
-
添加收藏对话
+
客户端设置
+
setShowAddFavourtieChatDialog(true)}>添加收藏对话
创建新的群组
}
+ {
+
+ {
+ (state.currentSelectedChatId && state.currentSelectedChatId != '')
+ ?
+ :
+ 选择以开始对话......
+
+ }
+
+ }
{
/**
* Mobile: 底部导航栏提供列表切换
@@ -218,16 +257,27 @@ function Root() {
)
}
+function SnackbarErrorBoundary() {
+ const error = useRouteError()
+ return
{
+ const d = dialog({
+ headline: "错误",
+ description: error instanceof Error ? ('[' + error.name + '] ' + (error.stack || error.message)) : error + '',
+ closeOnEsc: true,
+ closeOnOverlayClick: true,
+ })
+ return () => {
+ d.open = false
+ }
+ }} deps={[]} />
+}
+
export default function Main() {
const router = createBrowserRouter([{
path: "/",
Component: Root,
- hydrateFallbackElement: {
- const wait = showCircleProgressDialog("请稍后...")
- return () => {
- wait.open = false
- }
- }} deps={[]} />,
+ hydrateFallbackElement: ,
+ ErrorBoundary: SnackbarErrorBoundary,
children: [
{
path: 'info/:type',
@@ -243,11 +293,10 @@ export default function Main() {
}
],
},
- /* {
+ {
path: 'chat',
Component: ChatFragmentDialog,
- loader: UserOrChatInfoDialogLoader,
- }, */
+ },
],
}])
diff --git a/client/ui/ProgressDialogFallback.tsx b/client/ui/ProgressDialogFallback.tsx
new file mode 100644
index 0000000..0f0336f
--- /dev/null
+++ b/client/ui/ProgressDialogFallback.tsx
@@ -0,0 +1,11 @@
+import EffectOnly from "./EffectOnly"
+import showCircleProgressDialog from "./showCircleProgressDialog"
+
+export default function ProgressDialogFallback({ text }: { text: string }) {
+ return {
+ const wait = showCircleProgressDialog(text)
+ return () => {
+ wait.open = false
+ }
+ }} deps={[]} />
+}
diff --git a/client/ui/ProgressDialogInner.tsx b/client/ui/ProgressDialogInner.tsx
deleted file mode 100644
index 2348ad2..0000000
--- a/client/ui/ProgressDialogInner.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-export default function ProgressDialogInner({ children, ...props }: React.HTMLAttributes) {
- return
-
- { children }
-
-}
diff --git a/client/ui/chat-fragment/ChatFragment.tsx b/client/ui/chat-fragment/ChatFragment.tsx
index e69de29..7ad16b3 100644
--- a/client/ui/chat-fragment/ChatFragment.tsx
+++ b/client/ui/chat-fragment/ChatFragment.tsx
@@ -0,0 +1,320 @@
+import { $, Tab, TextField } from "mdui"
+import useEventListener from "../../utils/useEventListener"
+import useEffectRef from "../../utils/useEffectRef"
+import isMobileUI from "../../utils/isMobileUI"
+import { useLocation, useNavigate } from "react-router"
+import { Chat } from "lingchair-client-protocol"
+import gotoChatInfo from "../routers/gotoChatInfo"
+import Preference from "../preference/Preference"
+import PreferenceHeader from "../preference/PreferenceHeader"
+import PreferenceLayout from "../preference/PreferenceLayout"
+import PreferenceUpdater from "../preference/PreferenceUpdater"
+import SwitchPreference from "../preference/SwitchPreference"
+import TextFieldPreference from "../preference/TextFieldPreference"
+import * as React from 'react'
+
+interface MduiTabFitSizeArgs extends React.HTMLAttributes {
+ value: string
+}
+function MduiTabFitSize({ children, ...props }: MduiTabFitSizeArgs) {
+ return
+ {children}
+
+}
+
+export default function ChatFragment({
+ chatInfo,
+ openedWithRouter,
+}: {
+ chatInfo: Chat
+ openedWithRouter: boolean
+}) {
+ const nav = useNavigate()
+
+ const [tabItemSelected, setTabItemSelected] = React.useState('None')
+ const tabRef = React.useRef()
+ useEventListener(tabRef, 'change', () => {
+ tabRef.current != null && setTabItemSelected(tabRef.current!.value as string)
+ })
+
+ const chatPanelRef = React.useRef()
+ const inputRef = React.useRef()
+
+
+
+ return
+
((ref) => {
+ $(ref.current!.shadowRoot).append(``)
+ $(tabRef.current!.shadowRoot).append(``)
+ ; (!isMobileUI()) && $(tabRef.current!.shadowRoot).append(``)
+ }, [])} style={{
+ position: 'sticky',
+ display: "flex",
+ flexDirection: "column",
+ }}>
+ {
+ openedWithRouter && nav(-1)} style={{
+ alignSelf: 'center',
+ marginLeft: '5px',
+ marginRight: '5px',
+ }}>
+ }
+ {
+ chatInfo.isMember() ? <>
+ {chatInfo.getTitle()}
+ {chatInfo.getType() == 'group' && chatInfo.isAdmin() && 加入请求}
+ {chatInfo.getType() == 'group' && 群组成员}
+
+ : {chatInfo.getTitle()}
+ }
+ {chatInfo.getType() == 'group' && 设置}
+
+
+ {
+ window.open('/chat?id=' + chatInfo.getId(), '_blank')
+
+ }} style={{
+ alignSelf: 'center',
+ marginLeft: '5px',
+ marginRight: '5px',
+ }}>
+ {
+
+ }} style={{
+ alignSelf: 'center',
+ marginLeft: '5px',
+ marginRight: '5px',
+ }}>
+ gotoChatInfo(nav, chatInfo.getId())} style={{
+ alignSelf: 'center',
+ marginLeft: '5px',
+ marginRight: '5px',
+ }}>
+
+
+
+ {/* 非群成员 */}
+
+
+
{
+ const scrollTop = (e.target as HTMLDivElement).scrollTop
+ if (scrollTop == 0) {
+ // 加载更多
+ }
+ }}>
+
+ {/* 这里显示一些提示 */}
+
+
+ {/* 消息放在这里 */}
+
+ {
+ // 输入框
+ }
+ {
+ // 文件拽入
+ }}>
+
{
+ if (inputRef.current?.value.trim() == '') {
+ // 清空缓存的文件
+ }
+ }} onKeyDown={(event: KeyboardEvent) => {
+ if (event.ctrlKey && event.key == 'Enter') {
+ // 发送消息
+ }
+ }} onPaste={(event: ClipboardEvent) => {
+ for (const item of event.clipboardData?.items || []) {
+ if (item.kind == 'file') {
+ event.preventDefault()
+ const file = item.getAsFile() as File
+ // 添加文件
+ }
+ }
+ }} style={{
+ marginRight: '10px',
+ marginTop: '3px',
+ marginBottom: '3px',
+ }}>
+
{
+ // 添加文件
+ }}>
+
{
+ // 发送消息
+ }}>
+
+
+
+
+ {
+ chatInfo.getType() == 'group' &&
+ {/* */}
+
+ }
+ {
+ chatInfo.getType() == 'group' &&
+ {/* {chatInfo.isAdmin() && } */}
+
+ }
+
+
+
+
+ {
+ /* chatInfo.getType() == 'group' &&
+
+
+ {
+ uploadChatAvatarRef.current!.click()
+ }} />
+
+
+
+
+
+
+ {
+ groupPreferenceStore.state.new_member_join_method == 'answered_and_allowed_by_admin'
+ &&
+ }
+
+ */
+ }
+ {
+ chatInfo.getType() == 'private' && (
+
+ 未制作
+
+ )
+ }
+
+
+
+
+
+
+