Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Sidebar history Section #50

Merged
merged 8 commits into from
Oct 2, 2024

Conversation

Sauradip07
Copy link

Summary:

Truncated Display for History Titles

  • Added a feature to truncate titles in the Sidebar History component.
    Introduced a truncate Title helper function to limit the title length to 17 characters and append an ellipsis if necessary.

  • Added a historyData.ts file to provide mock data for testing and development.

  • Dynamic Opacity for Send Button :-

  • Ensure that the send button in the ChatBottomBar component appears with 50% opacity when the input field is empty.

  • Verify that the opacity changes to 100% when the input field is not empty.

  • Confirm that the button is disabled when no text is entered and enabled when text is present.

Backend Integration:

  • Once the backend is ready, the plan is to replace the hard-coded data in historyData.ts with an API call to fetch the actual data. For now, the historyData.ts file serves as a temporary data source.
Screencast.from.2024-08-12.23-34-52.mp4

src/frontend/components/sidebarHistory.tsx Outdated Show resolved Hide resolved
src/frontend/components/sidebarHistory.tsx Outdated Show resolved Hide resolved
src/frontend/components/sidebarHistory.tsx Outdated Show resolved Hide resolved
src/frontend/components/historyData.ts Outdated Show resolved Hide resolved
src/frontend/components/sidebarHistory.tsx Outdated Show resolved Hide resolved
src/frontend/components/chat-bottom-bar.tsx Outdated Show resolved Hide resolved
Signed-off-by: Sauradip Ghosh <[email protected]>
Signed-off-by: Sauradip Ghosh <[email protected]>
Signed-off-by: Sauradip Ghosh <[email protected]>
@Sauradip07 Sauradip07 requested a review from swaptr August 29, 2024 07:51
src/frontend/components/sidebar-history.tsx Outdated Show resolved Hide resolved
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="w-56">
<DropdownMenuSeparator />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dont need this.

>
<Pin className="mr-2" /> Pin
</DropdownMenuCheckboxItem>
<button className="p-[7px] flex flex-rowtext-left w-full hover:bg-hover-blue border-none hover:border-none ">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think these can be Link instead.

@@ -24,6 +24,7 @@ const config = {
extend: {
colors: {
border: 'hsl(var(--border))',
'hover-blue': '#f1f5f9',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Remove this, just use a lighter shade of whatever is available.

Comment on lines +38 to +46
useEffect(() => {
setButtonClass(
`rounded-full flex-shrink-0 transition-opacity duration-200 ${
message.content.trim()
? 'opacity-100'
: 'opacity-50'
}`
);
}, [message.content]);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You could instead use a disabled variable. Makes it easier when you extend it with global state.

@@ -111,9 +124,10 @@ const ChatBottomBar = ({ onSend }: Props) => {
<Button
size="icon"
variant="default"
className="rounded-full flex-shrink-0"
className={buttonClass}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And the styling logic moves here.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Note: You can use cn() from utils.

</span>
</button>

<button className="p-[7px] flex flex-rowtext-left w-full hover:bg-hover-blue border-none hover:border-none ">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This too.

Signed-off-by: Sauradip Ghosh <[email protected]>
Signed-off-by: Sauradip Ghosh <[email protected]>
@swaptr swaptr merged commit 2574e99 into hyperledger-labs:dev Oct 2, 2024
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants