Highlight the secondary sort value as well

notV3NOM · Jan 24, 2024 · 8d5c5d2 · 8d5c5d2
1 parent 55aa94a
commit 8d5c5d2
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 14 deletions.
diff --git a/apps/frontend/src/app/Components/Character/StatDisplayComponent.tsx b/apps/frontend/src/app/Components/Character/StatDisplayComponent.tsx
@@ -48,7 +48,12 @@ export default function StatDisplayComponent({
     <Box sx={{ mr: -1, mb: -1 }}>
       <Masonry columns={{ xs: 1, sm: 2, md: 3, xl: 4 }} spacing={1}>
         {sections.map(([key, Nodes]) => (
-          <Section key={key} displayNs={Nodes} sectionKey={key} />
+          <Section
+            key={key}
+            displayNs={Nodes}
+            sectionKey={key}
+            sortBase={sortOptions?.sortBase}
+          />
         ))}
       </Masonry>
     </Box>
@@ -58,9 +63,11 @@ export default function StatDisplayComponent({
 function Section({
   displayNs,
   sectionKey,
+  sortBase,
 }: {
   displayNs: DisplaySub<NodeDisplay>
   sectionKey: string
+  sortBase: string[]
 }) {
   const optimizationTarget = useContext(OptimizationTargetContext)
   const { data, oldData } = useContext(DataContext)
@@ -100,6 +107,9 @@ function Section({
               JSON.stringify(optimizationTarget) ===
               JSON.stringify([sectionKey, nodeKey])
             }
+            secondaryEmphasize={
+              JSON.stringify(sortBase) === JSON.stringify([sectionKey, nodeKey])
+            }
           />
         ))}
       </FieldDisplayList>

diff --git a/apps/frontend/src/app/Components/FieldDisplay.tsx b/apps/frontend/src/app/Components/FieldDisplay.tsx
@@ -97,11 +97,13 @@ export function NodeFieldDisplay({
   oldValue,
   component,
   emphasize,
+  secondaryEmphasize,
 }: {
   node: NodeDisplay
   oldValue?: number
   component?: React.ElementType
   emphasize?: boolean
+  secondaryEmphasize?: boolean
 }) {
   const { data } = useContext(DataContext)
   const { setFormulaData } = useContext(FormulaDataContext)
@@ -142,7 +144,11 @@ export function NodeFieldDisplay({
         display: 'flex',
         justifyContent: 'space-between',
         gap: 1,
-        boxShadow: emphasize ? '0px 0px 0px 2px red inset' : undefined,
+        boxShadow: emphasize
+          ? '0px 0px 0px 2px red inset'
+          : secondaryEmphasize
+          ? '0px 0px 0px 2px yellow inset'
+          : undefined,
       }}
       component={component}
     >

diff --git a/apps/frontend/src/app/PageArtifact/ArtifactEditor.tsx b/apps/frontend/src/app/PageArtifact/ArtifactEditor.tsx
@@ -796,18 +796,16 @@ export default function ArtifactEditor({
               )}
             </Grid>
             <Grid item>
-              {process.env.NODE_ENV === 'development' && (
-                <Button
-                  color="info"
-                  startIcon={<Shuffle />}
-                  onClick={() =>
-                    artifactDispatch({
-                      type: 'overwrite',
-                      artifact: randomizeArtifact(),
-                    })
-                  }
-                >{t`editor.btnRandom`}</Button>
-              )}
+              <Button
+                color="info"
+                startIcon={<Shuffle />}
+                onClick={() =>
+                  artifactDispatch({
+                    type: 'overwrite',
+                    artifact: randomizeArtifact(),
+                  })
+                }
+              >{t`editor.btnRandom`}</Button>
             </Grid>
             {old && oldType !== 'edit' && (
               <Grid item>