Skip to content

Commit 4084176

Browse files
nikkothari22nikkothari22
authored
Merge pull request #2073 from The-Commit-Company/develop
Merging develop into v3
2 parents 0a5ca54 + 4b1752e commit 4084176

22 files changed

Lines changed: 279 additions & 163 deletions

File tree

‎apps/mobile/components/features/chat/ChatMessage/Renderers/PollMessage.tsx‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ const PollMessageBox = ({ data, messageID }: { data: Poll; messageID: string })
7777
)
7878
}
7979

80-
const PollOption = ({ data, option }: { data: Poll; option: RavenPollOption }) => {
80+
const PollOption = ({ data, option, showVoteNumber }: { data: Poll; option: RavenPollOption; showVoteNumber: boolean }) => {
8181

8282
const width = useSharedValue(0)
8383

@@ -119,22 +119,26 @@ const PollOption = ({ data, option }: { data: Poll; option: RavenPollOption }) =
119119
{option.option}
120120
</Text>
121121
<Text className={`px-2.5 py-1.5 text-sm w-[30%] text-right ${isCurrentUserVote ? 'font-semibold' : ''}`}>
122-
{percentage.toFixed(1)}%
122+
{showVoteNumber ? `${option.votes} vote${option.votes === 1 ? '' : 's'}` : `${percentage.toFixed(1)}%`}
123123
</Text>
124124
</View>
125125
)
126126
}
127127

128128
const PollResults = ({ data }: { data: Poll }) => {
129+
const [showVoteNumber, setShowVoteNumber] = useState(false)
130+
const toggleVoteNumber = () => {
131+
setShowVoteNumber(!showVoteNumber)
132+
}
129133
return (
130-
<View className="w-full">
134+
<Pressable className="w-full" onPress={toggleVoteNumber}>
131135
{data.poll.options.map((option) => (
132-
<PollOption key={option.name} data={data} option={option} />
136+
<PollOption key={option.name} data={data} option={option} showVoteNumber={showVoteNumber} />
133137
))}
134138
<Text className="pl-2 text-sm font-medium text-muted-foreground">
135139
{`${data.poll.total_votes || 0} vote${data.poll.total_votes === 1 ? '' : 's'}`}
136140
</Text>
137-
</View>
141+
</Pressable>
138142
)
139143
}
140144

‎frontend/src/components/feature/CommandMenu/ChannelList.tsx‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Command } from 'cmdk'
33
import ChannelItem from './ChannelItem'
44
import { useMemo } from 'react'
55

6-
const ChannelList = () => {
6+
const ChannelList = ({ text }: { text: string }) => {
77

88
const { channels } = useChannelList()
99

@@ -18,9 +18,19 @@ const ChannelList = () => {
1818
return sortedChannels
1919
}, [channels])
2020

21+
const { filteredChannels } = useMemo(() => {
22+
return {
23+
filteredChannels: sortedChannels.filter((channel) => channel.channel_name.toLowerCase().includes(text.toLowerCase()))
24+
}
25+
}, [sortedChannels, text])
26+
27+
if (filteredChannels.length === 0) {
28+
return null
29+
}
30+
2131
return (
2232
<Command.Group heading="Channels">
23-
{sortedChannels.map((channel) => (
33+
{filteredChannels.map((channel) => (
2434
<ChannelItem key={channel.name} channel={channel} />
2535
))}
2636
</Command.Group>

‎frontend/src/components/feature/CommandMenu/CommandMenu.tsx‎

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { DIALOG_CONTENT_CLASS } from '@/utils/layout/dialog'
22
import { Dialog, VisuallyHidden } from '@radix-ui/themes'
33
import { Command, defaultFilter } from 'cmdk'
4-
import { useEffect } from 'react'
4+
import { useEffect, useState } from 'react'
55
import './commandMenu.styles.css'
66
import ChannelList from './ChannelList'
77
import UserList from './UserList'
@@ -11,6 +11,7 @@ import { useIsDesktop } from '@/hooks/useMediaQuery'
1111
import { Drawer, DrawerContent } from '@/components/layout/Drawer'
1212
import SettingsList from './SettingsList'
1313
import ToggleThemeCommand from './ToggleThemeCommand'
14+
import { useDebounce } from '@/hooks/useDebounce'
1415

1516
export const commandMenuOpenAtom = atom(false)
1617

@@ -61,25 +62,33 @@ const CommandMenu = () => {
6162
export const CommandList = () => {
6263
const isDesktop = useIsDesktop()
6364

65+
const [text, setText] = useState('')
66+
67+
const debouncedText = useDebounce(text, 200)
68+
6469
/** Use a custom filter instead of the default one - ignore very low scores in results */
6570
const customFilter = (value: string, search: string, keywords?: string[]) => {
6671
const score = defaultFilter ? defaultFilter(value, search, keywords) : 1
6772

73+
console.log(value)
74+
6875
if (score <= 0.1) {
6976
return 0
7077
}
7178
return score
7279
}
7380

74-
return <Command label="Global Command Menu" className='command-menu' filter={customFilter}>
81+
return <Command label="Global Command Menu" className='command-menu' filter={customFilter} shouldFilter={false}>
7582
<Command.Input
7683
autoFocus={isDesktop}
84+
value={text}
85+
onValueChange={setText}
7786
placeholder='Search or type a command' />
7887
<Command.List>
7988
<Command.Empty>No results found.</Command.Empty>
80-
<ChannelList />
81-
<UserList />
82-
<SettingsList />
89+
<ChannelList text={debouncedText} />
90+
<UserList text={debouncedText} />
91+
<SettingsList text={debouncedText} />
8392
<Command.Group heading="Commands">
8493
<ToggleThemeCommand />
8594
</Command.Group>

‎frontend/src/components/feature/CommandMenu/DMChannelItem.tsx‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -8,35 +8,36 @@ import { useContext } from "react"
88
import { UserContext } from "@/utils/auth/UserProvider"
99
import { replaceCurrentUserFromDMChannelName } from "@/utils/operations"
1010
import { Badge, Flex } from "@radix-ui/themes"
11+
import { UserFields } from "@/utils/users/UserListProvider"
12+
import { DMChannelListItem } from "@/utils/channel/ChannelListProvider"
1113

12-
const DMChannelItem = ({ channelID, peer_user_id, channelName }: { channelID: string, channelName: string, peer_user_id: string }) => {
14+
const DMChannelItem = ({ channel, user }: { user: UserFields | null, channel: DMChannelListItem }) => {
1315

1416
const { currentUser } = useContext(UserContext)
1517
const { workspaceID } = useParams()
16-
const user = useGetUser(peer_user_id)
1718
const navigate = useNavigate()
1819
const setOpen = useSetAtom(commandMenuOpenAtom)
1920

2021
const onSelect = () => {
2122
if (workspaceID) {
22-
navigate(`/${workspaceID}/${channelID}`)
23+
navigate(`/${workspaceID}/${channel.name}`)
2324
} else {
24-
navigate(`/channel/${channelID}`)
25+
navigate(`/channel/${channel.name}`)
2526
}
2627
setOpen(false)
2728
}
2829

29-
const userName = user?.full_name ?? peer_user_id ?? replaceCurrentUserFromDMChannelName(channelName, currentUser)
30+
// const userName = user?.full_name ?? peer_user_id ?? replaceCurrentUserFromDMChannelName(channelName, currentUser)
3031

3132
return <Command.Item
32-
keywords={[userName]}
33-
value={peer_user_id ?? channelID}
33+
keywords={[user?.full_name || channel.peer_user_id]}
34+
value={channel.name}
3435
onSelect={onSelect}>
3536
<Flex gap='2' align='center' justify={'between'} width='100%'>
3637
<Flex gap='2' align='center'>
37-
<UserAvatar src={user?.user_image} alt={userName}
38+
<UserAvatar src={user?.user_image} alt={user?.full_name || channel.peer_user_id}
3839
isBot={user?.type === 'Bot'} />
39-
{userName}
40+
{user?.full_name || channel.peer_user_id}
4041
</Flex>
4142
{user && !user?.enabled && <Badge color='gray' variant="soft">Disabled</Badge>}
4243
{!user && <Badge color='gray' variant="soft">Deleted</Badge>}

‎frontend/src/components/feature/CommandMenu/SettingsList.tsx‎

Lines changed: 93 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,90 @@ import { BiBoltCircle, BiBot, BiFile, BiGroup, BiMessageSquareDots, BiTime, BiUs
44
import { useNavigate } from 'react-router-dom'
55
import { commandMenuOpenAtom } from './CommandMenu'
66
import { PiMagicWand } from 'react-icons/pi'
7-
import { LuSquareFunction } from 'react-icons/lu'
7+
import { LuBellDot, LuSquareFunction } from 'react-icons/lu'
88
import { AiOutlineApi } from 'react-icons/ai'
9+
import { useMemo } from 'react'
910

10-
type Props = {}
11+
type Props = {
12+
text: string
13+
}
1114

1215
const ICON_SIZE = 16
1316

17+
const ITEMS = [
18+
{
19+
value: 'profile',
20+
label: 'Profile',
21+
icon: <BiUserCircle size={ICON_SIZE} />,
22+
},
23+
{
24+
value: 'users',
25+
label: 'Users',
26+
icon: <BiGroup size={ICON_SIZE} />,
27+
},
28+
{
29+
value: 'hr',
30+
label: 'HR',
31+
icon: <svg fill="none" viewBox="0 0 32 32" width={18} height={18} xmlns="http://www.w3.org/2000/svg">
32+
<g clipPath="url(#clip0_2850_17380)">
33+
<path d="M25.5561 0H6.44394C2.88505 0 0 2.88505 0 6.44394V25.5561C0 29.115 2.88505 32 6.44394 32H25.5561C29.115 32 32 29.115 32 25.5561V6.44394C32 2.88505 29.115 0 25.5561 0Z" fill="#A1EEC9"></path>
34+
<path d="M15.4061 18.5995C12.4184 18.5995 9.97265 16.1684 9.97265 13.1661V12.6974L12.8724 12.7267L12.8431 13.1661C12.8431 14.572 13.9855 15.729 15.4061 15.729H16.5777C17.9836 15.729 19.1406 14.5867 19.1406 13.1661V11.9944C19.1406 10.5885 17.9983 9.43151 16.5777 9.43151H9.94336L9.97265 6.53174L16.5777 6.56103C19.5653 6.56103 22.0111 8.99215 22.0111 11.9944V13.1661C22.0111 16.1537 19.58 18.5995 16.5777 18.5995H15.4061Z" fill="#0B313A"></path>
35+
<path d="M8.78613 23.2714C10.7779 21.5286 13.3408 20.5474 16.0063 20.5474C18.6717 20.5474 21.2346 21.5286 23.2264 23.3153L21.2932 25.4389C19.8287 24.1355 17.9541 23.4178 16.0063 23.4178C14.0584 23.4178 12.1692 24.1355 10.7047 25.4535L8.80078 23.2714H8.78613Z" fill="#0B313A"></path>
36+
</g>
37+
<defs>
38+
<clipPath id="clip0_2850_17380">
39+
<rect fill="white" height="32" width="32"></rect>
40+
</clipPath>
41+
</defs>
42+
</svg>
43+
},
44+
{
45+
value: 'document-notifications',
46+
label: 'Document Notifications',
47+
icon: <LuBellDot size={ICON_SIZE} />,
48+
},
49+
{
50+
value: 'message-actions',
51+
label: 'Message Actions',
52+
icon: <BiBoltCircle size={ICON_SIZE} />,
53+
},
54+
{
55+
value: 'scheduled-messages',
56+
label: 'Scheduled Messages',
57+
icon: <BiTime size={ICON_SIZE} />,
58+
},
59+
{
60+
value: 'webhooks',
61+
label: 'Webhooks',
62+
icon: <AiOutlineApi size={ICON_SIZE} />,
63+
},
64+
{
65+
value: 'bots',
66+
label: 'Bots',
67+
icon: <BiBot size={ICON_SIZE} />,
68+
},
69+
{
70+
value: 'functions',
71+
label: 'Functions',
72+
icon: <LuSquareFunction size={ICON_SIZE} />,
73+
},
74+
{
75+
value: 'instructions',
76+
label: 'Instructions',
77+
icon: <BiFile size={ICON_SIZE} />,
78+
},
79+
{
80+
value: 'commands',
81+
label: 'Commands',
82+
icon: <BiMessageSquareDots size={ICON_SIZE} />,
83+
},
84+
{
85+
value: 'ai-settings',
86+
label: 'AI Settings',
87+
icon: <PiMagicWand size={ICON_SIZE} />,
88+
},
89+
]
90+
1491
const SettingsList = (props: Props) => {
1592

1693
const navigate = useNavigate()
@@ -21,76 +98,24 @@ const SettingsList = (props: Props) => {
2198
navigate(`/settings/${value}`)
2299
setOpen(false)
23100
}
24-
return (
25-
<Command.Group heading='Settings'>
26-
<Command.Item value='profile' onSelect={onSelect}>
27-
<BiUserCircle size={ICON_SIZE} />
28-
Profile
29-
</Command.Item>
30-
<Command.Item value='users' onSelect={onSelect}>
31-
<BiGroup size={ICON_SIZE} />
32-
Users
33-
</Command.Item>
34-
<Command.Item value='hr' keywords={['hr', 'human resources', 'Frappe HR']} onSelect={onSelect}>
35-
<svg fill="none" viewBox="0 0 32 32" width={18} height={18} xmlns="http://www.w3.org/2000/svg">
36-
<g clipPath="url(#clip0_2850_17380)">
37-
<path d="M25.5561 0H6.44394C2.88505 0 0 2.88505 0 6.44394V25.5561C0 29.115 2.88505 32 6.44394 32H25.5561C29.115 32 32 29.115 32 25.5561V6.44394C32 2.88505 29.115 0 25.5561 0Z" fill="#A1EEC9"></path>
38-
<path d="M15.4061 18.5995C12.4184 18.5995 9.97265 16.1684 9.97265 13.1661V12.6974L12.8724 12.7267L12.8431 13.1661C12.8431 14.572 13.9855 15.729 15.4061 15.729H16.5777C17.9836 15.729 19.1406 14.5867 19.1406 13.1661V11.9944C19.1406 10.5885 17.9983 9.43151 16.5777 9.43151H9.94336L9.97265 6.53174L16.5777 6.56103C19.5653 6.56103 22.0111 8.99215 22.0111 11.9944V13.1661C22.0111 16.1537 19.58 18.5995 16.5777 18.5995H15.4061Z" fill="#0B313A"></path>
39-
<path d="M8.78613 23.2714C10.7779 21.5286 13.3408 20.5474 16.0063 20.5474C18.6717 20.5474 21.2346 21.5286 23.2264 23.3153L21.2932 25.4389C19.8287 24.1355 17.9541 23.4178 16.0063 23.4178C14.0584 23.4178 12.1692 24.1355 10.7047 25.4535L8.80078 23.2714H8.78613Z" fill="#0B313A"></path>
40-
</g>
41-
<defs>
42-
<clipPath id="clip0_2850_17380">
43-
<rect fill="white" height="32" width="32"></rect>
44-
</clipPath>
45-
</defs>
46-
</svg>
47-
HR
48-
</Command.Item>
49-
50-
<Command.Item value='message-actions' onSelect={onSelect}>
51-
<BiBoltCircle size={ICON_SIZE} />
52-
Message Actions
53-
</Command.Item>
54-
55-
<Command.Item value='scheduled-messages' keywords={['scheduled messages']} onSelect={onSelect}>
56-
<BiTime size={ICON_SIZE} />
57-
Scheduled Messages
58-
</Command.Item>
59101

60-
<Command.Item value='webhooks' onSelect={onSelect}>
61-
<AiOutlineApi size={ICON_SIZE} />
62-
Webhooks
63-
</Command.Item>
102+
const filteredItems = useMemo(() => {
103+
return ITEMS.filter((item) => item.label.toLowerCase().includes(props.text.toLowerCase()))
104+
}, [props.text])
64105

65-
<Command.Item value='bots' onSelect={onSelect}>
66-
<BiBot size={ICON_SIZE} />
67-
Bots
68-
</Command.Item>
69-
70-
<Command.Item value='functions' onSelect={onSelect}>
71-
<LuSquareFunction size={ICON_SIZE} />
72-
Functions
73-
</Command.Item>
74-
75-
<Command.Item value='instructions' onSelect={onSelect}>
76-
<BiFile size={ICON_SIZE} />
77-
Instructions
78-
</Command.Item>
79-
80-
<Command.Item value='document-processors' onSelect={onSelect}>
81-
<BiFile size={ICON_SIZE} />
82-
Document Processors
83-
</Command.Item>
106+
if (filteredItems.length === 0) {
107+
return null
108+
}
84109

85-
<Command.Item value='commands' onSelect={onSelect}>
86-
<BiMessageSquareDots size={ICON_SIZE} />
87-
Commands
88-
</Command.Item>
89110

90-
<Command.Item value='ai-settings' onSelect={onSelect}>
91-
<PiMagicWand size={ICON_SIZE} />
92-
AI Settings
93-
</Command.Item>
111+
return (
112+
<Command.Group heading='Settings'>
113+
{filteredItems.map((item) => (
114+
<Command.Item key={item.value} value={item.value} onSelect={onSelect}>
115+
{item.icon}
116+
{item.label}
117+
</Command.Item>
118+
))}
94119
</Command.Group>
95120
)
96121
}

0 commit comments

Comments
 (0)
⚡