Skip to content

Commit 28b4160

Browse files
waleedlatif1waleedlatif1
authored
improvement(subblocks): fixed trigger save, schedule save, time inp, text subblocks and schedule/workflow badges, can now deploy from the badge itself (#1868)
1 parent d0720b8 commit 28b4160

File tree

7 files changed

+255
-249
lines changed

7 files changed

+255
-249
lines changed

‎apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel-new/components/editor/components/sub-block/components/schedule-save/schedule-save.tsx‎

Lines changed: 18 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
2-
import { AlertCircle, Check, Save, Trash2 } from 'lucide-react'
32
import { useParams } from 'next/navigation'
4-
import { Tooltip } from '@/components/emcn/components/tooltip/tooltip'
3+
import { Button } from '@/components/emcn/components'
4+
import { Trash } from '@/components/emcn/icons/trash'
55
import { Alert, AlertDescription } from '@/components/ui/alert'
66
import {
77
AlertDialog,
@@ -13,8 +13,6 @@ import {
1313
AlertDialogHeader,
1414
AlertDialogTitle,
1515
} from '@/components/ui/alert-dialog'
16-
import { Badge } from '@/components/ui/badge'
17-
import { Button } from '@/components/ui/button'
1816
import { createLogger } from '@/lib/logs/console/logger'
1917
import { parseCronToHumanReadable } from '@/lib/schedules/utils'
2018
import { cn } from '@/lib/utils'
@@ -377,6 +375,7 @@ export function ScheduleSave({ blockId, isPreview = false, disabled = false }: S
377375
<div className='mt-2'>
378376
<div className='flex gap-2'>
379377
<Button
378+
variant='default'
380379
onClick={handleSave}
381380
disabled={disabled || isPreview || isSaving || saveStatus === 'saving' || isLoadingStatus}
382381
className={cn(
@@ -391,37 +390,22 @@ export function ScheduleSave({ blockId, isPreview = false, disabled = false }: S
391390
Saving...
392391
</>
393392
)}
394-
{saveStatus === 'saved' && (
395-
<>
396-
<Check className='mr-2 h-4 w-4' />
397-
Saved
398-
</>
399-
)}
400-
{saveStatus === 'idle' && (
401-
<>
402-
<Save className='mr-2 h-4 w-4' />
403-
{scheduleId ? 'Update Schedule' : 'Save Schedule'}
404-
</>
405-
)}
406-
{saveStatus === 'error' && (
407-
<>
408-
<AlertCircle className='mr-2 h-4 w-4' />
409-
Error
410-
</>
411-
)}
393+
{saveStatus === 'saved' && 'Saved'}
394+
{saveStatus === 'idle' && (scheduleId ? 'Update Schedule' : 'Save Schedule')}
395+
{saveStatus === 'error' && 'Error'}
412396
</Button>
413397

414398
{scheduleId && (
415399
<Button
400+
variant='default'
416401
onClick={() => setShowDeleteDialog(true)}
417402
disabled={disabled || isPreview || deleteStatus === 'deleting' || isSaving}
418-
variant='outline'
419-
className='h-9 rounded-[8px] px-3 text-destructive hover:bg-destructive/10'
403+
className='h-9 rounded-[8px] px-3'
420404
>
421405
{deleteStatus === 'deleting' ? (
422406
<div className='h-4 w-4 animate-spin rounded-full border-[1.5px] border-current border-t-transparent' />
423407
) : (
424-
<Trash2 className='h-4 w-4' />
408+
<Trash className='h-[14px] w-[14px]' />
425409
)}
426410
</Button>
427411
)}
@@ -442,54 +426,21 @@ export function ScheduleSave({ blockId, isPreview = false, disabled = false }: S
442426
</div>
443427
) : (
444428
<>
445-
<div className='flex items-center gap-2'>
446-
<Tooltip.Root>
447-
<Tooltip.Trigger asChild>
448-
<Badge
449-
variant='outline'
450-
className={cn(
451-
'flex cursor-pointer items-center gap-1 font-normal text-xs',
452-
scheduleStatus === 'disabled'
453-
? 'border-amber-200 bg-amber-50 text-amber-600 hover:bg-amber-100 dark:bg-amber-900/20 dark:text-amber-400'
454-
: 'border-green-200 bg-green-50 text-green-600 hover:bg-green-100 dark:bg-green-900/20 dark:text-green-400'
455-
)}
456-
onClick={handleToggleStatus}
457-
>
458-
<div className='relative mr-0.5 flex items-center justify-center'>
459-
<div
460-
className={cn(
461-
'absolute h-3 w-3 rounded-full',
462-
scheduleStatus === 'disabled' ? 'bg-amber-500/20' : 'bg-green-500/20'
463-
)}
464-
/>
465-
<div
466-
className={cn(
467-
'relative h-2 w-2 rounded-full',
468-
scheduleStatus === 'disabled' ? 'bg-amber-500' : 'bg-green-500'
469-
)}
470-
/>
471-
</div>
472-
{scheduleStatus === 'active' ? 'Active' : 'Disabled'}
473-
</Badge>
474-
</Tooltip.Trigger>
475-
<Tooltip.Content side='top' className='max-w-[300px]'>
476-
{scheduleStatus === 'disabled' ? (
477-
<p className='text-sm'>Click to reactivate this schedule</p>
478-
) : (
479-
<p className='text-sm'>Click to disable this schedule</p>
480-
)}
481-
</Tooltip.Content>
482-
</Tooltip.Root>
483-
{failedCount > 0 && (
429+
{failedCount > 0 && (
430+
<div className='flex items-center gap-2'>
484431
<span className='text-destructive text-sm'>
485432
⚠️ {failedCount} failed run{failedCount !== 1 ? 's' : ''}
486433
</span>
487-
)}
488-
</div>
434+
</div>
435+
)}
489436

490437
{savedCronExpression && (
491438
<p className='text-muted-foreground text-sm'>
492-
{parseCronToHumanReadable(savedCronExpression, scheduleTimezone || 'UTC')}
439+
Runs{' '}
440+
{parseCronToHumanReadable(
441+
savedCronExpression,
442+
scheduleTimezone || 'UTC'
443+
).toLowerCase()}
493444
</p>
494445
)}
495446

‎apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel-new/components/editor/components/sub-block/components/text/text.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -27,10 +27,10 @@ export function Text({ blockId, subBlockId, content, className }: TextProps) {
2727
return (
2828
<div
2929
id={`${blockId}-${subBlockId}`}
30-
className={`rounded-md border bg-card p-4 shadow-sm ${className || ''}`}
30+
className={`rounded-md border bg-[#232323] p-4 shadow-sm ${className || ''}`}
3131
>
3232
<div
33-
className='prose prose-sm dark:prose-invert max-w-none text-sm [&_a]:text-blue-600 [&_a]:underline [&_a]:hover:text-blue-700 [&_a]:dark:text-blue-400 [&_a]:dark:hover:text-blue-300 [&_code]:rounded [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:text-xs [&_strong]:font-semibold [&_ul]:ml-5 [&_ul]:list-disc'
33+
className='prose prose-sm dark:prose-invert max-w-none break-words text-sm [&_a]:text-blue-600 [&_a]:underline [&_a]:hover:text-blue-700 [&_a]:dark:text-blue-400 [&_a]:dark:hover:text-blue-300 [&_code]:rounded [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:text-xs [&_strong]:font-semibold [&_ul]:ml-5 [&_ul]:list-disc'
3434
dangerouslySetInnerHTML={{ __html: content }}
3535
/>
3636
</div>
@@ -40,7 +40,7 @@ export function Text({ blockId, subBlockId, content, className }: TextProps) {
4040
return (
4141
<div
4242
id={`${blockId}-${subBlockId}`}
43-
className={`whitespace-pre-wrap rounded-md border bg-card p-4 text-muted-foreground text-sm shadow-sm ${className || ''}`}
43+
className={`whitespace-pre-wrap break-words rounded-md border bg-[#232323] p-4 text-muted-foreground text-sm shadow-sm ${className || ''}`}
4444
>
4545
{content}
4646
</div>

‎apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel-new/components/editor/components/sub-block/components/time-input/time-input.tsx‎

Lines changed: 11 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,7 @@
11
'use client'
22

33
import * as React from 'react'
4-
import { Clock } from 'lucide-react'
5-
import { Button } from '@/components/ui/button'
6-
import { Input } from '@/components/ui/input'
7-
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
4+
import { Button, Input, Popover, PopoverContent, PopoverTrigger } from '@/components/emcn'
85
import { cn } from '@/lib/utils'
96
import { useSubBlockValue } from '@/app/workspace/[workspaceId]/w/[workflowId]/components/panel-new/components/editor/components/sub-block/hooks/use-sub-block-value'
107

@@ -91,18 +88,15 @@ export function TimeInput({
9188
}}
9289
>
9390
<PopoverTrigger asChild>
94-
<Button
95-
variant='outline'
96-
disabled={isPreview || disabled}
97-
className={cn(
98-
'w-full justify-start text-left font-normal',
99-
!value && 'text-muted-foreground',
100-
className
101-
)}
102-
>
103-
<Clock className='mr-1 h-4 w-4' />
104-
{value ? formatDisplayTime(value) : <span>{placeholder || 'Select time'}</span>}
105-
</Button>
91+
<div className='relative w-full cursor-pointer'>
92+
<Input
93+
readOnly
94+
disabled={isPreview || disabled}
95+
value={value ? formatDisplayTime(value) : ''}
96+
placeholder={placeholder || 'Select time'}
97+
className={cn('cursor-pointer', !value && 'text-muted-foreground', className)}
98+
/>
99+
</div>
106100
</PopoverTrigger>
107101
<PopoverContent className='w-auto p-4'>
108102
<div className='flex items-center space-x-2'>
@@ -129,7 +123,7 @@ export function TimeInput({
129123
}}
130124
type='text'
131125
/>
132-
<span>:</span>
126+
<span className='text-[#E6E6E6]'>:</span>
133127
<Input
134128
className='w-[4rem]'
135129
value={minute}

0 commit comments

Comments
 (0)