Skip to content

Commit 63ee4e7

Browse files
talhainvenxiontalhainvenxion
authored
Merge pull request #196 from zenml-io/QA-Fixes
Qa fixes
2 parents 443d829 + 50c2d27 commit 63ee4e7

File tree

4 files changed

+129
-52
lines changed

4 files changed

+129
-52
lines changed

‎src/ui/layouts/common/CustomStackBox/index.tsx‎

Lines changed: 22 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,18 @@ export const CustomStackBox: React.FC<{
1212
value?: any;
1313
onCheck: any;
1414
}> = ({ image, stackName, stackDesc, value, onCheck }) => {
15-
1615
return (
1716
<Box
18-
paddingHorizontal="sm2"
17+
paddingHorizontal="sm2"
1918
paddingVertical="sm2"
20-
className={styles.stackBox}
19+
className={styles.stackBox}
2120
>
22-
<input type='checkbox' className={styles.checkbox} checked={value} onClick={onCheck} />
21+
<input
22+
type="radio"
23+
className={styles.checkbox}
24+
checked={value}
25+
onClick={onCheck}
26+
/>
2327
<Box className={styles.imageWrapper}>
2428
<Box className={styles.imageContainer}>
2529
<img src={image} alt="by Zenml" />
@@ -28,7 +32,13 @@ export const CustomStackBox: React.FC<{
2832

2933
<Box style={{ marginTop: '8px' }}>
3034
<div data-tip data-for={stackName}>
31-
<Paragraph className={styles.stackName}>{stackName?.length > 14 ? <>{stackName?.slice(0, 15)}...</> : stackName}</Paragraph>
35+
<Paragraph className={styles.stackName}>
36+
{stackName?.length > 14 ? (
37+
<>{stackName?.slice(0, 15)}...</>
38+
) : (
39+
stackName
40+
)}
41+
</Paragraph>
3242
</div>
3343
<ReactTooltip id={stackName} place="top" effect="solid">
3444
<Paragraph color="white">{stackName}</Paragraph>
@@ -37,7 +47,13 @@ export const CustomStackBox: React.FC<{
3747

3848
<Box marginTop="xs">
3949
<div data-tip data-for={stackDesc}>
40-
<Paragraph className={styles.stackDesc}>{stackDesc?.length > 14 ? <>{titleCase(stackDesc?.slice(0, 15))}...</> : stackDesc}</Paragraph>
50+
<Paragraph className={styles.stackDesc}>
51+
{stackDesc?.length > 14 ? (
52+
<>{titleCase(stackDesc?.slice(0, 15))}...</>
53+
) : (
54+
stackDesc
55+
)}
56+
</Paragraph>
4157
</div>
4258
<ReactTooltip id={stackDesc} place="top" effect="solid">
4359
<Paragraph color="white">{titleCase(stackDesc)}</Paragraph>

‎src/ui/layouts/stacks/CreateStack/ListForAll/GetList/index.tsx‎

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,7 @@ export const GetList: React.FC<Props> = ({
124124
setSelectedStackBox(item);
125125
}}
126126
>
127+
{console.log(selectedStack, 'selectedStackselectedStack')}
127128
<CustomStackBox
128129
image={item?.logoUrl}
129130
stackName={item.name}
@@ -138,7 +139,14 @@ export const GetList: React.FC<Props> = ({
138139
selectedStack.splice(index, 1);
139140
setSelectedStack([...selectedStack]);
140141
} else {
141-
setSelectedStack([...selectedStack, item]);
142+
if (selectedStack.map((t: any) => t.type === item.type)) {
143+
let filterSelectedStack = selectedStack.filter(
144+
(st: any) => st.type !== item.type,
145+
);
146+
setSelectedStack([...filterSelectedStack, item]);
147+
} else {
148+
setSelectedStack([...selectedStack, item]);
149+
}
142150
}
143151
}}
144152
/>
@@ -150,6 +158,30 @@ export const GetList: React.FC<Props> = ({
150158
{showPopup && (
151159
<SidePopup
152160
isCreate={false}
161+
canSelect={true}
162+
onSelect={() => {
163+
var index = selectedStack.findIndex(function (s: any) {
164+
return s.id === selectedStackBox.id;
165+
});
166+
if (index !== -1) {
167+
selectedStack.splice(index, 1);
168+
setSelectedStack([...selectedStack]);
169+
} else {
170+
if (
171+
selectedStack.map((t: any) => t.type === selectedStackBox.type)
172+
) {
173+
let filterSelectedStack = selectedStack.filter(
174+
(st: any) => st.type !== selectedStackBox.type,
175+
);
176+
setSelectedStack([...filterSelectedStack, selectedStackBox]);
177+
} else {
178+
setSelectedStack([...selectedStack, selectedStackBox]);
179+
}
180+
}
181+
setShowPopup(false);
182+
}}
183+
selectedStackBox={selectedStackBox}
184+
selectedStack={selectedStack}
153185
onSeeExisting={() => {
154186
// debugger;
155187
dispatch(

‎src/ui/layouts/stacks/CreateStack/ListForAll/SidePopup/index.tsx‎

Lines changed: 71 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -17,54 +17,81 @@ const Dimmer: React.FC = () => <Box className={styles.dimmer}></Box>;
1717

1818
export const SidePopup: React.FC<{
1919
isCreate?: boolean;
20+
onSelect?: any;
21+
canSelect?: boolean;
2022
onSeeExisting: () => void;
2123
onClose: () => void;
2224
registerStack?: any;
23-
}> = ({ children, onClose, registerStack, onSeeExisting, isCreate = true }) => (
24-
<>
25-
<Dimmer />
26-
<FlexBox
27-
alignItems="center"
28-
justifyContent="center"
29-
className={styles.popupContainer}
30-
>
31-
<Box className={styles.popupClose}>
32-
<LinkBox onClick={onClose}>
33-
<icons.closeWithBorder />
34-
</LinkBox>
35-
</Box>
25+
selectedStack?: any;
26+
selectedStackBox?: any;
27+
}> = ({
28+
children,
29+
onClose,
30+
registerStack,
31+
onSeeExisting,
32+
isCreate = true,
33+
canSelect = false,
34+
onSelect,
35+
selectedStack,
36+
selectedStackBox,
37+
}) => {
38+
const find = selectedStack.filter(
39+
(item: any) => item.id === selectedStackBox.id,
40+
);
41+
console.log(find, selectedStackBox, selectedStack, 'findddd');
42+
return (
43+
<>
44+
<Dimmer />
45+
<FlexBox
46+
alignItems="center"
47+
justifyContent="center"
48+
className={styles.popupContainer}
49+
>
50+
<Box className={styles.popupClose}>
51+
<LinkBox onClick={onClose}>
52+
<icons.closeWithBorder />
53+
</LinkBox>
54+
</Box>
3655

37-
<Box className={styles.sidePopup}>
38-
<OutsideClickHandler onOutsideClick={onClose}>
39-
<Box paddingVertical="lg" paddingHorizontal="xxxl">
40-
<H3 style={{ color: '#443E99', fontWeight: 'bold' }}>
41-
Configurations
42-
</H3>
43-
{children}
44-
</Box>
56+
<Box className={styles.sidePopup}>
57+
<OutsideClickHandler onOutsideClick={onClose}>
58+
<Box paddingVertical="lg" paddingHorizontal="xxxl">
59+
<H3 style={{ color: '#443E99', fontWeight: 'bold' }}>
60+
Configurations
61+
</H3>
62+
{children}
63+
</Box>
4564

46-
<Box
47-
paddingVertical="lg"
48-
paddingHorizontal="md"
49-
className={styles.actionSection}
50-
>
51-
<FlexBox.Row justifyContent="space-between" alignItems="center">
52-
<Box>
53-
<LinkBox onClick={onSeeExisting}>
54-
<Paragraph>Goto Component</Paragraph>
55-
</LinkBox>
56-
</Box>
57-
{isCreate && (
65+
<Box
66+
paddingVertical="lg"
67+
paddingHorizontal="md"
68+
className={styles.actionSection}
69+
>
70+
<FlexBox.Row justifyContent="space-between" alignItems="center">
5871
<Box>
59-
<PrimaryButton onClick={registerStack}>
60-
Register Stack
61-
</PrimaryButton>
72+
<LinkBox onClick={onSeeExisting}>
73+
<Paragraph>Goto Component</Paragraph>
74+
</LinkBox>
6275
</Box>
63-
)}
64-
</FlexBox.Row>
65-
</Box>
66-
</OutsideClickHandler>
67-
</Box>
68-
</FlexBox>
69-
</>
70-
);
76+
{isCreate && (
77+
<Box>
78+
<PrimaryButton onClick={registerStack}>
79+
Register Stack
80+
</PrimaryButton>
81+
</Box>
82+
)}
83+
{canSelect && (
84+
<Box>
85+
<PrimaryButton onClick={onSelect}>
86+
{find.length ? 'Deselect' : 'Select'}
87+
</PrimaryButton>
88+
</Box>
89+
)}
90+
</FlexBox.Row>
91+
</Box>
92+
</OutsideClickHandler>
93+
</Box>
94+
</FlexBox>
95+
</>
96+
);
97+
};

‎src/ui/layouts/stacks/CreateStack/ListForAll/index.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -159,7 +159,9 @@ export const ListForAll: React.FC<Props> = () => {
159159

160160
dispatch(
161161
showToasterAction({
162-
description: err?.response?.data?.detail[0],
162+
description: err?.response?.data?.detail[0].includes('Exists')
163+
? `Stack name is already exists.`
164+
: err?.response?.data?.detail[0],
163165
type: toasterTypes.failure,
164166
}),
165167
);

0 commit comments

Comments
 (0)