From b771115011302078b2e3cd475d6421c40aaff0e6 Mon Sep 17 00:00:00 2001
From: Pavel Prichodko <14926950+prichodko@users.noreply.github.com>
Date: Mon, 11 Apr 2022 21:00:10 +0200
Subject: [PATCH] feat(react): unify chat menu
---
.../src/components/chat-menu/index.tsx | 69 +++++++++++++++++++
.../components/channels/channel-item.tsx | 20 +-----
.../components/messages/chat-item.tsx | 23 ++-----
3 files changed, 78 insertions(+), 34 deletions(-)
create mode 100644 packages/status-react/src/components/chat-menu/index.tsx
diff --git a/packages/status-react/src/components/chat-menu/index.tsx b/packages/status-react/src/components/chat-menu/index.tsx
new file mode 100644
index 00000000..f3478dee
--- /dev/null
+++ b/packages/status-react/src/components/chat-menu/index.tsx
@@ -0,0 +1,69 @@
+import React from 'react'
+
+import { BellIcon } from '~/src/icons/bell-icon'
+import { ContextMenu, DropdownMenu } from '~/src/system'
+
+interface Props {
+ type: 'dropdown' | 'context'
+ chatType: 'channel' | 'chat' | 'group-chat'
+}
+
+export const ChatMenu = (props: Props) => {
+ const { type, chatType } = props
+
+ const Menu = type === 'dropdown' ? DropdownMenu : ContextMenu
+
+ const renderMenuItems = () => {
+ const commonMenuItems = (
+ <>
+ }>
+ For 15 min
+ For 1 hour
+ For 8 hours
+ For 24 hours
+ Until I turn it back on
+
+ }>Mark as Read
+ }>
+ Last 24 hours
+ Last 2 days
+ Last 3 days
+ Last 7 days
+
+
+ )
+
+ if (chatType === 'channel') {
+ return commonMenuItems
+ }
+
+ if (chatType === 'group-chat') {
+ return (
+ <>
+ }>Add / remove from group
+ }>Edit name and image
+
+ {commonMenuItems}
+
+ } danger>
+ Leave Chat
+
+
+ )
+ }
+
+ return (
+ <>
+ }>View Profile
+
+ {commonMenuItems}
+
+ } danger>
+ Delete Chat
+
+
+ )
+ }
+
+ return
+}
diff --git a/packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx b/packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx
index ed074896..0f465278 100644
--- a/packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx
+++ b/packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx
@@ -1,7 +1,7 @@
import React from 'react'
-import { BellIcon } from '~/src/icons/bell-icon'
-import { ContextMenu, ContextMenuTrigger } from '~/src/system/context-menu'
+import { ChatMenu } from '~/src/components/chat-menu'
+import { ContextMenuTrigger } from '~/src/system/context-menu'
import { SidebarItem } from '../sidebar-item'
@@ -17,21 +17,7 @@ export const ChannelItem = (props: Props) => {
return (
#{children}
-
- }>View Profile
-
-
- For 15 min
- For 1 hour
- For 8 hours
- For 24 hours
- Until I turn it back on
-
-
- } danger>
- Delete
-
-
+
)
}
diff --git a/packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx b/packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx
index 24e2af0a..ad773ac1 100644
--- a/packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx
+++ b/packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx
@@ -1,7 +1,8 @@
import React from 'react'
-import { BellIcon } from '~/src/icons/bell-icon'
-import { ContextMenu, ContextMenuTrigger } from '~/src/system'
+import { ChatMenu } from '~/src/components/chat-menu'
+import { useChat } from '~/src/protocol/use-chat'
+import { ContextMenuTrigger } from '~/src/system'
import { SidebarItem } from '../sidebar-item'
@@ -14,24 +15,12 @@ interface Props extends SidebarItemProps {
export const ChatItem = (props: Props) => {
const { children, ...sidebarItemProps } = props
+ const chat = useChat(children)
+
return (
{children}
-
- }>View Profile
-
- }>
- For 15 min
- For 1 hour
- For 8 hours
- For 24 hours
- Until I turn it back on
-
-
- } danger>
- Delete
-
-
+
)
}