-
Notifications
You must be signed in to change notification settings - Fork 5
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
2f17338
commit 0de3769
Showing
17 changed files
with
1,511 additions
and
76 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
46 changes: 2 additions & 44 deletions
46
app/layout/project/sidebar/scenario/grid-setup/features/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,49 +1,7 @@ | ||
| import { useRouter } from 'next/router'; | ||
|
|
||
| import { TABS } from 'layout/project/navigation/constants'; | ||
| import StepManager from 'layout/step-manager'; | ||
|
|
||
| import GridSetupFeaturesAdd from './add'; | ||
| import GridSetupFeaturesTargets from './targets'; | ||
| import GridSetupFeaturesTargets from './target-spf'; | ||
|
|
||
| export const GridSetupFeatures = (): JSX.Element => { | ||
| const { replace, query } = useRouter(); | ||
| const { pid, sid, tab } = query as { pid: string; sid: string; tab: string }; | ||
|
|
||
| return ( | ||
| <StepManager defaultStep={tab === TABS['scenario-features-targets-spf'] ? 1 : 0}> | ||
| {({ currentStep, onChangeStep }) => ( | ||
| <> | ||
| {currentStep === 0 && ( | ||
| <GridSetupFeaturesAdd | ||
| onContinue={() => { | ||
| onChangeStep(1); | ||
| // eslint-disable-next-line @typescript-eslint/no-floating-promises | ||
| replace( | ||
| `/projects/${pid}/scenarios/${sid}/edit?tab=${TABS['scenario-features-targets-spf']}`, | ||
| null, | ||
| { shallow: true } | ||
| ); | ||
| }} | ||
| /> | ||
| )} | ||
| {currentStep === 1 && ( | ||
| <GridSetupFeaturesTargets | ||
| onGoBack={() => { | ||
| onChangeStep(0); | ||
| // eslint-disable-next-line @typescript-eslint/no-floating-promises | ||
| replace( | ||
| `/projects/${pid}/scenarios/${sid}/edit?tab=${TABS['scenario-features']}`, | ||
| null, | ||
| { shallow: true } | ||
| ); | ||
| }} | ||
| /> | ||
| )} | ||
| </> | ||
| )} | ||
| </StepManager> | ||
| ); | ||
| return <GridSetupFeaturesTargets />; | ||
| }; | ||
|
|
||
| export default GridSetupFeatures; |
114 changes: 114 additions & 0 deletions
114
app/layout/project/sidebar/scenario/grid-setup/features/target-spf/all-targets/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,114 @@ | ||
| import { useState } from 'react'; | ||
|
|
||
| import Input from 'components/forms/input'; | ||
|
|
||
| const DEFAULT_INPUT_VALUES = { | ||
| target: 50, | ||
| spf: 1, | ||
| }; | ||
|
|
||
| const INPUT_CLASSES = | ||
| 'w-[55px] rounded-md border-solid border-gray-600 bg-gray-900 bg-opacity-100 px-0 py-1 text-center leading-tight'; | ||
|
|
||
| const AllTargetsSelector = ({ | ||
| onChangeAllTargets, | ||
| onChangeAllSPF, | ||
| }: { | ||
| onChangeAllTargets: (target: number) => void; | ||
| onChangeAllSPF: (spf: number) => void; | ||
| }): JSX.Element => { | ||
| const [values, setValues] = useState(DEFAULT_INPUT_VALUES); | ||
|
|
||
| return ( | ||
| <div className="flex justify-between rounded-lg bg-gray-700 px-[10px] py-[5px] text-sm"> | ||
| <span className="flex max-w-[115px] text-xs text-white"> | ||
| Set target and SPF in all features: | ||
| </span> | ||
| <div className="flex space-x-2"> | ||
| <div className="flex items-center space-x-2"> | ||
| <span>Target</span> | ||
| <Input | ||
| className={INPUT_CLASSES} | ||
| theme="dark" | ||
| mode="dashed" | ||
| type="number" | ||
| min={0} | ||
| max={100} | ||
| defaultValue={values.target} | ||
| value={values.target} | ||
| // disabled={!editable} | ||
| onChange={({ target: { value: inputValue } }) => { | ||
| setValues((prevValues) => ({ | ||
| ...prevValues, | ||
| target: Number(inputValue), | ||
| })); | ||
| }} | ||
| onKeyDownCapture={(event) => { | ||
| if (event.key === 'Enter') { | ||
| onChangeAllTargets(Number(values.target)); | ||
| } | ||
| }} | ||
| onBlur={() => { | ||
| // If user leaves the input empty, we'll revert to the original targetValue | ||
| console.log(values); | ||
| if (!values.target) { | ||
| return setValues((prevValues) => ({ | ||
| ...prevValues, | ||
| target: DEFAULT_INPUT_VALUES.target, | ||
| })); | ||
| } | ||
|
|
||
| setValues((prevValues) => ({ | ||
| ...prevValues, | ||
| target: values.target, | ||
| })); | ||
|
|
||
| onChangeAllTargets(Number(values.target)); | ||
| }} | ||
| /> | ||
| <span className="text-xs">%</span> | ||
| </div> | ||
| <div className="flex items-center space-x-2"> | ||
| <span>SPF</span> | ||
| <Input | ||
| className={INPUT_CLASSES} | ||
| theme="dark" | ||
| mode="dashed" | ||
| type="number" | ||
| defaultValue={values.spf} | ||
| // value={inputFPFValue} | ||
| // disabled={!editable} | ||
| onChange={({ target: { value: inputValue } }) => { | ||
| setValues((prevValues) => ({ | ||
| ...prevValues, | ||
| spf: Number(inputValue), | ||
| })); | ||
| }} | ||
| onKeyDownCapture={(event) => { | ||
| if (event.key === 'Enter') { | ||
| onChangeAllSPF(Number(values.spf)); | ||
| } | ||
| }} | ||
| onBlur={() => { | ||
| if (!values.spf) { | ||
| return setValues((prevValues) => ({ | ||
| ...prevValues, | ||
| target: DEFAULT_INPUT_VALUES.spf, | ||
| })); | ||
| } | ||
|
|
||
| setValues((prevValues) => ({ | ||
| ...prevValues, | ||
| spf: values.spf, | ||
| })); | ||
|
|
||
| onChangeAllSPF(Number(values.spf)); | ||
| }} | ||
| /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| export default AllTargetsSelector; |
Oops, something went wrong.