Skip to content

Commit 37de34b

Browse files
nizzyabiMrgSub
authored andcommitted
ai chat and notes pannel ui chanegs (#1130)
# READ CAREFULLY THEN REMOVE Remove bullet points that are not relevant. PLEASE REFRAIN FROM USING AI TO WRITE YOUR CODE AND PR DESCRIPTION. IF YOU DO USE AI TO WRITE YOUR CODE PLEASE PROVIDE A DESCRIPTION AND REVIEW IT CAREFULLY. MAKE SURE YOU UNDERSTAND THE CODE YOU ARE SUBMITTING USING AI. - Pull requests that do not follow these guidelines will be closed without review or comment. - If you use AI to write your PR description your pr will be close without review or comment. - If you are unsure about anything, feel free to ask for clarification. ## Description Please provide a clear description of your changes. --- ## Type of Change Please delete options that are not relevant. - [ ] 🐛 Bug fix (non-breaking change which fixes an issue) - [ ] ✨ New feature (non-breaking change which adds functionality) - [ ] 💥 Breaking change (fix or feature with breaking changes) - [ ] 📝 Documentation update - [ ] 🎨 UI/UX improvement - [ ] 🔒 Security enhancement - [ ] ⚡ Performance improvement ## Areas Affected Please check all that apply: - [ ] Email Integration (Gmail, IMAP, etc.) - [ ] User Interface/Experience - [ ] Authentication/Authorization - [ ] Data Storage/Management - [ ] API Endpoints - [ ] Documentation - [ ] Testing Infrastructure - [ ] Development Workflow - [ ] Deployment/Infrastructure ## Testing Done Describe the tests you've done: - [ ] Unit tests added/updated - [ ] Integration tests added/updated - [ ] Manual testing performed - [ ] Cross-browser testing (if UI changes) - [ ] Mobile responsiveness verified (if UI changes) ## Security Considerations For changes involving data or authentication: - [ ] No sensitive data is exposed - [ ] Authentication checks are in place - [ ] Input validation is implemented - [ ] Rate limiting is considered (if applicable) ## Checklist - [ ] I have read the [CONTRIBUTING](../CONTRIBUTING.md) document - [ ] My code follows the project's style guidelines - [ ] I have performed a self-review of my code - [ ] I have commented my code, particularly in complex areas - [ ] I have updated the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix/feature works - [ ] All tests pass locally - [ ] Any dependent changes are merged and published ## Additional Notes Add any other context about the pull request here. ## Screenshots/Recordings Add screenshots or recordings here if applicable. --- _By submitting this pull request, I confirm that my contribution is made under the terms of the project's license._
1 parent c20868c commit 37de34b

File tree

2 files changed

+20
-53
lines changed

2 files changed

+20
-53
lines changed

apps/mail/components/create/ai-chat.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -387,14 +387,14 @@ export function AIChat({
387387
<div className="flex flex-col">
388388
<div className="w-full">
389389
<form id="ai-chat-form" onSubmit={onSubmit} className="relative">
390-
<div className="grow self-stretch overflow-y-auto bg-[#FFFFFF] outline-white/5 dark:bg-[#202020]">
390+
<div className="grow self-stretch overflow-y-auto outline-white/5 dark:bg-[#202020]">
391391
<div
392392
onClick={() => {
393393
editor.commands.focus();
394394
}}
395395
className={cn('max-h-[100px] w-full')}
396396
>
397-
<EditorContent editor={editor} className="h-full w-full" />
397+
<EditorContent editor={editor} className="h-full w-full " />
398398
</div>
399399
</div>
400400
</form>

apps/mail/components/mail/note-panel.tsx

Lines changed: 18 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -136,30 +136,10 @@ function SortableNote({
136136
{note.content}
137137
</p>
138138

139-
<Tooltip>
140-
<TooltipTrigger asChild>
141-
<div className="mt-2 flex cursor-default items-center text-xs text-[#8C8C8C]">
142-
<Clock className="mr-1 h-3 w-3" />
143-
<span>{formatRelativeTime(note.createdAt, format)}</span>
144-
</div>
145-
</TooltipTrigger>
146-
<TooltipContent side="bottom" className="bg-white dark:bg-[#313131]">
147-
{note.updatedAt > note.createdAt ? (
148-
<>
149-
<p>
150-
{t('common.notes.created')}: {formatDate(note.createdAt, format)}
151-
</p>
152-
<p>
153-
{t('common.notes.updated')}: {formatDate(note.updatedAt, format)}
154-
</p>
155-
</>
156-
) : (
157-
<p>
158-
{t('common.notes.created')}: {formatDate(note.createdAt, format)}
159-
</p>
160-
)}
161-
</TooltipContent>
162-
</Tooltip>
139+
<div className="mt-2 flex cursor-default items-center text-xs text-[#8C8C8C]">
140+
<Clock className="mr-1 h-3 w-3" />
141+
<span>{formatRelativeTime(note.createdAt, format)}</span>
142+
</div>
163143
</div>
164144

165145
<div className="flex items-center">
@@ -561,7 +541,7 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
561541

562542
{isOpen && (
563543
<div
564-
className="animate-in fade-in-20 zoom-in-95 dark:bg-panelDark fixed right-0 top-[5rem] z-50 h-[calc(100dvh-5rem)] max-h-[calc(100dvh-5rem)] w-full max-w-[100vw] overflow-hidden rounded-t-lg border border-t bg-[#FAFAFA] shadow-lg duration-100 sm:absolute sm:right-0 sm:top-full sm:mt-2 sm:h-auto sm:max-h-[80vh] sm:w-[400px] sm:max-w-[90vw] sm:rounded-xl sm:border dark:border-[#252525]"
544+
className="animate-in fade-in-20 zoom-in-95 dark:bg-panelDark fixed top-[5rem] z-50 h-[calc(100dvh-5rem)] max-h-[calc(100dvh-5rem)] w-full max-w-[100vw] overflow-hidden rounded-t-lg border border-t bg-[#FAFAFA] shadow-lg duration-100 sm:absolute sm:right-0 sm:top-full sm:mt-2 sm:h-auto sm:max-h-[80vh] sm:w-[350px] sm:max-w-[90vw] sm:rounded-xl sm:border lg:left-[-200px] xl:left-[-300px] dark:border-[#252525]"
565545
onClick={handlePanelClick}
566546
>
567547
<div className="sticky top-0 z-10 flex items-center justify-between border-b border-[#E7E7E7] p-3 dark:border-[#252525]">
@@ -619,11 +599,11 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
619599
</p>
620600
<Button
621601
variant="default"
622-
size="sm"
623-
className="mt-1 bg-black text-white hover:bg-black/90 dark:bg-white dark:text-black dark:hover:bg-white/90"
602+
size="xs"
603+
className="mt-1"
624604
onClick={() => setIsAddingNewNote(true)}
625605
>
626-
<PlusCircle className="mr-2 h-4 w-4" />
606+
<PlusCircle className="mr-1 h-4 w-4" />
627607
{t('common.notes.addNote')}
628608
</Button>
629609
</div>
@@ -706,7 +686,7 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
706686
)}
707687

708688
{isAddingNewNote && (
709-
<div className="relative mb-3 overflow-hidden rounded-md border border-[#E7E7E7] bg-[#FFFFFF] p-3 dark:border-[#252525] dark:bg-[#202020]">
689+
<div className="relative mb-3 overflow-hidden rounded-md border-[#E7E7E7] bg-[#FFFFFF] dark:border-[#252525] dark:bg-[#202020]">
710690
<div
711691
className={cn(
712692
'absolute bottom-0 left-0 top-0 w-1.5 border-l-4',
@@ -719,17 +699,17 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
719699
}
720700
/>
721701

722-
<div className="pl-1.5">
702+
<div className="">
723703
<Textarea
724704
ref={textareaRef}
725705
value={newNoteContent}
726706
onChange={(e) => setNewNoteContent(e.target.value)}
727707
onKeyDown={(e) => handleKeyDown(e, 'add')}
728-
className="min-h-[120px] resize-none border-none bg-transparent text-black focus:outline-none dark:text-white/90"
708+
className="min-h-[20px] resize-none border-none bg-transparent text-black focus:outline-none dark:text-white/90"
729709
placeholder={t('common.notes.addYourNote')}
730710
/>
731711

732-
<div className="mt-2 flex flex-wrap items-center justify-between gap-y-2">
712+
<div className="mt-2 flex flex-wrap items-center justify-between gap-y-2 px-3 py-2">
733713
<div className="flex items-center gap-2">
734714
<span className="text-xs text-[#8C8C8C]">
735715
{t('common.notes.label')}
@@ -768,19 +748,12 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
768748
))}
769749
</div>
770750
</div>
771-
772-
<div className="text-muted-foreground flex items-center text-xs">
773-
<kbd className="bg-muted inline-flex items-center rounded border px-1.5 py-0.5 font-mono text-[10px]">
774-
{navigator.platform.includes('Mac') ? '⌘' : 'Ctrl'}+Enter
775-
</kbd>
776-
<span className="ml-1">{t('common.notes.toSave')}</span>
777-
</div>
778751
</div>
779752

780-
<div className="mt-3 flex justify-between">
753+
<div className="mx-1 my-2 flex justify-between">
781754
<Button
782755
variant="ghost"
783-
size="sm"
756+
size="xs"
784757
className="text-[#8C8C8C] hover:bg-white/10 hover:text-[#a0a0a0]"
785758
onClick={() => {
786759
setIsAddingNewNote(false);
@@ -791,8 +764,7 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
791764
</Button>
792765
<Button
793766
variant="default"
794-
size="sm"
795-
className="bg-black text-white hover:bg-black/90 dark:bg-white dark:text-black dark:hover:bg-white/90"
767+
size="xs"
796768
onClick={() => void handleAddNote()}
797769
disabled={!newNoteContent.trim()}
798770
>
@@ -806,7 +778,7 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
806778
{!isAddingNewNote && (
807779
<Button
808780
variant="outline"
809-
size="sm"
781+
size="xs"
810782
className="mt-1 w-full border-[#E7E7E7] bg-white/5 hover:bg-white/10 dark:border-[#252525] dark:text-white/90"
811783
onClick={() => setIsAddingNewNote(true)}
812784
>
@@ -850,7 +822,7 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
850822
<div className="flex justify-end gap-2">
851823
<Button
852824
variant="ghost"
853-
size="sm"
825+
size="xs"
854826
className="text-[#8C8C8C] hover:bg-white/10 hover:text-[#a0a0a0]"
855827
onClick={() => {
856828
setEditingNoteId(null);
@@ -859,12 +831,7 @@ export function NotesPanel({ threadId }: NotesPanelProps) {
859831
>
860832
{t('common.notes.cancel')}
861833
</Button>
862-
<Button
863-
variant="default"
864-
size="sm"
865-
className="bg-black text-white hover:bg-black/90 dark:bg-white dark:text-black dark:hover:bg-white/90"
866-
onClick={() => void handleEditNote()}
867-
>
834+
<Button variant="default" size="xs" onClick={() => void handleEditNote()}>
868835
{t('common.actions.saveChanges')}
869836
</Button>
870837
</div>

0 commit comments

Comments
 (0)