Skip to content

Commit 9c2b742

Browse files
author
Dane Pilcher
authored
test: fix complex tests (#233)
1 parent 963e8e7 commit 9c2b742

File tree

22 files changed

+499
-113
lines changed

22 files changed

+499
-113
lines changed

‎packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react.test.ts.snap

Lines changed: 71 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -661,12 +661,14 @@ import {
661661
getOverrideProps,
662662
} from \\"@aws-amplify/ui-react\\";
663663
664-
export type HiProps = React.PropsWithChildren<
664+
export type ComplexTest1Props = React.PropsWithChildren<
665665
Partial<FlexProps> & {
666666
overrides?: EscapeHatchProps | undefined | null;
667667
}
668668
>;
669-
export default function Hi(props: HiProps): React.ReactElement {
669+
export default function ComplexTest1(
670+
props: ComplexTest1Props
671+
): React.ReactElement {
670672
const { overrides: overridesProp, ...rest } = props;
671673
const overrides = { ...overridesProp };
672674
return (
@@ -709,17 +711,17 @@ import {
709711
EscapeHatchProps,
710712
Flex,
711713
FlexProps,
714+
View,
712715
getOverrideProps,
713716
} from \\"@aws-amplify/ui-react\\";
714-
import Box from \\"./Box\\";
715717
716-
export type VerticalFlexFixedProps = React.PropsWithChildren<
718+
export type ComplexTest2Props = React.PropsWithChildren<
717719
Partial<FlexProps> & {
718720
overrides?: EscapeHatchProps | undefined | null;
719721
}
720722
>;
721-
export default function VerticalFlexFixed(
722-
props: VerticalFlexFixedProps
723+
export default function ComplexTest2(
724+
props: ComplexTest2Props
723725
): React.ReactElement {
724726
const { overrides: overridesProp, ...rest } = props;
725727
const overrides = { ...overridesProp };
@@ -749,24 +751,24 @@ export default function VerticalFlexFixed(
749751
direction=\\"column\\"
750752
{...getOverrideProps(overrides, \\"Flex.Flex[0]\\")}
751753
>
752-
<Box
754+
<View
753755
width=\\"123px\\"
754756
padding=\\"0px 0px 0px 0px\\"
755757
backgroundColor=\\"rgb(255,0,0)\\"
756758
position=\\"relative\\"
757759
src=\\"https://via.placeholder.com/153x289?text=Amplify+Studio+is+Awesome!\\"
758760
height=\\"125px\\"
759-
{...getOverrideProps(overrides, \\"Flex.Flex[0].Box[0]\\")}
760-
></Box>
761-
<Box
761+
{...getOverrideProps(overrides, \\"Flex.Flex[0].View[0]\\")}
762+
></View>
763+
<View
762764
width=\\"123px\\"
763765
padding=\\"0px 0px 0px 0px\\"
764766
backgroundColor=\\"rgb(219.30000364780426,255,0)\\"
765767
position=\\"relative\\"
766768
src=\\"https://via.placeholder.com/153x289?text=Amplify+Studio+is+Awesome!\\"
767769
height=\\"122px\\"
768-
{...getOverrideProps(overrides, \\"Flex.Flex[0].Box[1]\\")}
769-
></Box>
770+
{...getOverrideProps(overrides, \\"Flex.Flex[0].View[1]\\")}
771+
></View>
770772
</Flex>
771773
</Flex>
772774
);
@@ -782,18 +784,18 @@ import {
782784
Flex,
783785
FlexProps,
784786
Text,
787+
View,
785788
getOverrideProps,
786789
} from \\"@aws-amplify/ui-react\\";
787-
import Box from \\"./Box\\";
788790
import ReneButton from \\"./ReneButton\\";
789791
790-
export type NewComponentProps = React.PropsWithChildren<
792+
export type ComplexTest3Props = React.PropsWithChildren<
791793
Partial<FlexProps> & {
792794
overrides?: EscapeHatchProps | undefined | null;
793795
}
794796
>;
795-
export default function NewComponent(
796-
props: NewComponentProps
797+
export default function ComplexTest3(
798+
props: ComplexTest3Props
797799
): React.ReactElement {
798800
const { overrides: overridesProp, ...rest } = props;
799801
const overrides = { ...overridesProp };
@@ -825,15 +827,15 @@ export default function NewComponent(
825827
children=\\"Hello World!\\"
826828
{...getOverrideProps(overrides, \\"Flex.Text[0]\\")}
827829
></Text>
828-
<Box
830+
<View
829831
width=\\"390px\\"
830832
padding=\\"0px 0px 0px 0px\\"
831833
backgroundColor=\\"rgb(196.00000351667404,196.00000351667404,196.00000351667404)\\"
832834
position=\\"relative\\"
833835
src=\\"https://via.placeholder.com/430x452?text=Amplify+Studio+is+Awesome!\\"
834836
height=\\"69px\\"
835-
{...getOverrideProps(overrides, \\"Flex.Box[0]\\")}
836-
></Box>
837+
{...getOverrideProps(overrides, \\"Flex.View[0]\\")}
838+
></View>
837839
<ReneButton
838840
width=\\"293px\\"
839841
height=\\"45px\\"
@@ -867,20 +869,20 @@ import {
867869
Flex,
868870
FlexProps,
869871
Variant,
872+
View,
870873
getOverrideProps,
871874
getOverridesFromVariants,
872875
} from \\"@aws-amplify/ui-react\\";
873-
import Box from \\"./Box\\";
874876
875-
export type GroupReferenceProps = React.PropsWithChildren<
877+
export type ComplexTest4Props = React.PropsWithChildren<
876878
Partial<FlexProps> & {
877879
colors?: \\"Red/Orange\\";
878880
} & {
879881
overrides?: EscapeHatchProps | undefined | null;
880882
}
881883
>;
882-
export default function GroupReference(
883-
props: GroupReferenceProps
884+
export default function ComplexTest4(
885+
props: ComplexTest4Props
884886
): React.ReactElement {
885887
const { overrides: overridesProp, ...rest } = props;
886888
const variants: Variant[] = [
@@ -895,7 +897,7 @@ export default function GroupReference(
895897
position: \\"relative\\",
896898
direction: \\"row\\",
897899
},
898-
\\"Flex.Flex.Box[1]\\": {
900+
\\"Flex.Flex.View[1]\\": {
899901
padding: \\"0px 0px 0px 0px\\",
900902
backgroundColor: \\"rgb(255,153.00000607967377,0)\\",
901903
top: \\"1px\\",
@@ -905,7 +907,7 @@ export default function GroupReference(
905907
position: \\"absolute\\",
906908
height: \\"122px\\",
907909
},
908-
\\"Flex.Flex.Box[0]\\": {
910+
\\"Flex.Flex.View[0]\\": {
909911
padding: \\"0px 0px 0px 0px\\",
910912
backgroundColor: \\"rgb(255,0,0)\\",
911913
top: \\"0px\\",
@@ -949,7 +951,7 @@ export default function GroupReference(
949951
height=\\"123px\\"
950952
{...getOverrideProps(overrides, \\"Flex.Flex[0]\\")}
951953
>
952-
<Box
954+
<View
953955
padding=\\"0px 0px 0px 0px\\"
954956
backgroundColor=\\"rgb(35.699965953826904,0,255)\\"
955957
top=\\"0px\\"
@@ -958,9 +960,9 @@ export default function GroupReference(
958960
width=\\"122px\\"
959961
position=\\"absolute\\"
960962
height=\\"123px\\"
961-
{...getOverrideProps(overrides, \\"Flex.Flex[0].Box[0]\\")}
962-
></Box>
963-
<Box
963+
{...getOverrideProps(overrides, \\"Flex.Flex[0].View[0]\\")}
964+
></View>
965+
<View
964966
padding=\\"0px 0px 0px 0px\\"
965967
backgroundColor=\\"rgb(0,255,25.49997568130493)\\"
966968
top=\\"1px\\"
@@ -969,8 +971,8 @@ export default function GroupReference(
969971
width=\\"120px\\"
970972
position=\\"absolute\\"
971973
height=\\"122px\\"
972-
{...getOverrideProps(overrides, \\"Flex.Flex[0].Box[1]\\")}
973-
></Box>
974+
{...getOverrideProps(overrides, \\"Flex.Flex[0].View[1]\\")}
975+
></View>
974976
</Flex>
975977
</Flex>
976978
);
@@ -985,16 +987,18 @@ import {
985987
EscapeHatchProps,
986988
Flex,
987989
FlexProps,
990+
View,
988991
getOverrideProps,
989992
} from \\"@aws-amplify/ui-react\\";
990-
import Box from \\"./Box\\";
991993
992-
export type FlexTestProps = React.PropsWithChildren<
994+
export type ComplexTest5Props = React.PropsWithChildren<
993995
Partial<FlexProps> & {
994996
overrides?: EscapeHatchProps | undefined | null;
995997
}
996998
>;
997-
export default function FlexTest(props: FlexTestProps): React.ReactElement {
999+
export default function ComplexTest5(
1000+
props: ComplexTest5Props
1001+
): React.ReactElement {
9981002
const { overrides: overridesProp, ...rest } = props;
9991003
const overrides = { ...overridesProp };
10001004
return (
@@ -1009,24 +1013,24 @@ export default function FlexTest(props: FlexTestProps): React.ReactElement {
10091013
{...rest}
10101014
{...getOverrideProps(overrides, \\"Flex\\")}
10111015
>
1012-
<Box
1016+
<View
10131017
width=\\"120px\\"
10141018
padding=\\"0px 0px 0px 0px\\"
10151019
backgroundColor=\\"rgb(35.699965953826904,0,255)\\"
10161020
position=\\"relative\\"
10171021
src=\\"https://via.placeholder.com/240x120?text=Amplify+Studio+is+Awesome!\\"
10181022
height=\\"120px\\"
1019-
{...getOverrideProps(overrides, \\"Flex.Box[0]\\")}
1020-
></Box>
1021-
<Box
1023+
{...getOverrideProps(overrides, \\"Flex.View[0]\\")}
1024+
></View>
1025+
<View
10221026
width=\\"120px\\"
10231027
padding=\\"0px 0px 0px 0px\\"
10241028
backgroundColor=\\"rgb(0,255,25.49997568130493)\\"
10251029
position=\\"relative\\"
10261030
src=\\"https://via.placeholder.com/240x120?text=Amplify+Studio+is+Awesome!\\"
10271031
height=\\"120px\\"
1028-
{...getOverrideProps(overrides, \\"Flex.Box[1]\\")}
1029-
></Box>
1032+
{...getOverrideProps(overrides, \\"Flex.View[1]\\")}
1033+
></View>
10301034
</Flex>
10311035
);
10321036
}
@@ -1044,12 +1048,14 @@ import {
10441048
getOverrideProps,
10451049
} from \\"@aws-amplify/ui-react\\";
10461050
1047-
export type MohitHomeProps = React.PropsWithChildren<
1051+
export type ComplexTest6Props = React.PropsWithChildren<
10481052
Partial<FlexProps> & {
10491053
overrides?: EscapeHatchProps | undefined | null;
10501054
}
10511055
>;
1052-
export default function MohitHome(props: MohitHomeProps): React.ReactElement {
1056+
export default function ComplexTest6(
1057+
props: ComplexTest6Props
1058+
): React.ReactElement {
10531059
const { overrides: overridesProp, ...rest } = props;
10541060
const overrides = { ...overridesProp };
10551061
return (
@@ -1119,27 +1125,30 @@ import {
11191125
EscapeHatchProps,
11201126
Image,
11211127
Text,
1128+
View,
1129+
ViewProps,
11221130
getOverrideProps,
11231131
} from \\"@aws-amplify/ui-react\\";
1124-
import Box, { BoxProps } from \\"./Box\\";
11251132
1126-
export type ImageFlexProps = React.PropsWithChildren<
1127-
Partial<BoxProps> & {
1133+
export type ComplexTest7Props = React.PropsWithChildren<
1134+
Partial<ViewProps> & {
11281135
overrides?: EscapeHatchProps | undefined | null;
11291136
}
11301137
>;
1131-
export default function ImageFlex(props: ImageFlexProps): React.ReactElement {
1138+
export default function ComplexTest7(
1139+
props: ComplexTest7Props
1140+
): React.ReactElement {
11321141
const { overrides: overridesProp, ...rest } = props;
11331142
const overrides = { ...overridesProp };
11341143
return (
11351144
/* @ts-ignore: TS2322 */
1136-
<Box
1145+
<View
11371146
width=\\"401px\\"
11381147
padding=\\"0px 0px 0px 0px\\"
11391148
position=\\"relative\\"
11401149
height=\\"192px\\"
11411150
{...rest}
1142-
{...getOverrideProps(overrides, \\"Box\\")}
1151+
{...getOverrideProps(overrides, \\"View\\")}
11431152
>
11441153
<Image
11451154
border=\\"4px SOLID rgb(0,0,0)\\"
@@ -1151,7 +1160,7 @@ export default function ImageFlex(props: ImageFlexProps): React.ReactElement {
11511160
width=\\"150.84925842285156px\\"
11521161
position=\\"absolute\\"
11531162
height=\\"196px\\"
1154-
{...getOverrideProps(overrides, \\"Box.Image[0]\\")}
1163+
{...getOverrideProps(overrides, \\"View.Image[0]\\")}
11551164
></Image>
11561165
<Text
11571166
padding=\\"0px 0px 0px 0px\\"
@@ -1167,7 +1176,7 @@ export default function ImageFlex(props: ImageFlexProps): React.ReactElement {
11671176
fontWeight=\\"400\\"
11681177
height=\\"27.839996337890625px\\"
11691178
children=\\"Test\\"
1170-
{...getOverrideProps(overrides, \\"Box.Text[0]\\")}
1179+
{...getOverrideProps(overrides, \\"View.Text[0]\\")}
11711180
></Text>
11721181
<Image
11731182
border=\\"4px SOLID rgb(0,0,0)\\"
@@ -1179,9 +1188,9 @@ export default function ImageFlex(props: ImageFlexProps): React.ReactElement {
11791188
width=\\"169.42330932617188px\\"
11801189
position=\\"absolute\\"
11811190
height=\\"189.0880126953125px\\"
1182-
{...getOverrideProps(overrides, \\"Box.Image[1]\\")}
1191+
{...getOverrideProps(overrides, \\"View.Image[1]\\")}
11831192
></Image>
1184-
</Box>
1193+
</View>
11851194
);
11861195
}
11871196
"
@@ -1194,17 +1203,17 @@ import {
11941203
EscapeHatchProps,
11951204
Flex,
11961205
FlexProps,
1206+
View,
11971207
getOverrideProps,
11981208
} from \\"@aws-amplify/ui-react\\";
1199-
import Box from \\"./Box\\";
12001209
1201-
export type VerticalFlexFillProps = React.PropsWithChildren<
1210+
export type ComplexTest8Props = React.PropsWithChildren<
12021211
Partial<FlexProps> & {
12031212
overrides?: EscapeHatchProps | undefined | null;
12041213
}
12051214
>;
1206-
export default function VerticalFlexFill(
1207-
props: VerticalFlexFillProps
1215+
export default function ComplexTest8(
1216+
props: ComplexTest8Props
12081217
): React.ReactElement {
12091218
const { overrides: overridesProp, ...rest } = props;
12101219
const overrides = { ...overridesProp };
@@ -1232,24 +1241,24 @@ export default function VerticalFlexFill(
12321241
direction=\\"column\\"
12331242
{...getOverrideProps(overrides, \\"Flex.Flex[0]\\")}
12341243
>
1235-
<Box
1244+
<View
12361245
width=\\"145px\\"
12371246
padding=\\"0px 0px 0px 0px\\"
12381247
backgroundColor=\\"rgb(219.30000364780426,255,0)\\"
12391248
position=\\"relative\\"
12401249
src=\\"https://via.placeholder.com/472x723?text=Amplify+Studio+is+Awesome!\\"
12411250
height=\\"119px\\"
1242-
{...getOverrideProps(overrides, \\"Flex.Flex[0].Box[0]\\")}
1243-
></Box>
1244-
<Box
1251+
{...getOverrideProps(overrides, \\"Flex.Flex[0].View[0]\\")}
1252+
></View>
1253+
<View
12451254
width=\\"145px\\"
12461255
padding=\\"0px 0px 0px 0px\\"
12471256
backgroundColor=\\"rgb(255,0,0)\\"
12481257
position=\\"relative\\"
12491258
src=\\"https://via.placeholder.com/472x723?text=Amplify+Studio+is+Awesome!\\"
12501259
height=\\"124px\\"
1251-
{...getOverrideProps(overrides, \\"Flex.Flex[0].Box[1]\\")}
1252-
></Box>
1260+
{...getOverrideProps(overrides, \\"Flex.Flex[0].View[1]\\")}
1261+
></View>
12531262
</Flex>
12541263
</Flex>
12551264
);

‎packages/codegen-ui-react/lib/__tests__/studio-ui-json/complexTest1.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@
4747
"createdAt": "2021-10-29T19:06:43.992Z",
4848
"environmentName": "staging",
4949
"id": "c-dtWZ1lFsFicAxSq4Om",
50-
"name": "Hi",
50+
"name": "ComplexTest1",
5151
"overrides": {},
5252
"properties": {
5353
"padding": {

0 commit comments

Comments
 (0)