Skip to content

Commit 67f2bdf

Browse files
LiaSoloLiaSolo
committed
fix some comments
1 parent b824685 commit 67f2bdf

40 files changed

+975
-726
lines changed

‎web-app/client/.gitignore‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,4 +43,4 @@ cmsTypes.ts
4343
.graphqlconfig
4444
schema.graphql
4545

46-
web-app\client\proxy.config.js
46+
proxy.config.js

‎web-app/client/package.json‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,6 @@
6262
"@testing-library/react": "^13.4.0",
6363
"@testing-library/react-hooks": "^8.0.1",
6464
"@testing-library/user-event": "^14.4.3",
65-
"@trivago/prettier-plugin-sort-imports": "^4.3.0",
6665
"@types/apollo-upload-client": "^17.0.1",
6766
"@types/classnames": "^2.3.1",
6867
"@types/clientjs": "^0.2.0",

‎web-app/client/src/atoms/ACTaskAtom.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
1-
import { Intervals } from '@graphql/operations/queries/__generated__/GetMainTaskDeps';
1+
import { Interval } from '@graphql/operations/queries/__generated__/GetMainTaskDeps';
22
import { atom } from 'jotai';
33
import { ACSortBy, OrderBy, Pagination } from 'types/globalTypes';
44

55
export type ACInstance = {
6+
id: string;
67
attribute1: string;
78
attribute2: string;
8-
intervals: Intervals[];
9+
intervals: Interval[];
910
outliers: number[];
1011
};
1112

web-app/client/src/components/АС/Intervals/Intervals.module.scss renamed to web-app/client/src/components/ACInstance/ACInstance.module.scss

Lines changed: 15 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,61 +2,51 @@
22

33
.containerOuter {
44
@include paragraph-small;
5+
display: flex;
6+
justify-content: space-between;
7+
gap: 16px;
58
margin-bottom: 16px;
9+
border: solid 2px $black-50;
10+
border-radius: 8px;
611
box-sizing: border-box;
712
padding: 16px;
813
max-width: 836px;
14+
background-color: $white-25;
915
cursor: pointer;
10-
background-color: $white;
11-
border: solid 2px $black;
12-
border-radius: 8px;
13-
display: flex;
14-
justify-content: space-between;
15-
gap: 16px;
1616
}
1717

1818
.icons {
19-
color: $black-75;
2019
width: 16px;
2120
height: 16px;
21+
color: $black-75;
2222
}
2323

2424
.containerInner {
25-
min-width: 0;
26-
width: 100%;
2725
display: flex;
2826
flex-direction: column;
2927
gap: 8px;
30-
}
31-
32-
.default {
33-
background-color: $white-25;
34-
border-color: $black-50;
35-
}
36-
37-
.error {
38-
background-color: $error-10;
39-
border-color: $error;
28+
width: 100%;
29+
min-width: 0;
4030
}
4131

4232
.selected {
43-
background-color: $secondary-1;
4433
border-color: $primary-0;
34+
background-color: $secondary-1;
4535
}
4636

4737
.attributes {
4838
display: flex;
49-
gap: 8px;
5039
align-items: center;
40+
gap: 8px;
5141
}
5242

5343
.attr {
5444
@include paragraph-small;
55-
border-radius: 8px;
56-
text-align: center;
57-
background: $black-10;
5845
border: 2px solid transparent;
59-
color: $black-75;
46+
border-radius: 8px;
6047
padding-left: 8px;
6148
padding-right: 8px;
49+
background: $black-10;
50+
text-align: center;
51+
color: $black-75;
6252
}

‎web-app/client/src/components/ACInstance/ACInstance.tsx‎

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
import DivisionIcon from '@assets/icons/division.svg?component';
2+
import MinusIcon from '@assets/icons/minus.svg?component';
3+
import MultiplicationIcon from '@assets/icons/multiplication.svg?component';
4+
import PlusIcon from '@assets/icons/plus.svg?component';
5+
import ACAtom, {
6+
ACAtomDefaultValuesWithParams,
7+
ACInstance,
8+
} from '@atoms/ACTaskAtom';
9+
import {
10+
GetMainTaskDeps_taskInfo_TaskInfo_data_result_ACTaskResult_ACs_attributes,
11+
GetMainTaskDeps_taskInfo_TaskInfo_data_result_ACTaskResult_ACs_intervals,
12+
GetMainTaskDeps_taskInfo_TaskInfo_data_result_ACTaskResult_ACs_outliers,
13+
Operation,
14+
} from '@graphql/operations/queries/__generated__/GetMainTaskDeps';
15+
import cn from 'classnames';
16+
import { useAtom } from 'jotai';
17+
import { FC } from 'react';
18+
import CollapsableView from '../CollapsableView';
19+
import styles from './ACInstance.module.scss';
20+
21+
type Props = {
22+
id: string;
23+
attributes: GetMainTaskDeps_taskInfo_TaskInfo_data_result_ACTaskResult_ACs_attributes;
24+
operation: Operation;
25+
outliers: GetMainTaskDeps_taskInfo_TaskInfo_data_result_ACTaskResult_ACs_outliers;
26+
intervals: GetMainTaskDeps_taskInfo_TaskInfo_data_result_ACTaskResult_ACs_intervals;
27+
};
28+
29+
export const operationIcons = {
30+
[Operation.ADDITION]: PlusIcon,
31+
[Operation.MULTIPLICATION]: MultiplicationIcon,
32+
[Operation.DIVISION]: DivisionIcon,
33+
[Operation.SUBTRACTION]: MinusIcon,
34+
};
35+
36+
const ACInstance: FC<Props> = ({
37+
id,
38+
attributes,
39+
operation,
40+
outliers,
41+
intervals,
42+
}) => {
43+
const [atom, setAtom] = useAtom(ACAtom);
44+
const handleSelect = () => {
45+
const instance: ACInstance = {
46+
id: id,
47+
attribute1: attributes.attr1,
48+
attribute2: attributes.attr2,
49+
intervals: intervals.intervals,
50+
outliers: outliers.outliers,
51+
};
52+
setAtom({ ...ACAtomDefaultValuesWithParams(atom.taskID, instance) });
53+
};
54+
55+
const OperationIcon = operationIcons[operation as Operation];
56+
57+
const isSelected = atom.instanceSelected?.id === id;
58+
59+
return (
60+
<div
61+
className={cn(styles.containerOuter, isSelected && styles.selected)}
62+
onClick={handleSelect}
63+
>
64+
<div className={styles.containerInner}>
65+
Operation
66+
<div className={styles.attributes}>
67+
<div className={styles.attr}>{attributes.attr1}</div>
68+
<OperationIcon className={styles.icons}/>
69+
70+
<div className={styles.attr}>{attributes.attr2}</div>
71+
</div>
72+
</div>
73+
<CollapsableView
74+
title="Intervals"
75+
output={intervals.intervals.map((elem) => `[${elem[0]}, ${elem[1]}]`)}
76+
amount={intervals.amount}
77+
/>
78+
<CollapsableView
79+
title="Outliers"
80+
output={outliers.outliers.map((elem) => elem.toString())}
81+
/>
82+
</div>
83+
);
84+
};
85+
86+
export default ACInstance;

‎web-app/client/src/components/ACInstance/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { default } from './ACInstance';

‎web-app/client/src/components/AlgorithmFormConfigurator/AlgorithmFormConfigurator.tsx‎

Lines changed: 23 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
1+
import cn from 'classnames';
2+
import { useRouter } from 'next/router';
13
import FormFooter from '@components/AlgorithmFormConfigurator/FormFooter';
24
import FormHeader from '@components/AlgorithmFormConfigurator/FormHeader';
35
import useFormFactory from '@components/AlgorithmFormConfigurator/useFormFactory';
46
import PresetSelector from '@components/PresetSelector';
57
import WizardLayout from '@components/WizardLayout';
68
import { UsedPrimitivesType } from '@constants/formPrimitives';
7-
import cn from 'classnames';
8-
import { useRouter } from 'next/router';
9-
import React from 'react';
109
import styles from './ConfigureAlgorithm.module.scss';
1110

1211
type QueryProps<T extends UsedPrimitivesType> = {
@@ -34,11 +33,7 @@ const AlgorithmFormConfigurator = <T extends UsedPrimitivesType>({
3433
primitive,
3534
formParams,
3635
});
37-
38-
const numColumnContainer = `container${
39-
entries.length > 4 ? 'Over4' : 'Less4'
40-
}Inputs`;
41-
36+
4237
return (
4338
<WizardLayout header={FormHeader} footer={FormFooter(router, onSubmit)}>
4439
<div
@@ -47,7 +42,15 @@ const AlgorithmFormConfigurator = <T extends UsedPrimitivesType>({
4742
entries.length > 4 && styles.bigFormContainer,
4843
)}
4944
>
50-
<div className={styles[numColumnContainer]}>
45+
<div
46+
className={
47+
styles[
48+
entries.length > 4
49+
? 'containerOver4Inputs'
50+
: 'baseFormContainer'
51+
]
52+
}
53+
>
5154
<PresetSelector
5255
presets={formPresets}
5356
isCustom={methods.formState.isDirty}
@@ -57,7 +60,17 @@ const AlgorithmFormConfigurator = <T extends UsedPrimitivesType>({
5760
</div>
5861

5962
<div className={styles.line} />
60-
<div className={styles[numColumnContainer]}>{entries}</div>
63+
<div
64+
className={
65+
styles[
66+
entries.length > 4
67+
? 'containerOver4Inputs'
68+
: 'containerLess4Inputs'
69+
]
70+
}
71+
>
72+
{entries}
73+
</div>
6174
</div>
6275
</WizardLayout>
6376
);

‎web-app/client/src/components/AlgorithmFormConfigurator/ConfigureAlgorithm.module.scss‎

Lines changed: 4 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,11 @@
44
margin-top: 16px;
55
}
66

7-
8-
.baseFormContainer {
9-
margin: auto;
7+
.baseFormContainer, .containerLess4Inputs {
8+
display: flex;
109
flex-direction: column;
1110
gap: 24px;
12-
display: flex;
11+
margin: auto;
1312
width: 100%;
1413
max-width: 466px;
1514
}
@@ -18,15 +17,6 @@
1817
max-width: 1100px;
1918
}
2019

21-
.containerLess4Inputs {
22-
margin: auto;
23-
flex-direction: column;
24-
gap: 24px;
25-
display: flex;
26-
width: 100%;
27-
max-width: 466px;
28-
}
29-
3020
.containerOver4Inputs {
3121
display: grid;
3222
grid-template-columns: 1fr 1fr;
@@ -42,9 +32,9 @@
4232
}
4333

4434
.line {
45-
width: 100%;
4635
grid-column: span 2;
4736
border: 0;
4837
border-top: 1px solid $black-25;
38+
width: 100%;
4939
padding: 0;
5040
}

0 commit comments

Comments
 (0)