Skip to content

Commit 58df1e1

Browse files
mohamadch91mohamadch91
committed
feat:add sugggestions
1 parent 098e5bd commit 58df1e1

File tree

6 files changed

+371
-99
lines changed

6 files changed

+371
-99
lines changed

‎services/webui/src/components/AIComponents/Agents/index.tsx‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import Tooltip from '../Tooltip';
77
import { Button, Modal } from '@cloudscape-design/components'
88
import Cal, { getCalApi } from '@calcom/embed-react'
99
import { Flex } from '@tremor/react'
10-
function Agents({ setOpen }: any) {
10+
function Agents() {
1111
const [agents, setAgents] = useState<Agent[]>([
1212
{
1313
name: 'Identity & Access',
@@ -40,35 +40,33 @@ function Agents({ setOpen }: any) {
4040
is_available: true,
4141
},
4242
])
43-
const selected_agent = {
44-
id: 'identity_access',
45-
}
46-
const navigate = useNavigate()
47-
43+
44+
const [agent, setAgent] = useState<Agent | null>(localStorage.getItem('agent') ? JSON.parse(localStorage.getItem('agent') as string) : agents[0])
4845
return (
4946
<>
5047
<div className=" bg-slate-200 dark:bg-gray-950 h-full w-full max-w-sm justify-start items-start max-h-[90vh] flex flex-col gap-2 ">
5148
<div
5249
id="k-agent-bar"
5350
className="flex flex-col gap-2 max-h-[90vh] overflow-y-scroll mt-2 "
5451
>
55-
{agents?.map((agent) => {
52+
{agents?.map((Fagent) => {
5653
return (
5754
<div
58-
key={agent.id}
55+
key={Fagent.id}
5956
onClick={() => {
60-
setOpen(true)
57+
localStorage.setItem('agent', JSON.stringify(Fagent))
58+
window.location.reload()
6159
}}
6260
className={`rounded-sm flex flex-col justify-start items-start gap-2 hover:dark:bg-gray-700 hover:bg-gray-400 cursor-pointer p-2 ${
63-
selected_agent?.id == agent.id &&
61+
agent?.id == Fagent.id &&
6462
' bg-slate-400 dark:bg-slate-800'
6563
}`}
6664
>
6765
<span className="text-base text-slate-950 dark:text-slate-200">
68-
{agent.name}
66+
{Fagent.name}
6967
</span>
7068
<span className="text-sm text-slate-500 dark:text-slate-400">
71-
{agent.description}
69+
{Fagent.description}
7270
</span>
7371
</div>
7472
)

‎services/webui/src/components/AIComponents/Table/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,6 @@ export const getTable = (
6363
for (let i = 0; i < details.length; i += 1) {
6464
const row: any = {};
6565
for (let j = 0; j < columns.length; j += 1) {
66-
console.log(typeof details[i][j]);
6766
row[headerField?.at(j) || ''] =
6867
typeof details[i][j] == 'string'
6968
? // @ts-ignore

‎services/webui/src/pages/AI/chat/AIChat.tsx‎

Lines changed: 112 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,19 @@
1-
import React, { ChangeEvent, useEffect, useRef, useState } from 'react';
2-
import { Chat, ChatList } from '../types';
3-
import axios from 'axios';
4-
import { dateTimeDisplay } from '../../../utilities/dateDisplay';
5-
import KChatCard from '../../../components/AIComponents/ChatCard';
6-
import KResponseCard from '../../../components/AIComponents/ResponseCard';
1+
import React, { ChangeEvent, useEffect, useRef, useState } from 'react'
2+
import { Chat, ChatList } from '../types'
3+
import axios from 'axios'
4+
import { dateTimeDisplay } from '../../../utilities/dateDisplay'
5+
import KChatCard from '../../../components/AIComponents/ChatCard'
6+
import KResponseCard from '../../../components/AIComponents/ResponseCard'
77
import KInput from '../../../components/AIComponents/Input'
8+
import { DEVOPS, IDENTITY } from './responses'
89

9-
function AIChat({setOpen}:any) {
10+
function AIChat({ setOpen, }: any) {
1011
const [message, setMessage] = useState('')
12+
const agent = JSON.parse(localStorage.getItem('agent') as string)
13+
const [chats, setChats] = useState<ChatList>(
14+
agent.id == 'identity_access' ? IDENTITY : DEVOPS
15+
)
1116

12-
13-
const [chats, setChats] = useState<ChatList>({
14-
'0': {
15-
message: '',
16-
text: 'Hi there! This is your Identity & Access Agent. I can help you with anything related to identity management and access tools. What can I assist you with today? For example, you can ask me things like:',
17-
loading: false,
18-
time: 0,
19-
error: '',
20-
isWelcome: true,
21-
pre_loaded: false,
22-
clarify_needed: false,
23-
messageTime: '',
24-
responseTime: '1:5AM',
25-
suggestions: [
26-
'Get me the list of users who have access to Azure Subscriptions.',
27-
'Get me all SPNs with expired passwords.',
28-
'Show me the access activity for user John Doe.',
29-
],
30-
response: {},
31-
},
32-
})
33-
3417
const lastMessageRef = useRef(null)
3518
const scroll = () => {
3619
const layout = document.getElementById('layout')
@@ -59,6 +42,7 @@ function AIChat({setOpen}:any) {
5942
useEffect(() => {
6043
scroll()
6144
}, [chats])
45+
6246

6347
return (
6448
<>
@@ -73,52 +57,105 @@ function AIChat({setOpen}:any) {
7357
Object.keys(chats).map((key) => {
7458
return (
7559
<>
76-
{!chats[key].isWelcome && (
77-
<KChatCard
78-
date={
79-
chats[key].messageTime
80-
}
81-
key={parseInt(key) + 'chat'}
82-
message={chats[key].message}
83-
/>
60+
{chats[key].show && (
61+
<>
62+
{!chats[key].isWelcome && (
63+
<KChatCard
64+
date={
65+
chats[key]
66+
.messageTime
67+
}
68+
key={
69+
parseInt(key) +
70+
'chat'
71+
}
72+
message={
73+
chats[key]
74+
.message
75+
}
76+
/>
77+
)}
78+
<KResponseCard
79+
key={
80+
parseInt(key) +
81+
'result'
82+
}
83+
ref={
84+
key ===
85+
(
86+
Object.keys(
87+
chats
88+
)?.length - 1
89+
).toString()
90+
? lastMessageRef
91+
: null
92+
}
93+
scroll={scroll}
94+
response={
95+
chats[key].response
96+
}
97+
loading={
98+
chats[key].loading
99+
}
100+
pre_loaded={
101+
chats[key]
102+
.pre_loaded
103+
}
104+
chat_id={chats[key].id}
105+
error={chats[key].error}
106+
time={chats[key].time}
107+
text={chats[key].text}
108+
isWelcome={
109+
chats[key].isWelcome
110+
}
111+
date={
112+
chats[key]
113+
.responseTime
114+
}
115+
clarify_needed={
116+
chats[key]
117+
.clarify_needed
118+
}
119+
clarify_questions={
120+
chats[key]
121+
.clarify_questions
122+
}
123+
id={''}
124+
suggestions={
125+
chats[key]
126+
.suggestions
127+
}
128+
onClickSuggestion={(
129+
suggestion: string
130+
) => {
131+
// find suggestoin index
132+
const sug =
133+
chats['0']
134+
.suggestions
135+
const index =
136+
sug?.indexOf(
137+
suggestion
138+
)
139+
140+
const temp = chats
141+
if (
142+
index !==
143+
undefined
144+
) {
145+
temp[
146+
(
147+
index +
148+
1
149+
)?.toString()
150+
].show = true
151+
setChats({
152+
...temp,
153+
})
154+
}
155+
}}
156+
/>
157+
</>
84158
)}
85-
<KResponseCard
86-
key={parseInt(key) + 'result'}
87-
ref={
88-
key ===
89-
(
90-
Object.keys(chats)
91-
?.length - 1
92-
).toString()
93-
? lastMessageRef
94-
: null
95-
}
96-
scroll={scroll}
97-
response={chats[key].response}
98-
loading={chats[key].loading}
99-
pre_loaded={
100-
chats[key].pre_loaded
101-
}
102-
chat_id={chats[key].id}
103-
error={chats[key].error}
104-
time={chats[key].time}
105-
text={chats[key].text}
106-
isWelcome={chats[key].isWelcome}
107-
date={chats[key].responseTime}
108-
clarify_needed={
109-
chats[key].clarify_needed
110-
}
111-
clarify_questions={
112-
chats[key].clarify_questions
113-
}
114-
id={''}
115-
suggestions={
116-
chats[key].suggestions
117-
}
118-
onClickSuggestion={(
119-
suggestion: string
120-
) => {}}
121-
/>
122159
</>
123160
)
124161
})}
@@ -136,9 +173,8 @@ function AIChat({setOpen}:any) {
136173
}}
137174
/>
138175
</div>
139-
140176
</>
141177
)
142178
}
143179

144-
export default AIChat;
180+
export default AIChat

0 commit comments

Comments
 (0)