Skip to content

Commit

Permalink
Frontend: Settings: Add stories for drawer mode
Browse files Browse the repository at this point in the history 
Signed-off-by: Vincent T <[email protected]>
  • Loading branch information
@vyncent-t
vyncent-t committed Dec 10, 2024
1 parent 0271ea9 commit 762e71d
Show file tree
Hide file tree
Showing 3 changed files with 389 additions and 0 deletions.
43 changes: 43 additions & 0 deletions frontend/src/components/App/Settings/__snapshots__/Settings.General.stories.storyshot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -151,6 +151,49 @@
</button>
</div>
</dd>
<dt
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-4 css-trrd7p-MuiGrid-root"
>
Details on list view
</dt>
<dd
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-8 css-deb4a-MuiGrid-root"
>
<label
class="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd css-j204z7-MuiFormControlLabel-root"
>
<span
class="MuiSwitch-root MuiSwitch-sizeMedium css-julti5-MuiSwitch-root"
>
<span
class="MuiButtonBase-root MuiSwitch-switchBase MuiSwitch-colorPrimary PrivateSwitchBase-root MuiSwitch-switchBase MuiSwitch-colorPrimary css-1nsozxe-MuiButtonBase-root-MuiSwitch-switchBase"
>
<input
class="PrivateSwitchBase-input MuiSwitch-input css-1m9pwf3"
name="drawerMode"
type="checkbox"
/>
<span
class="MuiSwitch-thumb css-jsexje-MuiSwitch-thumb"
/>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</span>
<span
class="MuiSwitch-track css-1yjjitx-MuiSwitch-track"
/>
</span>
<span
class="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label css-1ezega9-MuiTypography-root"
>
Drawer Mode
<div
class="MuiContainer-root MuiContainer-maxWidthLg css-64uahr-MuiContainer-root"
/>
</span>
</label>
</dd>
<dt
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-4 css-trrd7p-MuiGrid-root"
>
Expand Down
329 changes: 329 additions & 0 deletions frontend/src/components/App/Settings/__snapshots__/Settings.stories.storyshot
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,329 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Storyshots Settings General 1`] = `
<div>
<button
class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeSmall MuiButton-textSizeSmall MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeSmall MuiButton-textSizeSmall css-w7fpvq-MuiButtonBase-root-MuiButton-root"
tabindex="0"
type="button"
>
<span
class="MuiButton-startIcon MuiButton-iconSizeSmall css-y6rp3m-MuiButton-startIcon"
>
<span />
</span>
<p
class="MuiTypography-root MuiTypography-body1 css-1ezega9-MuiTypography-root"
style="padding-top: 3px;"
>
Back
</p>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</button>
<div
class="MuiBox-root css-j1fy4m"
>
<div
class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 makeStyles-sectionHeader makeStyles-sectionHeader css-6ejd34-MuiGrid-root"
>
<div
class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
>
<div
class="MuiBox-root css-70qvj9"
>
<h1
class="MuiTypography-root MuiTypography-h1 MuiTypography-noWrap makeStyles-sectionTitle makeStyles-sectionTitle css-1f1i6v9-MuiTypography-root"
>
General Settings
</h1>
<div
class="MuiBox-root css-ldp2l3"
/>
</div>
</div>
<div
class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
>
<div
class="MuiGrid-root MuiGrid-container MuiGrid-item css-43x3z6-MuiGrid-root"
>
<div
class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
>
<button
aria-label="Version"
class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-whz9ym-MuiButtonBase-root-MuiIconButton-root"
data-mui-internal-clone-element="true"
tabindex="0"
type="button"
>
<span />
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</button>
</div>
</div>
</div>
</div>
<div
class="MuiBox-root css-1txv3mw"
>
<dl
class="MuiGrid-root MuiGrid-container makeStyles-table css-11lq3yg-MuiGrid-root"
>
<dt
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-4 makeStyles-metadataNameCell css-1r6indk-MuiGrid-root"
>
Language
</dt>
<dd
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-8 makeStyles-metadataCell makeStyles-valueCol css-r0umuq-MuiGrid-root"
>
<div
class="MuiFormControl-root css-k2e4wk-MuiFormControl-root"
>
<div
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-colorPrimary MuiInputBase-formControl css-zghmfh-MuiInputBase-root-MuiInput-root-MuiSelect-root"
>
<div
aria-controls="under-test"
aria-expanded="false"
aria-haspopup="listbox"
aria-label="Select locale"
class="MuiSelect-select MuiSelect-standard MuiInputBase-input MuiInput-input css-1rxz5jq-MuiSelect-select-MuiInputBase-input-MuiInput-input"
role="combobox"
tabindex="0"
>
English
</div>
<input
aria-controls="under-test"
aria-hidden="true"
aria-invalid="false"
class="MuiSelect-nativeInput css-yf8vq0-MuiSelect-nativeInput"
tabindex="-1"
value="en"
/>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSelect-icon MuiSelect-iconStandard css-pqjvzy-MuiSvgIcon-root-MuiSelect-icon"
data-testid="ArrowDropDownIcon"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M7 10l5 5 5-5z"
/>
</svg>
</div>
</div>
</dd>
<dt
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-4 makeStyles-metadataNameCell css-1r6indk-MuiGrid-root"
>
Theme
</dt>
<dd
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-8 makeStyles-metadataCell makeStyles-valueCol css-r0umuq-MuiGrid-root"
>
<div
class="MuiButtonGroup-root MuiButtonGroup-outlined css-1b41vff-MuiButtonGroup-root"
role="group"
>
<button
aria-label="light theme"
class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeLarge MuiButton-containedSizeLarge MuiButtonGroup-grouped MuiButtonGroup-groupedHorizontal MuiButtonGroup-groupedOutlined MuiButtonGroup-groupedOutlinedHorizontal MuiButtonGroup-groupedOutlinedPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeLarge MuiButton-containedSizeLarge MuiButtonGroup-firstButton css-put5n8-MuiButtonBase-root-MuiButton-root"
tabindex="0"
type="button"
>
<span />
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</button>
<button
aria-label="dark theme"
class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeLarge MuiButton-outlinedSizeLarge MuiButtonGroup-grouped MuiButtonGroup-groupedHorizontal MuiButtonGroup-groupedOutlined MuiButtonGroup-groupedOutlinedHorizontal MuiButtonGroup-groupedOutlinedPrimary MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeLarge MuiButton-outlinedSizeLarge MuiButtonGroup-lastButton css-j5ggku-MuiButtonBase-root-MuiButton-root"
tabindex="0"
type="button"
>
<span />
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</button>
</div>
</dd>
<dt
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-4 makeStyles-metadataNameCell css-1r6indk-MuiGrid-root"
>
Drawer Mode
</dt>
<dd
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-8 makeStyles-metadataCell makeStyles-valueCol css-r0umuq-MuiGrid-root"
>
<label
class="MuiFormControlLabel-root"
>
<span
class="MuiSwitch-root"
>
<span
aria-disabled="false"
class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-1 MuiSwitch-switchBase MuiSwitch-colorPrimary"
>
<span
class="MuiIconButton-label"
>
<input
class="PrivateSwitchBase-input-4 MuiSwitch-input"
name="drawerMode"
type="checkbox"
value=""
/>
<span
class="MuiSwitch-thumb"
/>
</span>
<span
class="MuiTouchRipple-root"
/>
</span>
<span
class="MuiSwitch-track"
/>
</span>
<span
class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
>
Drawer Mode
</span>
</label>
</dd>
<dt
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-4 makeStyles-metadataNameCell css-1r6indk-MuiGrid-root"
>
Number of rows for tables
</dt>
<dd
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-8 makeStyles-metadataCell makeStyles-valueCol css-r0umuq-MuiGrid-root"
>
<div
class="MuiFormControl-root css-1nrlq1o-MuiFormControl-root"
>
<div
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-colorPrimary MuiInputBase-formControl css-zghmfh-MuiInputBase-root-MuiInput-root-MuiSelect-root"
style="width: 100px;"
>
<div
aria-controls="mui-50"
aria-expanded="false"
aria-haspopup="listbox"
class="MuiSelect-select MuiSelect-standard MuiInputBase-input MuiInput-input css-1rxz5jq-MuiSelect-select-MuiInputBase-input-MuiInput-input"
role="combobox"
tabindex="0"
>
15
</div>
<input
aria-hidden="true"
aria-invalid="false"
class="MuiSelect-nativeInput css-yf8vq0-MuiSelect-nativeInput"
tabindex="-1"
value="15"
/>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSelect-icon MuiSelect-iconStandard css-pqjvzy-MuiSvgIcon-root-MuiSelect-icon"
data-testid="ArrowDropDownIcon"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M7 10l5 5 5-5z"
/>
</svg>
</div>
</div>
</dd>
<dt
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-4 makeStyles-metadataLast makeStyles-metadataNameCell css-1r6indk-MuiGrid-root"
>
Timezone to display for dates
</dt>
<dd
class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-8 makeStyles-metadataLast makeStyles-metadataCell makeStyles-valueCol css-r0umuq-MuiGrid-root"
>
<div
class="MuiBox-root css-10rqxfs"
>
<div
class="MuiAutocomplete-root MuiAutocomplete-hasPopupIcon css-1h51icj-MuiAutocomplete-root"
>
<div
class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root css-wb57ya-MuiFormControl-root-MuiTextField-root"
>
<label
class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-standard MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-standard css-zh08sj-MuiFormLabel-root-MuiInputLabel-root"
data-shrink="false"
for="cluster-selector-autocomplete"
id="cluster-selector-autocomplete-label"
>
Timezone
</label>
<div
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd MuiAutocomplete-inputRoot css-15ywaty-MuiInputBase-root-MuiInput-root"
>
<input
aria-autocomplete="both"
aria-expanded="false"
aria-invalid="false"
autocapitalize="none"
autocomplete="off"
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-1x51dt5-MuiInputBase-input-MuiInput-input"
id="cluster-selector-autocomplete"
role="combobox"
spellcheck="false"
type="text"
value=""
/>
<div
class="MuiAutocomplete-endAdornment css-1q60rmi-MuiAutocomplete-endAdornment"
>
<button
aria-label="Open"
class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium MuiAutocomplete-popupIndicator css-1aav1nn-MuiButtonBase-root-MuiIconButton-root-MuiAutocomplete-popupIndicator"
tabindex="-1"
title="Open"
type="button"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
data-testid="ArrowDropDownIcon"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M7 10l5 5 5-5z"
/>
</svg>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</button>
</div>
</div>
</div>
</div>
</div>
</dd>
</dl>
</div>
</div>
</div>
`;
Loading

0 comments on commit 762e71d

Please sign in to comment.