Skip to content

Commit

Permalink
Fixes for v2.20 (#1712)
Browse files Browse the repository at this point in the history 
* Remove mono-font from workflow status

* Show negative count on refresh workflows button

* Don't stringify on copy of code-block

* Remove all labs mode guards and remove labs mode icon in side-nav

* Update snaps

* Remove advanced vis tests that are no longer applicable due to new search

* Fix testid prop on toggle, fix playwright tests

* Remove commented out line
  • Loading branch information
@Alex-Tideman
Alex-Tideman authored Oct 30, 2023
1 parent c792d1e commit d71dd4b
Show file tree
Hide file tree
Showing 14 changed files with 123 additions and 429 deletions.
22 changes: 11 additions & 11 deletions src/lib/components/side-nav.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,22 +10,22 @@
import NavTooltip from '$lib/holocene/navigation/nav-tooltip.svelte';
import { translate } from '$lib/i18n/translate';
import { inProgressBatchOperation } from '$lib/stores/batch-operations';
import { labsMode } from '$lib/stores/labs-mode';
// import { labsMode } from '$lib/stores/labs-mode';
import type { DescribeNamespaceResponse as Namespace } from '$types';
export let isCloud = false;
export let activeNamespace: Namespace;
export let linkList: Partial<Record<string, string>>;
$: labsHoverText = `${translate('common.labs')} ${
$labsMode
? `${translate('common.on')} - ${translate('common.experimental')}`
: translate('common.off')
}`;
$: labsText = `${translate('common.labs')} ${
$labsMode ? translate('common.on') : translate('common.off')
}`;
// $: labsHoverText = `${translate('common.labs')} ${
// $labsMode
// ? `${translate('common.on')} - ${translate('common.experimental')}`
// : translate('common.off')
// }`;
// $: labsText = `${translate('common.labs')} ${
// $labsMode ? translate('common.on') : translate('common.off')
// }`;
let batchOperationIcon: 'layers-1' | 'layers-2' | 'layers-3' = 'layers-3';
Expand Down Expand Up @@ -142,7 +142,7 @@
<div class="nav-title">{translate('common.feedback')}</div>
</NavRow>
</slot>
<NavRow {isCloud} handleClick={() => ($labsMode = !$labsMode)}>
<!-- <NavRow {isCloud} handleClick={() => ($labsMode = !$labsMode)}>
<NavTooltip right text={labsHoverText}>
<div class="nav-icon">
<Icon name="labs" active={$labsMode} />
Expand All @@ -156,7 +156,7 @@
</p>
{/if}
</div>
</NavRow>
</NavRow> -->
</svelte:fragment>
</NavContainer>

Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/workflow-status.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@
data-testid={$$props['test-id']}
>
<span
class="flex items-center gap-1 font-mono font-medium {workflowStatus({
class="flex items-center gap-1 font-medium {workflowStatus({
status,
})}"
class:rounded-r-none={newCount}
Expand Down
196 changes: 95 additions & 101 deletions src/lib/components/workflow/dropdown-filter/workflow-datetime-filter.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
import Button from '$lib/holocene/button.svelte';
import DatePicker from '$lib/holocene/date-picker.svelte';
import Icon from '$lib/holocene/icon/icon.svelte';
import LabsModeGuard from '$lib/holocene/labs-mode-guard.svelte';
import {
Menu,
MenuButton,
Expand Down Expand Up @@ -174,106 +173,101 @@
</script>

<div class="flex items-start">
<LabsModeGuard>
<svelte:fragment slot="fallback">
<MenuContainer>
<MenuButton
id="time-range-filter"
hasIndicator
controls="time-range-filter-menu"
>
{value}
</MenuButton>
<Menu
class="w-[25rem] !overflow-visible"
position="right"
keepOpen
id="time-range-filter-menu"
>
{#if custom}
<div class="flex flex-col gap-2 p-2">
<DatePicker
label={translate('common.start')}
on:datechange={onStartDateChange}
selected={startDate}
todayLabel={translate('common.today')}
closeLabel={translate('common.close')}
clearLabel={translate('common.clear-input-button-label')}
/>
<TimePicker
bind:hour={startHour}
bind:minute={startMinute}
bind:second={startSecond}
bind:half={startHalf}
/>
<DatePicker
label={translate('common.end')}
on:datechange={onEndDateChange}
selected={endDate}
todayLabel={translate('common.today')}
closeLabel={translate('common.close')}
clearLabel={translate('common.clear-input-button-label')}
/>
<TimePicker
bind:hour={endHour}
bind:minute={endMinute}
bind:second={endSecond}
bind:half={endHalf}
/>
<div class="flex gap-2">
<Button on:click={onApply}>{translate('common.apply')}</Button>
<Button variant="secondary" on:click={() => (custom = false)}
>{translate('common.cancel')}</Button
>
</div>
<MenuContainer>
<MenuButton
id="time-range-filter"
hasIndicator
controls="time-range-filter-menu"
>
{value}
</MenuButton>
<Menu
class="w-[25rem] !overflow-visible"
position="right"
keepOpen
id="time-range-filter-menu"
>
{#if custom}
<div class="flex flex-col gap-2 p-2">
<DatePicker
label={translate('common.start')}
on:datechange={onStartDateChange}
selected={startDate}
todayLabel={translate('common.today')}
closeLabel={translate('common.close')}
clearLabel={translate('common.clear-input-button-label')}
/>
<TimePicker
bind:hour={startHour}
bind:minute={startMinute}
bind:second={startSecond}
bind:half={startHalf}
/>
<DatePicker
label={translate('common.end')}
on:datechange={onEndDateChange}
selected={endDate}
todayLabel={translate('common.today')}
closeLabel={translate('common.close')}
clearLabel={translate('common.clear-input-button-label')}
/>
<TimePicker
bind:hour={endHour}
bind:minute={endMinute}
bind:second={endSecond}
bind:half={endHalf}
/>
<div class="flex gap-2">
<Button on:click={onApply}>{translate('common.apply')}</Button>
<Button variant="secondary" on:click={() => (custom = false)}
>{translate('common.cancel')}</Button
>
</div>
</div>
{:else}
<div class="flex w-full flex-wrap">
<div class="flex w-1/2 flex-col border-b border-gray-300">
<MenuItem on:click={() => onChange('All Time')}
>{translate('common.all-time')}</MenuItem
>
</div>
<div class="flex w-1/2 flex-col border-b border-gray-300">
<MenuItem on:click={() => onChange('Custom')}
>{translate('common.custom')}</MenuItem
>
</div>
{#each columnOrderedDurations as duration}
<div class="flex w-1/2 flex-col justify-center">
<MenuItem on:click={() => onChange(duration)}>{duration}</MenuItem
>
</div>
{:else}
<div class="flex w-full flex-wrap">
<div class="flex w-1/2 flex-col border-b border-gray-300">
<MenuItem on:click={() => onChange('All Time')}
>{translate('common.all-time')}</MenuItem
>
</div>
<div class="flex w-1/2 flex-col border-b border-gray-300">
<MenuItem on:click={() => onChange('Custom')}
>{translate('common.custom')}</MenuItem
>
</div>
{#each columnOrderedDurations as duration}
<div class="flex w-1/2 flex-col justify-center">
<MenuItem on:click={() => onChange(duration)}
>{duration}</MenuItem
>
</div>
{/each}
<div class="flex w-full flex-wrap">
<div class="flex w-1/2 flex-col border-t border-gray-300">
<MenuItem
selected={timeField === 'StartTime'}
on:click={() => onTimeFieldChange('StartTime')}
>
{translate('common.start-time')}
</MenuItem>
</div>
<div class="flex w-1/2 flex-col border-t border-gray-300">
<MenuItem
selected={timeField === 'CloseTime'}
on:click={() => onTimeFieldChange('CloseTime')}
>
{translate('common.end-time')}
</MenuItem>
</div>
</div>
{/each}
<div class="flex w-full flex-wrap">
<div class="flex w-1/2 flex-col border-t border-gray-300">
<MenuItem
selected={timeField === 'StartTime'}
on:click={() => onTimeFieldChange('StartTime')}
>
{translate('common.start-time')}
</MenuItem>
</div>
{/if}
<MenuDivider />
<MenuItem centered disabled>
<Icon name="clock" aria-hidden="true" />
{translate('common.based-on-time-preface')}
{localTime}
</MenuItem>
</Menu>
</MenuContainer>
</svelte:fragment>
</LabsModeGuard>
<div class="flex w-1/2 flex-col border-t border-gray-300">
<MenuItem
selected={timeField === 'CloseTime'}
on:click={() => onTimeFieldChange('CloseTime')}
>
{translate('common.end-time')}
</MenuItem>
</div>
</div>
</div>
{/if}
<MenuDivider />
<MenuItem centered disabled>
<Icon name="clock" aria-hidden="true" />
{translate('common.based-on-time-preface')}
{localTime}
</MenuItem>
</Menu>
</MenuContainer>
</div>
1 change: 1 addition & 0 deletions src/lib/components/workflow/filter-search/index.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -204,6 +204,7 @@
</div>
{/if}
<ToggleSwitch
data-testid="manual-search-toggle"
label={translate('workflows.view-search-input')}
labelPosition="left"
id="view-search-input"
Expand Down
2 changes: 2 additions & 0 deletions src/lib/components/workflow/workflow-count-refresh.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,5 +14,7 @@
>
{#if count > 0}
+{count.toLocaleString()}
{:else if count < 0}
{count.toLocaleString()}
{/if}
</Button>
20 changes: 1 addition & 19 deletions src/lib/components/workflow/workflows-summary-configurable-table/table-header-cell.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,4 @@
<script lang="ts">
import TextFilter from '$lib/components/workflow/dropdown-filter/text-filter.svelte';
import ExecutionStatusDropdownFilter from '$lib/components/workflow/dropdown-filter/workflow-status.svelte';
import LabsModeGuard from '$lib/holocene/labs-mode-guard.svelte';
import type { WorkflowHeader } from '$lib/stores/workflow-table-columns';
export let column: WorkflowHeader;
Expand All @@ -13,22 +10,7 @@
class="workflows-summary-table-header-cell"
data-testid="workflows-summary-table-header-cell-{label}"
>
<LabsModeGuard>
<svelte:fragment slot="fallback">
{#if label === 'Status'}
<ExecutionStatusDropdownFilter />
{:else if label === 'Workflow ID'}
<TextFilter attribute="WorkflowId" />
{:else if label === 'Run ID'}
<TextFilter attribute="RunId" />
{:else if label === 'Type'}
<TextFilter attribute="WorkflowType" />
{:else}
{label}
{/if}
</svelte:fragment>
{label}
</LabsModeGuard>
{label}
</th>

<style lang="postcss">
Expand Down
2 changes: 1 addition & 1 deletion ...low/workflows-summary-configurable-table/tests/__snapshots__/table-body-cell.test.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ exports[`Table_body_cell$ > Start renders 1`] = `"<td class=\\"workflows-summary
exports[`Table_body_cell$ > State Transitions renders 1`] = `"<td class=\\"workflows-summary-table-body-cell svelte-qupenl\\" data-testid=\\"workflows-summary-table-body-cell\\">12</td>"`;
exports[`Table_body_cell$ > Status renders 1`] = `"<td class=\\"workflows-summary-table-body-cell svelte-qupenl\\" data-testid=\\"workflows-summary-table-body-cell\\"><div class=\\"relative flex items-center gap-0 text-center text-sm leading-4\\"><span class=\\"flex items-center gap-1 font-mono font-medium rounded-sm px-1 py-0.5 font-secondary whitespace-nowrap bg-blue-100 text-blue-700\\"> Running <div class=\\"heart-beat svelte-8dynez\\" style=\\"--animation-delay:0ms;\\"><div class=\\"heart-rate svelte-8dynez\\"><svg version=\\"1.0\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" x=\\"0px\\" y=\\"0px\\" width=\\"30px\\" height=\\"18px\\" viewBox=\\"0 0 150 73\\" enable-background=\\"new 0 0 150 73\\" xml:space=\\"preserve\\" aria-hidden=\\"true\\" focusable=\\"false\\"><polyline fill=\\"none\\" stroke=\\"#1D4ED8\\" stroke-width=\\"3\\" stroke-miterlimit=\\"10\\" points=\\"0,45.486 18.514,45.486 24.595,33.324 32.676,45.486 37.771,45.486 42.838,55.622 51.959,18 56.067,45 60.067,60.729 63.122,45.486 77.297,45.486 83.379,41.419 90.473,45.486 100,45.486\\"></polyline></svg> <div class=\\"fade-in svelte-8dynez\\"></div> <div class=\\"fade-out svelte-8dynez\\"></div></div> </div></span> </div></td>"`;
exports[`Table_body_cell$ > Status renders 1`] = `"<td class=\\"workflows-summary-table-body-cell svelte-qupenl\\" data-testid=\\"workflows-summary-table-body-cell\\"><div class=\\"relative flex items-center gap-0 text-center text-sm leading-4\\"><span class=\\"flex items-center gap-1 font-medium rounded-sm px-1 py-0.5 font-secondary whitespace-nowrap bg-blue-100 text-blue-700\\"> Running <div class=\\"heart-beat svelte-8dynez\\" style=\\"--animation-delay:0ms;\\"><div class=\\"heart-rate svelte-8dynez\\"><svg version=\\"1.0\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" x=\\"0px\\" y=\\"0px\\" width=\\"30px\\" height=\\"18px\\" viewBox=\\"0 0 150 73\\" enable-background=\\"new 0 0 150 73\\" xml:space=\\"preserve\\" aria-hidden=\\"true\\" focusable=\\"false\\"><polyline fill=\\"none\\" stroke=\\"#1D4ED8\\" stroke-width=\\"3\\" stroke-miterlimit=\\"10\\" points=\\"0,45.486 18.514,45.486 24.595,33.324 32.676,45.486 37.771,45.486 42.838,55.622 51.959,18 56.067,45 60.067,60.729 63.122,45.486 77.297,45.486 83.379,41.419 90.473,45.486 100,45.486\\"></polyline></svg> <div class=\\"fade-in svelte-8dynez\\"></div> <div class=\\"fade-out svelte-8dynez\\"></div></div> </div></span> </div></td>"`;
exports[`Table_body_cell$ > Task Queue renders 1`] = `"<td class=\\"workflows-summary-table-body-cell svelte-qupenl\\" data-testid=\\"workflows-summary-table-body-cell\\">task-queue</td>"`;
Expand Down
Loading

1 comment on commit d71dd4b

@vercel
Copy link

@vercel vercel bot commented on d71dd4b Oct 30, 2023

Choose a reason for hiding this comment

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

Successfully deployed to the following URLs:

holocene – ./

holocene-git-main.preview.thundergun.io
holocene.preview.thundergun.io

Please sign in to comment.