1
0
Fork 0

chore(shared): Take control into account in workbench view menu

This commit is contained in:
joostdecock 2023-10-04 20:31:40 +02:00
parent c8f43811b6
commit fc420160de
4 changed files with 120 additions and 81 deletions

View file

@ -35,6 +35,7 @@ docs: Documentation
draft: Draft
draftPattern: Draft pattern
edit: Edit
editByHand: Edit Manually
editCurrentMeasies: Edit Current Measurements
editCurrentMeasiesDesc: Changes you make here will not be saved to your measurements sets, and will only affect this pattern.
editCurrentMeasiesHeader: Edit Pattern Measurements
@ -47,7 +48,7 @@ exportAsData: Export as data
exportForEditing: Export for editing
exportForPrinting: Export for printing
exportPattern-txt: Export a PDF suitable for your printer, or download this pattern in a variety of formats
exportPattern: Export pattern
exportPattern: Export Pattern
fit: Fit
frontPockets: Front pockets
generatePdf: Generate print-ready PDF
@ -80,9 +81,11 @@ partTransfoYes: Show buttons
partTransfoYesDesc: Include these buttons on the pattern output (they will not be printed)
pathInfo: Path info
patternBookmarkCreated: Pattern bookmark created
patternEditor: Pattern Editor
patternInspector: Pattern Inspector
patternLogs: Pattern logs
patternLogs: Pattern Logs
patternSaved: Pattern saved
patternTests: Pattern Tests
pockets: Pockets
printLayout: Print Layout
printSettings.d: Configure your pattern so you can print it just the way you like it. Includes page size & orientation, margins, and more.

View file

@ -1,4 +1,5 @@
// __SDEFILE__ - This file is a dependency for the stand-alone environment
import { controlLevels } from 'shared/config/freesewing.config.mjs'
// Hooks
import { useState } from 'react'
import { useTranslation } from 'next-i18next'
@ -44,12 +45,14 @@ export const NavButton = ({
children,
onClick = false,
active = false,
extraClasses = 'lg:bg-neutral lg:text-neutral-content lg:hover:bg-secondary lg:hover:text-secondary-content hover:text-secondary',
extraClasses = 'lg:hover:bg-secondary lg:hover:text-secondary-content',
}) => {
const className = `w-full flex flex-row items-center px-4 py-2 ${extraClasses} ${
active ? 'text-secondary' : ''
active
? 'font-bold lg:font-normal bg-secondary bg-opacity-10 lg:bg-secondary lg:text-secondary-content lg:bg-opacity-50'
: 'lg:bg-neutral lg:text-neutral-content'
}`
const span = <span className="font-normal block grow text-left">{label}</span>
const span = <span className="block grow text-left">{label}</span>
return onClick ? (
<button {...{ onClick, className }} title={label}>
@ -64,7 +67,7 @@ export const NavButton = ({
)
}
const NavIcons = ({ setView, setDense, dense, view, saveAs = false }) => {
const NavIcons = ({ setView, setDense, dense, view, saveAs = false, control }) => {
const { t } = useTranslation(['header'])
const iconSize = 'h-6 w-6 grow-0'
@ -72,7 +75,7 @@ const NavIcons = ({ setView, setDense, dense, view, saveAs = false }) => {
<>
<NavButton
onClick={() => setDense(!dense)}
label={t('workbench:viewMenu')}
label=""
extraClasses="hidden lg:flex text-accent bg-neutral hover:bg-accent hover:text-neutral-content"
>
{dense ? (
@ -84,34 +87,42 @@ const NavIcons = ({ setView, setDense, dense, view, saveAs = false }) => {
<LeftIcon className={`${iconSize} animate-bounce-right`} stroke={4} />
)}
</NavButton>
<NavButton
onClick={() => setView('draft')}
label={t('workbench:configurePattern')}
active={view === 'draft'}
>
<OptionsIcon className={iconSize} />
</NavButton>
<NavButton
onClick={() => setView('measies')}
label={t('workbench:measies')}
active={view === 'measies'}
>
<MeasieIcon className={iconSize} />
</NavButton>
<NavButton
onClick={() => setView('test')}
label={t('workbench:testPattern')}
active={view === 'test'}
>
<BeakerIcon className={iconSize} />
</NavButton>
<NavButton
onClick={() => setView('print')}
label={t('workbench:printLayout')}
active={view === 'print'}
>
<PrintIcon className={iconSize} />
</NavButton>
{control >= controlLevels.views.draft && (
<NavButton
onClick={() => setView('draft')}
label={t('workbench:patternEditor')}
active={view === 'draft'}
>
<OptionsIcon className={iconSize} />
</NavButton>
)}
{control >= controlLevels.views.measies && (
<NavButton
onClick={() => setView('measies')}
label={t('workbench:measies')}
active={view === 'measies'}
>
<MeasieIcon className={iconSize} />
</NavButton>
)}
{control >= controlLevels.views.test && (
<NavButton
onClick={() => setView('test')}
label={t('workbench:patternTests')}
active={view === 'test'}
>
<BeakerIcon className={iconSize} />
</NavButton>
)}
{control >= controlLevels.views.print && (
<NavButton
onClick={() => setView('print')}
label={t('workbench:printLayout')}
active={view === 'print'}
>
<PrintIcon className={iconSize} />
</NavButton>
)}
{/*!isProduction && (
<NavButton
onClick={() => setView('cut')}
@ -121,53 +132,65 @@ const NavIcons = ({ setView, setDense, dense, view, saveAs = false }) => {
<CutIcon className={iconSize} />
</NavButton>
)*/}
<NavButton
onClick={() => setView('save')}
label={t(`workbench:${saveAs ? 'savePattern' : 'savePatternAsHellip'}`)}
active={view === 'save'}
>
{saveAs ? <SaveIcon className={iconSize} /> : <SaveAsIcon className={iconSize} />}
</NavButton>
<NavButton
onClick={() => setView('export')}
label={t('workbench:exportPattern')}
active={view === 'export'}
>
<ExportIcon className={iconSize} />
</NavButton>
<NavButton
onClick={() => setView('edit')}
label={t('workbench:editSettings')}
active={view === 'edit'}
>
<EditIcon className={iconSize} />
</NavButton>
<NavButton
onClick={() => setView('logs')}
label={t('workbench:patternLogs')}
active={view === 'logs'}
>
<CodeIcon className={iconSize} />
</NavButton>
<NavButton
onClick={() => setView('inspect')}
label={t('workbench:patternInspector')}
active={view === 'inspect'}
>
<XrayIcon className={iconSize} />
</NavButton>
<NavButton
onClick={() => setView('docs')}
label={t('workbench:docs')}
active={view === 'docs'}
>
<DocsIcon className={iconSize} />
</NavButton>
{control >= controlLevels.views.save && (
<NavButton
onClick={() => setView('save')}
label={t(`workbench:${saveAs ? 'savePattern' : 'savePatternAsHellip'}`)}
active={view === 'save'}
>
{saveAs ? <SaveIcon className={iconSize} /> : <SaveAsIcon className={iconSize} />}
</NavButton>
)}
{control >= controlLevels.views.export && (
<NavButton
onClick={() => setView('export')}
label={t('workbench:exportPattern')}
active={view === 'export'}
>
<ExportIcon className={iconSize} />
</NavButton>
)}
{control >= controlLevels.views.edit && (
<NavButton
onClick={() => setView('edit')}
label={t('workbench:editByHand')}
active={view === 'edit'}
>
<EditIcon className={iconSize} />
</NavButton>
)}{' '}
{control >= controlLevels.views.logs && (
<NavButton
onClick={() => setView('logs')}
label={t('workbench:patternLogs')}
active={view === 'logs'}
>
<CodeIcon className={iconSize} />
</NavButton>
)}
{control >= controlLevels.views.inspect && (
<NavButton
onClick={() => setView('inspect')}
label={t('workbench:patternInspector')}
active={view === 'inspect'}
>
<XrayIcon className={iconSize} />
</NavButton>
)}
{control >= controlLevels.views.docs && (
<NavButton
onClick={() => setView('docs')}
label={t('workbench:docs')}
active={view === 'docs'}
>
<DocsIcon className={iconSize} />
</NavButton>
)}
</>
)
}
export const WorkbenchHeader = ({ view, setView, saveAs = false }) => {
export const WorkbenchHeader = ({ view, setView, saveAs = false, control = 4 }) => {
const [dense, setDense] = useState(true)
return (
<MenuWrapper
@ -194,7 +217,7 @@ export const WorkbenchHeader = ({ view, setView, saveAs = false }) => {
flex flex-col
items-center w-full `}
>
<NavIcons {...{ setView, setDense, dense, view, saveAs }} />
<NavIcons {...{ setView, setDense, dense, view, saveAs, control }} />
</div>
</header>
</MenuWrapper>

View file

@ -167,7 +167,7 @@ export const Workbench = ({ design, Design, DynamicDocs, saveAs = false, preload
if (error)
return (
<>
<WorkbenchHeader {...{ view, setView, update }} />
<WorkbenchHeader {...{ view, setView, update }} control={account.control} />
{error}
<MobileMenubar />
</>
@ -241,7 +241,7 @@ export const Workbench = ({ design, Design, DynamicDocs, saveAs = false, preload
<>
{!ui.kiosk && <Header />}
<div className={`flex flex-row min-h-screen ${ui.kiosk ? kioskClasses : ''}`}>
<WorkbenchHeader {...{ view, setView, update, saveAs }} />
<WorkbenchHeader {...{ view, setView, update, saveAs }} control={account.control} />
<div className="grow">{viewContent}</div>
<MobileMenubar />
</div>

View file

@ -85,6 +85,18 @@ export const freeSewingConfig = {
renderer: 4,
kiosk: 2,
},
views: {
draft: 1,
measies: 1,
test: 3,
print: 1,
export: 1,
save: 1,
edit: 4,
logs: 2,
inspect: 4,
docs: 1,
},
},
social,
statuses: {
@ -117,4 +129,5 @@ export const controlLevels = {
patterns: freeSewingConfig.account.patterns,
core: freeSewingConfig.control.core,
ui: freeSewingConfig.control.ui,
views: freeSewingConfig.control.views,
}