Skip to content

Commit 0508585

Browse files
kartikpersistentvasanthasaikalluriprakriti-solankey
authored
Chat modes name changes (#815)
* Props name changes * removed the accesstoken from row on copy action * updated chat mode names * Chat Modes Name Changes * lint fixes * using readble format In UI * removal of size to avoid console warning * key add --------- Co-authored-by: vasanthasaikalluri <165021735+vasanthasaikalluri@users.noreply.github.com> Co-authored-by: Prakriti Solankey <156313631+prakriti-solankey@users.noreply.github.com>
1 parent 220bee7 commit 0508585

File tree

13 files changed

+89
-76
lines changed

13 files changed

+89
-76
lines changed

backend/src/shared/constants.py

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -560,12 +560,12 @@
560560

561561
CHAT_VECTOR_MODE = "vector"
562562
CHAT_FULLTEXT_MODE = "fulltext"
563-
CHAT_ENTITY_VECTOR_MODE = "entity search+vector"
564-
CHAT_VECTOR_GRAPH_MODE = "graph+vector"
565-
CHAT_VECTOR_GRAPH_FULLTEXT_MODE = "graph+vector+fulltext"
566-
CHAT_GLOBAL_VECTOR_FULLTEXT_MODE = "global search+vector+fulltext"
563+
CHAT_ENTITY_VECTOR_MODE = "entity_vector"
564+
CHAT_VECTOR_GRAPH_MODE = "graph_vector"
565+
CHAT_VECTOR_GRAPH_FULLTEXT_MODE = "graph_vector_fulltext"
566+
CHAT_GLOBAL_VECTOR_FULLTEXT_MODE = "global_vector"
567567
CHAT_GRAPH_MODE = "graph"
568-
CHAT_DEFAULT_MODE = "graph+vector+fulltext"
568+
CHAT_DEFAULT_MODE = "graph_vector_fulltext"
569569

570570
CHAT_MODE_CONFIG_MAP= {
571571
CHAT_VECTOR_MODE : {

frontend/src/components/ChatBot/ChatInfoModal.tsx

Lines changed: 17 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import ChunkInfo from './ChunkInfo';
2424
import EntitiesInfo from './EntitiesInfo';
2525
import SourcesInfo from './SourcesInfo';
2626
import CommunitiesInfo from './CommunitiesInfo';
27-
import { chatModeLables, supportedLLmsForRagas } from '../../utils/Constants';
27+
import { chatModeLables, chatModeReadableLables, supportedLLmsForRagas } from '../../utils/Constants';
2828
import { Relationship } from '@neo4j-nvl/base';
2929
import { getChatMetrics } from '../../services/GetRagasMetric';
3030
import MetricsTab from './MetricsTab';
@@ -71,14 +71,20 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
7171
const { breakpoints } = tokens;
7272
const isTablet = useMediaQuery(`(min-width:${breakpoints.xs}) and (max-width: ${breakpoints.lg})`);
7373
const [activeTab, setActiveTab] = useState<number>(
74-
error?.length ? 10 : mode === chatModeLables.global_vector ? 7 : mode === chatModeLables.graph ? 4 : 3
74+
error?.length
75+
? 10
76+
: mode === chatModeLables['global search+vector+fulltext']
77+
? 7
78+
: mode === chatModeLables.graph
79+
? 4
80+
: 3
7581
);
7682
const { userCredentials } = useCredentials();
7783
const themeUtils = useContext(ThemeWrapperContext);
7884
const [, copy] = useCopyToClipboard();
7985
const [copiedText, setcopiedText] = useState<boolean>(false);
8086
const [showMetricsTable, setShowMetricsTable] = useState<boolean>(Boolean(metricDetails));
81-
const [showMultiModeMetrics, setShowMultiModeMetrics] = useState<boolean>(Boolean(multiModelMetrics.length))
87+
const [showMultiModeMetrics, setShowMultiModeMetrics] = useState<boolean>(Boolean(multiModelMetrics.length));
8288
const [multiModeError, setMultiModeError] = useState<string>('');
8389

8490
const actions: CypherCodeBlockProps['actions'] = useMemo(
@@ -201,7 +207,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
201207
}
202208
}
203209
} else {
204-
setShowMultiModeMetrics(true)
210+
setShowMultiModeMetrics(true);
205211
toggleMetricsLoading();
206212
const contextarray = Object.values(activeChatmodes).map((r) => {
207213
return r.metric_contexts;
@@ -255,24 +261,24 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
255261
To generate this response, the process took <span className='font-bold'>{response_time} seconds,</span>
256262
utilizing <span className='font-bold'>{total_tokens}</span> tokens with the model{' '}
257263
<span className='font-bold'>{model}</span> in{' '}
258-
<span className='font-bold'>{mode !== 'vector' ? mode.replace(/\+/g, ' & ') : mode}</span> mode.
264+
<span className='font-bold'>{chatModeReadableLables[mode] !== 'vector' ? chatModeReadableLables[mode].replace(/\+/g, ' & ') : chatModeReadableLables[mode]}</span> mode.
259265
</Typography>
260266
</Box>
261267
</Box>
262268
{error?.length > 0 ? (
263269
<Banner type='danger'>{error}</Banner>
264270
) : (
265271
<Tabs size='large' fill='underline' onChange={onChangeTabs} value={activeTab}>
266-
{mode === chatModeLables.global_vector ? (
272+
{mode === chatModeLables['global search+vector+fulltext'] ? (
267273
<Tabs.Tab tabId={7}>Communities</Tabs.Tab>
268274
) : (
269275
<>
270276
{mode != chatModeLables.graph ? <Tabs.Tab tabId={3}>Sources used</Tabs.Tab> : <></>}
271277
{mode != chatModeLables.graph ? <Tabs.Tab tabId={5}>Chunks</Tabs.Tab> : <></>}
272-
{mode === chatModeLables.graph_vector ||
278+
{mode === chatModeLables['graph+vector'] ||
273279
mode === chatModeLables.graph ||
274-
mode === chatModeLables.graph_vector_fulltext ||
275-
mode === chatModeLables.entity_vector ? (
280+
mode === chatModeLables['graph+vector+fulltext'] ||
281+
mode === chatModeLables['entity search+vector'] ? (
276282
<Tabs.Tab tabId={4}>Top Entities used</Tabs.Tab>
277283
) : (
278284
<></>
@@ -282,7 +288,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
282288
) : (
283289
<></>
284290
)}
285-
{mode === chatModeLables.entity_vector && communities.length ? (
291+
{mode === chatModeLables['entity search+vector'] && communities.length ? (
286292
<Tabs.Tab tabId={7}>Communities</Tabs.Tab>
287293
) : (
288294
<></>
@@ -387,7 +393,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
387393
className='min-h-40'
388394
/>
389395
</Tabs.TabPanel>
390-
{mode === chatModeLables.entity_vector || mode === chatModeLables.global_vector ? (
396+
{mode === chatModeLables['entity search+vector'] || mode === chatModeLables['global search+vector+fulltext'] ? (
391397
<Tabs.TabPanel className='n-flex n-flex-col n-gap-token-4 n-p-token-6' value={activeTab} tabId={7}>
392398
<CommunitiesInfo loading={infoLoading} communities={communities} mode={mode} />
393399
</Tabs.TabPanel>

frontend/src/components/ChatBot/ChatModeToggle.tsx

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { StatusIndicator, Typography } from '@neo4j-ndl/react';
22
import { useMemo, useEffect } from 'react';
33
import { useFileContext } from '../../context/UsersFiles';
44
import CustomMenu from '../UI/Menu';
5-
import { chatModeLables, chatModes as AvailableModes } from '../../utils/Constants';
5+
import { chatModeLables, chatModes as AvailableModes, chatModeReadableLables } from '../../utils/Constants';
66
import { capitalize } from '@mui/material';
77
import { capitalizeWithPlus } from '../../utils/Utils';
88
import { useCredentials } from '../../context/UserCredentials';
@@ -30,33 +30,33 @@ export default function ChatModeToggle({
3030
if (
3131
chatModes.includes(chatModeLables.graph) ||
3232
chatModes.includes(chatModeLables.fulltext) ||
33-
chatModes.includes(chatModeLables.graph_vector_fulltext)
33+
chatModes.includes(chatModeLables['global search+vector+fulltext'])
3434
) {
3535
setchatModes((prev) =>
3636
prev.filter(
37-
(m) => ![chatModeLables.graph, chatModeLables.fulltext, chatModeLables.graph_vector_fulltext].includes(m)
37+
(m) => ![chatModeLables.graph, chatModeLables.fulltext, chatModeLables['graph+vector+fulltext']].includes(m)
3838
)
3939
);
4040
}
41-
if (!chatModes.includes(chatModeLables.vector)) {
42-
setchatModes([chatModeLables.vector]);
41+
if (!(chatModes.includes(chatModeLables.vector) || chatModes.includes(chatModeLables['graph+vector']))) {
42+
setchatModes([chatModeLables['graph+vector']]);
4343
}
4444
}
4545
}, [selectedRows.length, chatModes.length]);
4646

4747
const memoizedChatModes = useMemo(() => {
4848
return isGdsActive && isCommunityAllowed
4949
? AvailableModes
50-
: AvailableModes?.filter((m) => !m.mode.includes(chatModeLables.global_vector));
50+
: AvailableModes?.filter((m) => !m.mode.includes(chatModeLables['global search+vector+fulltext']));
5151
}, [isGdsActive, isCommunityAllowed]);
5252
const menuItems = useMemo(() => {
5353
return memoizedChatModes?.map((m) => {
5454
const isDisabled = Boolean(
55-
selectedRows.length && !(m.mode === chatModeLables.vector || m.mode === chatModeLables.graph_vector)
55+
selectedRows.length && !(m.mode === chatModeLables.vector || m.mode === chatModeLables['graph+vector'])
5656
);
5757
const handleModeChange = () => {
5858
if (isDisabled) {
59-
setchatModes([chatModeLables.graph_vector]);
59+
setchatModes([chatModeLables['graph+vector']]);
6060
} else if (chatModes.includes(m.mode)) {
6161
setchatModes((prev) => prev.filter((i) => i != m.mode));
6262
} else {
@@ -68,7 +68,9 @@ export default function ChatModeToggle({
6868
title: (
6969
<div>
7070
<Typography variant='subheading-small'>
71-
{m.mode.includes('+') ? capitalizeWithPlus(m.mode) : capitalize(m.mode)}
71+
{chatModeReadableLables[m.mode].includes('+')
72+
? capitalizeWithPlus(chatModeReadableLables[m.mode])
73+
: capitalize(chatModeReadableLables[m.mode])}
7274
</Typography>
7375
<div>
7476
<Typography variant='body-small'>{m.description}</Typography>
@@ -97,7 +99,7 @@ export default function ChatModeToggle({
9799

98100
useEffect(() => {
99101
if (!selectedRows.length && !chatModes.length) {
100-
setchatModes([chatModeLables.graph_vector_fulltext]);
102+
setchatModes([]);
101103
}
102104
}, [selectedRows.length, chatModes.length]);
103105
return (

frontend/src/components/ChatBot/ChatModesSwitch.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { Flex, IconButton } from '@neo4j-ndl/react';
22
import { ChevronLeftIconSolid, ChevronRightIconSolid } from '@neo4j-ndl/react/icons';
33
import TipWrapper from '../UI/TipWrapper';
44
import { capitalize, capitalizeWithPlus } from '../../utils/Utils';
5+
import { chatModeReadableLables } from '../../utils/Constants';
56

67
export default function ChatModesSwitch({
78
switchToOtherMode,
@@ -16,7 +17,7 @@ export default function ChatModesSwitch({
1617
currentMode: string;
1718
isFullScreen: boolean;
1819
}) {
19-
const chatmodetoshow = currentMode.includes('+') ? capitalizeWithPlus(currentMode) : capitalize(currentMode);
20+
const chatmodetoshow =chatModeReadableLables[currentMode].includes('+') ? capitalizeWithPlus(chatModeReadableLables[currentMode]) : capitalize(chatModeReadableLables[currentMode]);
2021
return (
2122
<Flex flexDirection='row' gap='1' alignItems='center'>
2223
<IconButton

frontend/src/components/ChatBot/Chatbot.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ const Chatbot: FC<ChatbotProps> = (props) => {
6464
const [responseTime, setResponseTime] = useState<number>(0);
6565
const [tokensUsed, setTokensUsed] = useState<number>(0);
6666
const [cypherQuery, setcypherQuery] = useState<string>('');
67-
const [chatsMode, setChatsMode] = useState<string>(chatModeLables.graph_vector_fulltext);
67+
const [chatsMode, setChatsMode] = useState<string>(chatModeLables['graph+vector+fulltext']);
6868
const [graphEntitites, setgraphEntitites] = useState<[]>([]);
6969
const [messageError, setmessageError] = useState<string>('');
7070
const [entitiesModal, setEntitiesModal] = useState<string[]>([]);
@@ -583,7 +583,7 @@ const Chatbot: FC<ChatbotProps> = (props) => {
583583
}}
584584
onClose={() => setShowInfoModal(false)}
585585
open={showInfoModal}
586-
size={activeChat?.currentMode === chatModeLables.entity_vector ? 'large' : 'medium'}
586+
size={activeChat?.currentMode === chatModeLables['entity search+vector'] ? 'large' : 'medium'}
587587
>
588588
<div style={{ display: 'flex', justifyContent: 'flex-end', alignItems: 'center' }}>
589589
<IconButton

frontend/src/components/ChatBot/ChunkInfo.tsx

Lines changed: 18 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -60,8 +60,8 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
6060
</Typography>
6161
</>
6262
</div>
63-
{mode !== chatModeLables.global_vector &&
64-
mode !== chatModeLables.entity_vector &&
63+
{mode !== chatModeLables['global search+vector+fulltext'] &&
64+
mode !== chatModeLables['entity search+vector'] &&
6565
mode !== chatModeLables.graph &&
6666
chunk.score && (
6767
<Typography variant='subheading-small'>Similarity Score: {chunk?.score}</Typography>
@@ -71,11 +71,10 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
7171
</div>
7272
<div>
7373
<TextLink
74-
as='medium'
7574
label='Graph view'
7675
className={`${loadingGraphView ? 'cursor-wait' : 'cursor-pointer'}`}
7776
onClick={() => handleChunkClick(chunk.element_id, 'Chunk')}
78-
>{'Graph'}
77+
>{'View Graph'}
7978
</TextLink>
8079
</div>
8180
</>
@@ -92,14 +91,13 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
9291
</Typography>
9392
</TextLink>
9493
</div>
95-
{mode !== chatModeLables.global_vector &&
96-
mode !== chatModeLables.entity_vector &&
94+
{mode !== chatModeLables['global search+vector+fulltext'] &&
95+
mode !== chatModeLables['entity search+vector'] &&
9796
mode !== chatModeLables.graph && (
9897
<>
9998
<Typography variant='subheading-small'>Similarity Score: {chunk?.score}</Typography>
10099
<div>
101100
<TextLink
102-
as='small'
103101
className={`${loadingGraphView ? 'cursor-wait' : 'cursor-pointer'}`}
104102
label='Graph view'
105103
onClick={() => handleChunkClick(chunk.element_id, 'Chunk')}
@@ -115,18 +113,17 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
115113
<img src={wikipedialogo} width={20} height={20} className='mr-2' />
116114
<Typography variant='subheading-medium'>{chunk?.fileName}</Typography>
117115
</div>
118-
{mode !== chatModeLables.global_vector &&
119-
mode !== chatModeLables.entity_vector &&
116+
{mode !== chatModeLables['global search+vector+fulltext'] &&
117+
mode !== chatModeLables['entity search+vector'] &&
120118
mode !== chatModeLables.graph && (
121119
<>
122120
<Typography variant='subheading-small'>Similarity Score: {chunk?.score}</Typography>
123121
<div>
124122
<TextLink
125-
as='medium'
126123
className={`${loadingGraphView ? 'cursor-wait' : 'cursor-pointer'}`}
127124
label='Graph view'
128125
onClick={() => handleChunkClick(chunk.element_id, 'Chunk')}
129-
>{'Graph'}
126+
>{'View Graph'}
130127
</TextLink>
131128
</div>
132129
</>
@@ -138,18 +135,17 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
138135
<img src={gcslogo} width={20} height={20} className='mr-2' />
139136
<Typography variant='subheading-medium'>{chunk?.fileName}</Typography>
140137
</div>
141-
{mode !== chatModeLables.global_vector &&
142-
mode !== chatModeLables.entity_vector &&
138+
{mode !== chatModeLables['global search+vector+fulltext'] &&
139+
mode !== chatModeLables['entity search+vector'] &&
143140
mode !== chatModeLables.graph && (
144141
<>
145142
<Typography variant='subheading-small'>Similarity Score: {chunk?.score}</Typography>
146143
<div>
147144
<TextLink
148-
as='medium'
149145
className={`${loadingGraphView ? 'cursor-wait' : 'cursor-pointer'}`}
150146
label='Graph view'
151147
onClick={() => handleChunkClick(chunk.element_id, 'Chunk')}
152-
>{'Graph'}
148+
>{'View Graph'}
153149
</TextLink>
154150
</div>
155151
</>
@@ -161,18 +157,17 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
161157
<img src={s3logo} width={20} height={20} className='mr-2' />
162158
<Typography variant='subheading-medium'>{chunk?.fileName}</Typography>
163159
</div>
164-
{mode !== chatModeLables.global_vector &&
165-
mode !== chatModeLables.entity_vector &&
160+
{mode !== chatModeLables['global search+vector+fulltext'] &&
161+
mode !== chatModeLables['entity search+vector'] &&
166162
mode !== chatModeLables.graph && (
167163
<>
168164
<Typography variant='subheading-small'>Similarity Score: {chunk?.score}</Typography>
169165
<div>
170166
<TextLink
171-
as='medium'
172167
className={`${loadingGraphView ? 'cursor-wait' : 'cursor-pointer'}`}
173168
label='Graph view'
174169
onClick={() => handleChunkClick(chunk.element_id, 'Chunk')}
175-
>{'Graph'}
170+
>{'View Graph'}
176171
</TextLink>
177172
</div>
178173
</>
@@ -188,18 +183,17 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
188183
<Typography variant='body-medium'>{chunk?.url}</Typography>
189184
</TextLink>
190185
</div>
191-
{mode !== chatModeLables.global_vector &&
192-
mode !== chatModeLables.entity_vector &&
186+
{mode !== chatModeLables['global search+vector+fulltext'] &&
187+
mode !== chatModeLables['entity search+vector'] &&
193188
mode !== chatModeLables.graph && (
194189
<>
195190
<Typography variant='subheading-small'>Similarity Score: {chunk?.score}</Typography>
196191
<div>
197192
<TextLink
198-
as='medium'
199193
className={`${loadingGraphView ? 'cursor-wait' : 'cursor-pointer'}`}
200194
label='Graph view'
201195
onClick={() => handleChunkClick(chunk.element_id, 'Chunk')}
202-
>{'Graph'}
196+
>{'View Graph'}
203197
</TextLink>
204198
</div>
205199
</>
@@ -227,11 +221,10 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
227221
</Typography>
228222
<div>
229223
<TextLink
230-
as='medium'
231224
className={`${loadingGraphView ? 'cursor-wait' : 'cursor-pointer'}`}
232225
label='Graph view'
233226
onClick={() => handleChunkClick(chunk.element_id, 'Chunk')}
234-
>{'Graph'}
227+
>{'View Graph'}
235228
</TextLink>
236229
</div>
237230
</>

frontend/src/components/ChatBot/CommunitiesInfo.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ const CommunitiesInfo: FC<CommunitiesProps> = ({ loading, communities, mode }) =
4747
onClick={() => handleCommunityClick(community.element_id, 'chatInfoView')}
4848
>{`ID : ${community.id}`}</TextLink>
4949
</Flex>
50-
{mode === chatModeLables.global_vector && community.score && (
50+
{mode === chatModeLables['global search+vector+fulltext'] && community.score && (
5151
<Flex flexDirection='row' gap='2'>
5252
<Typography variant='subheading-medium'>Score : </Typography>
5353
<Typography variant='subheading-medium'>{community.score}</Typography>

frontend/src/components/ChatBot/SourcesInfo.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,9 @@ const filterUniqueChunks = (chunks: Chunk[]) => {
1616
const sourceCheck = `${chunk.fileName}-${chunk.fileSource}`;
1717
if (chunkSource.has(sourceCheck)) {
1818
return false;
19-
}
20-
chunkSource.add(sourceCheck);
21-
return true;
22-
19+
}
20+
chunkSource.add(sourceCheck);
21+
return true;
2322
});
2423
};
2524

0 commit comments

Comments
 (0)