improvement(schedule): fix UI bug with schedule modal #1722
Conversation
This file contains hidden or 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
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Greptile Overview
Greptile Summary
This PR fixes UI layout issues in the schedule modal by adding proper height constraints, overflow handling, and consistent spacing.
Key changes:
- Added
max-h-[90vh]andoverflow-hiddentoDialogContentto prevent modal from exceeding viewport height - Added
onOpenAutoFocus={(e) => e.preventDefault()}to prevent unwanted focus behavior on open - Changed content area to use
flex-1with proper padding for better scrollability - Added
border-tto footer for visual separation - Improved button styling with consistent
h-9androunded-[8px]classes - Added loading spinners to Delete and Save buttons using inline animated divs
- Shortened "Delete Schedule" button text to just "Delete" for better spacing
- Added fixed width (
w-[140px]) to Save button for stability during loading state
Confidence Score: 4/5
- This PR is safe to merge with minimal risk - changes are primarily cosmetic UI improvements
- Score reflects well-structured UI improvements with proper layout constraints and loading states. Minor styling inconsistencies exist (button size on Save button and missing spinner margin) but won't affect functionality
- No files require special attention - the changes are straightforward UI improvements
Important Files Changed
File Analysis
| Filename | Score | Overview |
|---|---|---|
| apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx | 4/5 | UI improvements for better layout control, spacing consistency, and loading states; minor inconsistency with button size on save button |
Sequence Diagram
sequenceDiagram
participant User
participant ScheduleModal
participant DialogContent
participant Button
User->>ScheduleModal: Opens modal
ScheduleModal->>DialogContent: Renders with max-h-[90vh] & overflow-hidden
DialogContent->>DialogContent: Prevents auto-focus on open
User->>ScheduleModal: Makes changes to schedule
ScheduleModal->>ScheduleModal: Detects changes
User->>Button: Clicks Save
Button->>ScheduleModal: Triggers handleSave()
ScheduleModal->>ScheduleModal: Sets isSaving=true
ScheduleModal->>Button: Shows spinner (animate-spin)
ScheduleModal->>ScheduleModal: Validates & saves
ScheduleModal->>ScheduleModal: Sets isSaving=false
User->>Button: Clicks Delete
Button->>ScheduleModal: Triggers openDeleteConfirm()
ScheduleModal->>ScheduleModal: Sets isDeleting=true
ScheduleModal->>Button: Shows spinner (animate-spin)
ScheduleModal->>ScheduleModal: Processes deletion
ScheduleModal->>ScheduleModal: Sets isDeleting=false
1 file reviewed, 2 comments
| 'w-[140px] rounded-[8px]', | ||
| hasChanges ? 'bg-primary hover:bg-primary/90' : '' | ||
| )} | ||
| size='sm' |
Contributor
There was a problem hiding this comment.
style: Inconsistent button sizing - Cancel and Delete buttons use size='default' with h-9 override, but Save button uses size='sm'. Should use size='default' for consistency.
Suggested change
| size='sm' | |
| size='default' |
Prompt To Fix With AI
This is a comment left during a code review.
Path: apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx
Line: 592:592
Comment:
**style:** Inconsistent button sizing - Cancel and Delete buttons use `size='default'` with `h-9` override, but Save button uses `size='sm'`. Should use `size='default'` for consistency.
```suggestion
size='default'
```
How can I resolve this? If you propose a fix, please make it concise.
Comment on lines
+594
to
597
| {isSaving && ( | ||
| <div className='h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' /> | ||
| )} | ||
| {isSaving ? 'Saving...' : 'Save Changes'} |
Contributor
There was a problem hiding this comment.
style: Spinner shows without margin when saving, causing it to appear directly next to text. Add mr-2 class for spacing.
Suggested change
| {isSaving && ( | |
| <div className='h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' /> | |
| )} | |
| {isSaving ? 'Saving...' : 'Save Changes'} | |
| {isSaving && ( | |
| <div className='mr-2 h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' /> | |
| )} |
Prompt To Fix With AI
This is a comment left during a code review.
Path: apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx
Line: 594:597
Comment:
**style:** Spinner shows without margin when saving, causing it to appear directly next to text. Add `mr-2` class for spacing.
```suggestion
{isSaving && (
<div className='mr-2 h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' />
)}
```
How can I resolve this? If you propose a fix, please make it concise.
waleedlatif1
added a commit
that referenced
this pull request
Oct 23, 2025
* fix(debug-mode): remove duplicate debug mode flag (#1714) * feat(i18n): update translations (#1709) * improvement(condition): added variable and envvar highlighting for condition input (#1718) * fix(dashboard): add additional context for paginated logs in dashboard, add empty state when selected cell has no data (#1719) * fix(dashboard): add additional context for paginated logs in dashboard, add empty state when selected cell has no data * apps/sim * renaming * remove relative import * feat(tools): added webflow OAuth + tools (#1720) * feat(tools): added webflow OAuth + tools * remove itemId from delete item * remove siteId * added webhook triggers + oauth scopes + site/collection selector * update sample payload for webflow triggers * cleanup * fix discord color * feat(i18n): update translations (#1721) * improvement(schedule): fix UI bug with schedule modal (#1722)
|
Izvinjavam se sto kasnim
čet, 23. lis 2025. 23:21 greptile-apps[bot] ***@***.***> je
napisao:
… ***@***.***[bot]* commented on this pull request.
Greptile Overview Greptile Summary
This PR fixes UI layout issues in the schedule modal by adding proper
height constraints, overflow handling, and consistent spacing.
Key changes:
- Added max-h-[90vh] and overflow-hidden to DialogContent to prevent
modal from exceeding viewport height
- Added onOpenAutoFocus={(e) => e.preventDefault()} to prevent
unwanted focus behavior on open
- Changed content area to use flex-1 with proper padding for better
scrollability
- Added border-t to footer for visual separation
- Improved button styling with consistent h-9 and rounded-[8px] classes
- Added loading spinners to Delete and Save buttons using inline
animated divs
- Shortened "Delete Schedule" button text to just "Delete" for better
spacing
- Added fixed width (w-[140px]) to Save button for stability during
loading state
Confidence Score: 4/5
- This PR is safe to merge with minimal risk - changes are primarily
cosmetic UI improvements
- Score reflects well-structured UI improvements with proper layout
constraints and loading states. Minor styling inconsistencies exist (button
size on Save button and missing spinner margin) but won't affect
functionality
- No files require special attention - the changes are straightforward
UI improvements
Important Files Changed
File Analysis
Filename Score Overview
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx
4/5 UI improvements for better layout control, spacing consistency, and
loading states; minor inconsistency with button size on save button Sequence
Diagram
sequenceDiagram
participant User
participant ScheduleModal
participant DialogContent
participant Button
User->>ScheduleModal: Opens modal
ScheduleModal->>DialogContent: Renders with max-h-[90vh] & overflow-hidden
DialogContent->>DialogContent: Prevents auto-focus on open
User->>ScheduleModal: Makes changes to schedule
ScheduleModal->>ScheduleModal: Detects changes
User->>Button: Clicks Save
Button->>ScheduleModal: Triggers handleSave()
ScheduleModal->>ScheduleModal: Sets isSaving=true
ScheduleModal->>Button: Shows spinner (animate-spin)
ScheduleModal->>ScheduleModal: Validates & saves
ScheduleModal->>ScheduleModal: Sets isSaving=false
User->>Button: Clicks Delete
Button->>ScheduleModal: Triggers openDeleteConfirm()
ScheduleModal->>ScheduleModal: Sets isDeleting=true
ScheduleModal->>Button: Shows spinner (animate-spin)
ScheduleModal->>ScheduleModal: Processes deletion
ScheduleModal->>ScheduleModal: Sets isDeleting=false
Loading
1 file reviewed, 2 comments
Edit Code Review Agent Settings <https://app.greptile.com/review/github>
| Greptile
<https://greptile.com?utm_source=greptile_expert&utm_medium=github&utm_campaign=code_reviews&utm_content=sim_1722>
------------------------------
In
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx
<#1722 (comment)>:
> Cancel
</Button>
<Button
onClick={handleSave}
disabled={!hasChanges || isSaving}
- className={cn('h-10', hasChanges ? 'bg-primary hover:bg-primary/90' : '')}
- size='default'
+ className={cn(
+ 'w-[140px] rounded-[8px]',
+ hasChanges ? 'bg-primary hover:bg-primary/90' : ''
+ )}
+ size='sm'
*style:* Inconsistent button sizing - Cancel and Delete buttons use
size='default' with h-9 override, but Save button uses size='sm'. Should
use size='default' for consistency.
⬇️ Suggested change
- size='sm'
+ size='default'
Prompt To Fix With AI
This is a comment left during a code review.
Path: apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx
Line: 592:592
Comment:**style:** Inconsistent button sizing - Cancel and Delete buttons use `size='default'` with `h-9` override, but Save button uses `size='sm'`. Should use `size='default'` for consistency.
```suggestion size='default'```
How can I resolve this? If you propose a fix, please make it concise.
------------------------------
In
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx
<#1722 (comment)>:
> + {isSaving && (
+ <div className='h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' />
+ )}
{isSaving ? 'Saving...' : 'Save Changes'}
*style:* Spinner shows without margin when saving, causing it to appear
directly next to text. Add mr-2 class for spacing.
⬇️ Suggested change
- {isSaving && (
- <div className='h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' />
- )}
- {isSaving ? 'Saving...' : 'Save Changes'}
+ {isSaving && (
+ <div className='mr-2 h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' />
+ )}
Prompt To Fix With AI
This is a comment left during a code review.
Path: apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/sub-block/components/schedule/components/schedule-modal.tsx
Line: 594:597
Comment:**style:** Spinner shows without margin when saving, causing it to appear directly next to text. Add `mr-2` class for spacing.
```suggestion {isSaving && ( <div className='mr-2 h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' /> )}```
How can I resolve this? If you propose a fix, please make it concise.
—
Reply to this email directly, view it on GitHub
<#1722 (review)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/BU4CU7IQA5U6MTRQMTSRWUL3ZFBEDAVCNFSM6AAAAACKBTUQL2VHI2DSMVQWIX3LMV43YUDVNRWFEZLROVSXG5CSMV3GSZLXHMZTGNZSG43TEMZYG4>
.
You are receiving this because you are subscribed to this thread.Message
ID: ***@***.***>
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
fix UI bug with schedule modal
Type of Change
Testing
Tested manually.
Checklist