-
Notifications
You must be signed in to change notification settings - Fork 79
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* initial new layout * add the title and examples * reset the chat, submit the query * start reconnecting everything * fix the message display order * improve the prompt input * remove unused-pages * improve layout * remove un-used files * improve message styling * Improve the spinner * improve UX * fix summarization * load only when ready * connect chat to history * persist the redux store * clear history * don't persist dimension and measures * use the data toggle * Docs(updating readme with new ui/ux gif) * feat: multi explore support --------- Co-authored-by: Jawad Laraqui <[email protected]> Co-authored-by: Luka Fontanilla <[email protected]>
- Loading branch information
1 parent
c986fe3
commit 7cc6138
Showing
16 changed files
with
457 additions
and
176 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
[ | ||
{ | ||
"category": "Cohorting", | ||
"prompt": "Count of Users by first purchase date", | ||
"color": "green" | ||
}, | ||
{ | ||
"category": "Audience Building", | ||
"prompt":"Users who have purchased more than 100 dollars worth of Calvin Klein products and have purchased in the last 30 days", | ||
"color": "blue" | ||
}, | ||
{ | ||
"category": "Period Comparison", | ||
"prompt": "Total revenue by category this year compared to last year in a line chart with year pivoted", | ||
"color": "red" | ||
} | ||
] |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
77 changes: 44 additions & 33 deletions
77
explore-assistant-extension/src/components/SamplePrompts.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,47 +1,58 @@ | ||
import React from 'react' | ||
import { useDispatch } from 'react-redux' | ||
import { useDispatch, useSelector } from 'react-redux' | ||
import { resetChat, setIsChatMode, setQuery } from '../slices/assistantSlice' | ||
import { RootState } from '../store' | ||
|
||
const SamplePrompts = () => { | ||
const dispatch = useDispatch() | ||
const categorizedPrompts = [ | ||
{ | ||
category: 'Cohorting', | ||
prompt: 'Count of Users by first purchase date', | ||
}, | ||
{ | ||
category: 'Audience Building', | ||
prompt: | ||
'Users who have purchased more than 100 dollars worth of Calvin Klein products and have purchased in the last 30 days', | ||
}, | ||
{ | ||
category: 'Period Comparison', | ||
prompt: | ||
'Total revenue by category this year compared to last year in a line chart with year pivoted', | ||
}, | ||
] | ||
const { | ||
examples, | ||
exploreId, | ||
} = useSelector((state: RootState) => state.assistant) | ||
const [samplesLoaded, setSamplesLoaded] = React.useState(false) | ||
|
||
React.useEffect(() => { | ||
if(examples.exploreSamples.length > 0) { | ||
setSamplesLoaded(true) | ||
console.log(examples.exploreSamples) | ||
} | ||
},[examples.exploreSamples]) | ||
|
||
const handleSubmit = (prompt: string) => { | ||
dispatch(resetChat()) | ||
dispatch(setQuery(prompt)) | ||
dispatch(setIsChatMode(true)) | ||
} | ||
return ( | ||
<div className="flex flex-wrap max-w-5xl"> | ||
{categorizedPrompts.map((item, index: number) => ( | ||
<div | ||
className="flex flex-col w-56 bg-gray-200/50 hover:bg-gray-200 rounded-lg cursor-pointer text-sm p-4 m-2" | ||
key={index} | ||
onClick={() => { | ||
handleSubmit(item.prompt) | ||
}} | ||
> | ||
<div className="flex-grow font-light line-camp-5">{item.prompt}</div> | ||
<div className="mt-2 font-semibold justify-end">{item.category}</div> | ||
</div> | ||
))} | ||
</div> | ||
) | ||
|
||
if(samplesLoaded) { | ||
const categorizedPrompts = JSON.parse( | ||
examples.exploreSamples.filter( | ||
explore => explore.explore_id === exploreId.replace("/",":") | ||
) | ||
?.[0] | ||
?.['samples'] ?? '[]' | ||
) | ||
|
||
return ( | ||
<div className="flex flex-wrap max-w-5xl"> | ||
{categorizedPrompts.map((item, index: number) => ( | ||
<div | ||
className="flex flex-col w-56 bg-gray-200/50 hover:bg-gray-200 rounded-lg cursor-pointer text-sm p-4 m-2" | ||
key={index} | ||
onClick={() => { | ||
handleSubmit(item.prompt) | ||
}} | ||
> | ||
<div className="flex-grow font-light line-camp-5">{item.prompt}</div> | ||
<div className="mt-2 font-semibold justify-end">{item.category}</div> | ||
</div> | ||
)) | ||
} | ||
</div> | ||
) | ||
} else { | ||
return <></> | ||
} | ||
} | ||
|
||
export default SamplePrompts |
Oops, something went wrong.