diff options
author | 2023-08-31 15:38:12 +0200 | |
---|---|---|
committer | 2023-08-31 15:52:30 +0200 | |
commit | 4ba22718cce29f784f97e8a74733e53e15a1e4e4 (patch) | |
tree | 714240e902eb2843d94035eb377e3c38ddac95f1 /subprojects | |
parent | refactor(frontend): compact relation table (diff) | |
download | refinery-4ba22718cce29f784f97e8a74733e53e15a1e4e4.tar.gz refinery-4ba22718cce29f784f97e8a74733e53e15a1e4e4.tar.zst refinery-4ba22718cce29f784f97e8a74733e53e15a1e4e4.zip |
refactor(frontend): secondary pane switch shortcut
Diffstat (limited to 'subprojects')
-rw-r--r-- | subprojects/frontend/src/PaneButtons.tsx | 4 | ||||
-rw-r--r-- | subprojects/frontend/src/TopBar.tsx | 11 | ||||
-rw-r--r-- | subprojects/frontend/src/theme/ThemeStore.ts | 4 |
3 files changed, 12 insertions, 7 deletions
diff --git a/subprojects/frontend/src/PaneButtons.tsx b/subprojects/frontend/src/PaneButtons.tsx index 9df56baa..7e884ab0 100644 --- a/subprojects/frontend/src/PaneButtons.tsx +++ b/subprojects/frontend/src/PaneButtons.tsx | |||
@@ -110,7 +110,7 @@ function PaneButtons({ | |||
110 | selected={themeStore.showGraph} | 110 | selected={themeStore.showGraph} |
111 | onClick={(event) => { | 111 | onClick={(event) => { |
112 | if (event.shiftKey || event.ctrlKey) { | 112 | if (event.shiftKey || event.ctrlKey) { |
113 | themeStore.setSelectedPane('graph'); | 113 | themeStore.setSelectedPane('graph', event.shiftKey); |
114 | } else { | 114 | } else { |
115 | themeStore.toggleGraph(); | 115 | themeStore.toggleGraph(); |
116 | } | 116 | } |
@@ -124,7 +124,7 @@ function PaneButtons({ | |||
124 | selected={themeStore.showTable} | 124 | selected={themeStore.showTable} |
125 | onClick={(event) => { | 125 | onClick={(event) => { |
126 | if (event.shiftKey || event.ctrlKey) { | 126 | if (event.shiftKey || event.ctrlKey) { |
127 | themeStore.setSelectedPane('table'); | 127 | themeStore.setSelectedPane('table', event.shiftKey); |
128 | } else { | 128 | } else { |
129 | themeStore.toggleTable(); | 129 | themeStore.toggleTable(); |
130 | } | 130 | } |
diff --git a/subprojects/frontend/src/TopBar.tsx b/subprojects/frontend/src/TopBar.tsx index cfeab6d7..867a24a0 100644 --- a/subprojects/frontend/src/TopBar.tsx +++ b/subprojects/frontend/src/TopBar.tsx | |||
@@ -101,10 +101,15 @@ export default observer(function TopBar(): JSX.Element { | |||
101 | py: 0.5, | 101 | py: 0.5, |
102 | }} | 102 | }} |
103 | > | 103 | > |
104 | <Typography variant="h6" component="h1" flexGrow={1}> | 104 | <Typography variant="h6" component="h1"> |
105 | Refinery {import.meta.env.DEV && <DevModeBadge>Dev</DevModeBadge>} | 105 | Refinery {import.meta.env.DEV && <DevModeBadge>Dev</DevModeBadge>} |
106 | </Typography> | 106 | </Typography> |
107 | {medium && ( | 107 | <Stack direction="row" alignItems="center" flexGrow={1} marginLeft={1}> |
108 | {medium && !large && ( | ||
109 | <PaneButtons themeStore={themeStore} hideLabel /> | ||
110 | )} | ||
111 | </Stack> | ||
112 | {large && ( | ||
108 | <Stack | 113 | <Stack |
109 | direction="row" | 114 | direction="row" |
110 | alignItems="center" | 115 | alignItems="center" |
@@ -116,7 +121,7 @@ export default observer(function TopBar(): JSX.Element { | |||
116 | transform: 'translateX(-50%)', | 121 | transform: 'translateX(-50%)', |
117 | }} | 122 | }} |
118 | > | 123 | > |
119 | <PaneButtons themeStore={themeStore} hideLabel={!large} /> | 124 | <PaneButtons themeStore={themeStore} /> |
120 | </Stack> | 125 | </Stack> |
121 | )} | 126 | )} |
122 | <Stack | 127 | <Stack |
diff --git a/subprojects/frontend/src/theme/ThemeStore.ts b/subprojects/frontend/src/theme/ThemeStore.ts index fa47d873..12449b94 100644 --- a/subprojects/frontend/src/theme/ThemeStore.ts +++ b/subprojects/frontend/src/theme/ThemeStore.ts | |||
@@ -91,8 +91,8 @@ export default class ThemeStore { | |||
91 | return 'code'; | 91 | return 'code'; |
92 | } | 92 | } |
93 | 93 | ||
94 | setSelectedPane(pane: SelectedPane): void { | 94 | setSelectedPane(pane: SelectedPane, keepCode = true): void { |
95 | this.showCode = pane === 'code'; | 95 | this.showCode = pane === 'code' || (keepCode && this.showCode); |
96 | this.showGraph = pane === 'graph'; | 96 | this.showGraph = pane === 'graph'; |
97 | this.showTable = pane === 'table'; | 97 | this.showTable = pane === 'table'; |
98 | } | 98 | } |