@genspectrum/dashboard-components 0.14.1 → 0.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +90 -58
- package/dist/{LineageFilterChangedEvent-C9dXOxt6.js → LineageFilterChangedEvent-COWV-Y0k.js} +6 -6
- package/dist/LineageFilterChangedEvent-COWV-Y0k.js.map +1 -0
- package/dist/assets/mutationOverTimeWorker-BL50C-yi.js.map +1 -0
- package/dist/components.d.ts +52 -56
- package/dist/components.js +79 -58
- package/dist/components.js.map +1 -1
- package/dist/util.d.ts +49 -49
- package/dist/util.js +2 -2
- package/package.json +2 -2
- package/src/lapisApi/lapisApi.ts +1 -1
- package/src/operator/FillMissingOperator.spec.ts +1 -1
- package/src/operator/GroupByAndSumOperator.spec.ts +1 -1
- package/src/operator/GroupByOperator.spec.ts +2 -2
- package/src/operator/MapOperator.spec.ts +1 -1
- package/src/operator/MockOperator.spec.ts +1 -1
- package/src/operator/MockOperator.ts +6 -4
- package/src/operator/SortOperator.spec.ts +1 -1
- package/src/preact/aggregatedData/aggregate.stories.tsx +1 -1
- package/src/preact/components/csv-download-button.stories.tsx +2 -2
- package/src/preact/components/csv-download-button.tsx +1 -1
- package/src/preact/components/error-boundary.stories.tsx +5 -5
- package/src/preact/components/error-boundary.tsx +14 -3
- package/src/preact/components/error-display.stories.tsx +9 -9
- package/src/preact/components/fullscreen.tsx +3 -3
- package/src/preact/components/info.tsx +1 -1
- package/src/preact/components/mutation-type-selector.stories.tsx +1 -1
- package/src/preact/components/table.stories.tsx +3 -3
- package/src/preact/components/table.tsx +1 -1
- package/src/preact/{dateRangeSelector/date-range-selector.stories.tsx → dateRangeFilter/date-range-filter.stories.tsx} +18 -21
- package/src/preact/{dateRangeSelector/date-range-selector.tsx → dateRangeFilter/date-range-filter.tsx} +11 -11
- package/src/preact/{dateRangeSelector → dateRangeFilter}/dateRangeOption.ts +2 -2
- package/src/preact/lineageFilter/lineage-filter.stories.tsx +6 -6
- package/src/preact/locationFilter/fetchAutocompletionList.ts +1 -1
- package/src/preact/locationFilter/location-filter.stories.tsx +6 -6
- package/src/preact/map/sequences-by-location.stories.tsx +1 -1
- package/src/preact/mutationFilter/mutation-filter.stories.tsx +2 -2
- package/src/preact/mutations/getMutationsGridData.ts +1 -1
- package/src/preact/mutationsOverTime/mutations-over-time-grid.tsx +3 -3
- package/src/preact/mutationsOverTime/mutations-over-time.stories.tsx +1 -1
- package/src/preact/mutationsOverTime/mutations-over-time.tsx +1 -0
- package/src/preact/numberSequencesOverTime/number-sequences-over-time.stories.tsx +1 -1
- package/src/preact/prevalenceOverTime/prevalence-over-time-bubble-chart.tsx +4 -4
- package/src/preact/prevalenceOverTime/prevalence-over-time.stories.tsx +1 -1
- package/src/preact/relativeGrowthAdvantage/relative-growth-advantage.stories.tsx +1 -1
- package/src/preact/shared/floating-ui/hooks.ts +1 -1
- package/src/preact/{textInput/TextInputChangedEvent.ts → textFilter/TextFilterChangedEvent.ts} +2 -2
- package/src/preact/{textInput/text-input.stories.tsx → textFilter/text-filter.stories.tsx} +14 -14
- package/src/preact/{textInput/text-input.tsx → textFilter/text-filter.tsx} +10 -10
- package/src/utilEntrypoint.ts +2 -2
- package/src/utils/map2d.ts +1 -0
- package/src/web-components/gs-app.stories.ts +7 -7
- package/src/web-components/input/{gs-date-range-selector.stories.ts → gs-date-range-filter.stories.ts} +65 -20
- package/src/web-components/input/{gs-date-range-selector.tsx → gs-date-range-filter.tsx} +28 -13
- package/src/web-components/input/gs-lineage-filter.stories.ts +1 -1
- package/src/web-components/input/gs-location-filter.stories.ts +1 -1
- package/src/web-components/input/gs-mutation-filter.stories.ts +7 -7
- package/src/web-components/input/{gs-text-input.stories.ts → gs-text-filter.stories.ts} +18 -18
- package/src/web-components/input/{gs-text-input.tsx → gs-text-filter.tsx} +16 -16
- package/src/web-components/input/index.ts +2 -2
- package/src/web-components/visualization/gs-aggregate.tsx +2 -2
- package/standalone-bundle/assets/mutationOverTimeWorker-CFB5-Mdk.js.map +1 -0
- package/standalone-bundle/dashboard-components.js +2233 -2220
- package/standalone-bundle/dashboard-components.js.map +1 -1
- package/dist/LineageFilterChangedEvent-C9dXOxt6.js.map +0 -1
- package/dist/assets/mutationOverTimeWorker-Dxnxrfe0.js.map +0 -1
- package/standalone-bundle/assets/mutationOverTimeWorker-CmSrq4SZ.js.map +0 -1
- /package/src/preact/{dateRangeSelector → dateRangeFilter}/computeInitialValues.spec.ts +0 -0
- /package/src/preact/{dateRangeSelector → dateRangeFilter}/computeInitialValues.ts +0 -0
- /package/src/preact/{dateRangeSelector → dateRangeFilter}/dateConversion.ts +0 -0
- /package/src/preact/{dateRangeSelector → dateRangeFilter}/selectableOptions.ts +0 -0
- /package/src/preact/{textInput → textFilter}/__mockData__/aggregated_hosts.json +0 -0
- /package/src/preact/{textInput → textFilter}/fetchStringAutocompleteList.spec.ts +0 -0
- /package/src/preact/{textInput → textFilter}/fetchStringAutocompleteList.ts +0 -0
package/dist/util.d.ts
CHANGED
|
@@ -78,7 +78,7 @@ export declare class DateRangeOptionChangedEvent extends CustomEvent<DateRangeSe
|
|
|
78
78
|
}
|
|
79
79
|
|
|
80
80
|
/**
|
|
81
|
-
* Presets for the `gs-date-range-
|
|
81
|
+
* Presets for the `gs-date-range-filter` component that can be used as `dateRangeOptions`.
|
|
82
82
|
*/
|
|
83
83
|
export declare const dateRangeOptionPresets: {
|
|
84
84
|
last2Weeks: {
|
|
@@ -111,7 +111,7 @@ export declare const dateRangeOptionPresets: {
|
|
|
111
111
|
};
|
|
112
112
|
|
|
113
113
|
/**
|
|
114
|
-
* A date range option that can be used in the `gs-date-range-
|
|
114
|
+
* A date range option that can be used in the `gs-date-range-filter` component.
|
|
115
115
|
*/
|
|
116
116
|
declare const dateRangeOptionSchema: default_2.ZodObject<{
|
|
117
117
|
/** The label of the date range option that will be shown to the user */
|
|
@@ -792,7 +792,7 @@ export declare type TemporalGranularity = default_2.infer<typeof temporalGranula
|
|
|
792
792
|
|
|
793
793
|
declare const temporalGranularitySchema: default_2.ZodUnion<[default_2.ZodLiteral<"day">, default_2.ZodLiteral<"week">, default_2.ZodLiteral<"month">, default_2.ZodLiteral<"year">]>;
|
|
794
794
|
|
|
795
|
-
export declare class
|
|
795
|
+
export declare class TextFilterChangedEvent extends CustomEvent<LapisTextFilter> {
|
|
796
796
|
constructor(detail: LapisTextFilter);
|
|
797
797
|
}
|
|
798
798
|
|
|
@@ -848,11 +848,7 @@ declare global {
|
|
|
848
848
|
|
|
849
849
|
declare global {
|
|
850
850
|
interface HTMLElementTagNameMap {
|
|
851
|
-
'gs-
|
|
852
|
-
}
|
|
853
|
-
interface HTMLElementEventMap {
|
|
854
|
-
'gs-date-range-filter-changed': CustomEvent<Record<string, string>>;
|
|
855
|
-
'gs-date-range-option-changed': DateRangeOptionChangedEvent;
|
|
851
|
+
'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
|
|
856
852
|
}
|
|
857
853
|
}
|
|
858
854
|
|
|
@@ -860,7 +856,7 @@ declare global {
|
|
|
860
856
|
declare global {
|
|
861
857
|
namespace JSX {
|
|
862
858
|
interface IntrinsicElements {
|
|
863
|
-
'gs-
|
|
859
|
+
'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
864
860
|
}
|
|
865
861
|
}
|
|
866
862
|
}
|
|
@@ -868,10 +864,7 @@ declare global {
|
|
|
868
864
|
|
|
869
865
|
declare global {
|
|
870
866
|
interface HTMLElementTagNameMap {
|
|
871
|
-
'gs-
|
|
872
|
-
}
|
|
873
|
-
interface HTMLElementEventMap {
|
|
874
|
-
'gs-text-input-changed': TextInputChangedEvent;
|
|
867
|
+
'gs-mutation-comparison-component': MutationComparisonComponent;
|
|
875
868
|
}
|
|
876
869
|
}
|
|
877
870
|
|
|
@@ -879,7 +872,7 @@ declare global {
|
|
|
879
872
|
declare global {
|
|
880
873
|
namespace JSX {
|
|
881
874
|
interface IntrinsicElements {
|
|
882
|
-
'gs-
|
|
875
|
+
'gs-mutation-comparison-component': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
883
876
|
}
|
|
884
877
|
}
|
|
885
878
|
}
|
|
@@ -887,10 +880,7 @@ declare global {
|
|
|
887
880
|
|
|
888
881
|
declare global {
|
|
889
882
|
interface HTMLElementTagNameMap {
|
|
890
|
-
'gs-
|
|
891
|
-
}
|
|
892
|
-
interface HTMLElementEventMap {
|
|
893
|
-
'gs-location-changed': LocationChangedEvent;
|
|
883
|
+
'gs-mutations-component': MutationsComponent;
|
|
894
884
|
}
|
|
895
885
|
}
|
|
896
886
|
|
|
@@ -898,7 +888,7 @@ declare global {
|
|
|
898
888
|
declare global {
|
|
899
889
|
namespace JSX {
|
|
900
890
|
interface IntrinsicElements {
|
|
901
|
-
'gs-
|
|
891
|
+
'gs-mutations-component': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
902
892
|
}
|
|
903
893
|
}
|
|
904
894
|
}
|
|
@@ -906,10 +896,7 @@ declare global {
|
|
|
906
896
|
|
|
907
897
|
declare global {
|
|
908
898
|
interface HTMLElementTagNameMap {
|
|
909
|
-
'gs-
|
|
910
|
-
}
|
|
911
|
-
interface HTMLElementEventMap {
|
|
912
|
-
'gs-lineage-filter-changed': LineageFilterChangedEvent;
|
|
899
|
+
'gs-prevalence-over-time': PrevalenceOverTimeComponent;
|
|
913
900
|
}
|
|
914
901
|
}
|
|
915
902
|
|
|
@@ -917,7 +904,7 @@ declare global {
|
|
|
917
904
|
declare global {
|
|
918
905
|
namespace JSX {
|
|
919
906
|
interface IntrinsicElements {
|
|
920
|
-
'gs-
|
|
907
|
+
'gs-prevalence-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
921
908
|
}
|
|
922
909
|
}
|
|
923
910
|
}
|
|
@@ -925,10 +912,7 @@ declare global {
|
|
|
925
912
|
|
|
926
913
|
declare global {
|
|
927
914
|
interface HTMLElementTagNameMap {
|
|
928
|
-
'gs-
|
|
929
|
-
}
|
|
930
|
-
interface HTMLElementEventMap {
|
|
931
|
-
'gs-mutation-filter-changed': CustomEvent<MutationsFilter>;
|
|
915
|
+
'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
|
|
932
916
|
}
|
|
933
917
|
}
|
|
934
918
|
|
|
@@ -936,7 +920,7 @@ declare global {
|
|
|
936
920
|
declare global {
|
|
937
921
|
namespace JSX {
|
|
938
922
|
interface IntrinsicElements {
|
|
939
|
-
'gs-
|
|
923
|
+
'gs-relative-growth-advantage': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
940
924
|
}
|
|
941
925
|
}
|
|
942
926
|
}
|
|
@@ -944,7 +928,7 @@ declare global {
|
|
|
944
928
|
|
|
945
929
|
declare global {
|
|
946
930
|
interface HTMLElementTagNameMap {
|
|
947
|
-
'gs-
|
|
931
|
+
'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
|
|
948
932
|
}
|
|
949
933
|
}
|
|
950
934
|
|
|
@@ -952,7 +936,7 @@ declare global {
|
|
|
952
936
|
declare global {
|
|
953
937
|
namespace JSX {
|
|
954
938
|
interface IntrinsicElements {
|
|
955
|
-
'gs-
|
|
939
|
+
'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
956
940
|
}
|
|
957
941
|
}
|
|
958
942
|
}
|
|
@@ -960,7 +944,7 @@ declare global {
|
|
|
960
944
|
|
|
961
945
|
declare global {
|
|
962
946
|
interface HTMLElementTagNameMap {
|
|
963
|
-
'gs-
|
|
947
|
+
'gs-aggregate': AggregateComponent;
|
|
964
948
|
}
|
|
965
949
|
}
|
|
966
950
|
|
|
@@ -968,7 +952,7 @@ declare global {
|
|
|
968
952
|
declare global {
|
|
969
953
|
namespace JSX {
|
|
970
954
|
interface IntrinsicElements {
|
|
971
|
-
'gs-
|
|
955
|
+
'gs-aggregate': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
972
956
|
}
|
|
973
957
|
}
|
|
974
958
|
}
|
|
@@ -976,7 +960,7 @@ declare global {
|
|
|
976
960
|
|
|
977
961
|
declare global {
|
|
978
962
|
interface HTMLElementTagNameMap {
|
|
979
|
-
'gs-
|
|
963
|
+
'gs-mutations-over-time': MutationsOverTimeComponent;
|
|
980
964
|
}
|
|
981
965
|
}
|
|
982
966
|
|
|
@@ -984,7 +968,7 @@ declare global {
|
|
|
984
968
|
declare global {
|
|
985
969
|
namespace JSX {
|
|
986
970
|
interface IntrinsicElements {
|
|
987
|
-
'gs-
|
|
971
|
+
'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
988
972
|
}
|
|
989
973
|
}
|
|
990
974
|
}
|
|
@@ -992,7 +976,7 @@ declare global {
|
|
|
992
976
|
|
|
993
977
|
declare global {
|
|
994
978
|
interface HTMLElementTagNameMap {
|
|
995
|
-
'gs-
|
|
979
|
+
'gs-sequences-by-location': SequencesByLocationComponent;
|
|
996
980
|
}
|
|
997
981
|
}
|
|
998
982
|
|
|
@@ -1000,7 +984,7 @@ declare global {
|
|
|
1000
984
|
declare global {
|
|
1001
985
|
namespace JSX {
|
|
1002
986
|
interface IntrinsicElements {
|
|
1003
|
-
'gs-
|
|
987
|
+
'gs-sequences-by-location': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
1004
988
|
}
|
|
1005
989
|
}
|
|
1006
990
|
}
|
|
@@ -1008,7 +992,7 @@ declare global {
|
|
|
1008
992
|
|
|
1009
993
|
declare global {
|
|
1010
994
|
interface HTMLElementTagNameMap {
|
|
1011
|
-
'gs-
|
|
995
|
+
'gs-statistics': StatisticsComponent;
|
|
1012
996
|
}
|
|
1013
997
|
}
|
|
1014
998
|
|
|
@@ -1016,7 +1000,7 @@ declare global {
|
|
|
1016
1000
|
declare global {
|
|
1017
1001
|
namespace JSX {
|
|
1018
1002
|
interface IntrinsicElements {
|
|
1019
|
-
'gs-
|
|
1003
|
+
'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
1020
1004
|
}
|
|
1021
1005
|
}
|
|
1022
1006
|
}
|
|
@@ -1024,7 +1008,11 @@ declare global {
|
|
|
1024
1008
|
|
|
1025
1009
|
declare global {
|
|
1026
1010
|
interface HTMLElementTagNameMap {
|
|
1027
|
-
'gs-
|
|
1011
|
+
'gs-date-range-filter': DateRangeFilterComponent;
|
|
1012
|
+
}
|
|
1013
|
+
interface HTMLElementEventMap {
|
|
1014
|
+
'gs-date-range-filter-changed': CustomEvent<Record<string, string>>;
|
|
1015
|
+
'gs-date-range-option-changed': DateRangeOptionChangedEvent;
|
|
1028
1016
|
}
|
|
1029
1017
|
}
|
|
1030
1018
|
|
|
@@ -1032,7 +1020,7 @@ declare global {
|
|
|
1032
1020
|
declare global {
|
|
1033
1021
|
namespace JSX {
|
|
1034
1022
|
interface IntrinsicElements {
|
|
1035
|
-
'gs-
|
|
1023
|
+
'gs-date-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
1036
1024
|
}
|
|
1037
1025
|
}
|
|
1038
1026
|
}
|
|
@@ -1040,7 +1028,10 @@ declare global {
|
|
|
1040
1028
|
|
|
1041
1029
|
declare global {
|
|
1042
1030
|
interface HTMLElementTagNameMap {
|
|
1043
|
-
'gs-
|
|
1031
|
+
'gs-location-filter': LocationFilterComponent;
|
|
1032
|
+
}
|
|
1033
|
+
interface HTMLElementEventMap {
|
|
1034
|
+
'gs-location-changed': LocationChangedEvent;
|
|
1044
1035
|
}
|
|
1045
1036
|
}
|
|
1046
1037
|
|
|
@@ -1048,7 +1039,7 @@ declare global {
|
|
|
1048
1039
|
declare global {
|
|
1049
1040
|
namespace JSX {
|
|
1050
1041
|
interface IntrinsicElements {
|
|
1051
|
-
'gs-
|
|
1042
|
+
'gs-location-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
1052
1043
|
}
|
|
1053
1044
|
}
|
|
1054
1045
|
}
|
|
@@ -1056,7 +1047,10 @@ declare global {
|
|
|
1056
1047
|
|
|
1057
1048
|
declare global {
|
|
1058
1049
|
interface HTMLElementTagNameMap {
|
|
1059
|
-
'gs-
|
|
1050
|
+
'gs-text-filter': TextFilterComponent;
|
|
1051
|
+
}
|
|
1052
|
+
interface HTMLElementEventMap {
|
|
1053
|
+
'gs-text-filter-changed': TextFilterChangedEvent;
|
|
1060
1054
|
}
|
|
1061
1055
|
}
|
|
1062
1056
|
|
|
@@ -1064,7 +1058,7 @@ declare global {
|
|
|
1064
1058
|
declare global {
|
|
1065
1059
|
namespace JSX {
|
|
1066
1060
|
interface IntrinsicElements {
|
|
1067
|
-
'gs-
|
|
1061
|
+
'gs-text-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
1068
1062
|
}
|
|
1069
1063
|
}
|
|
1070
1064
|
}
|
|
@@ -1072,7 +1066,10 @@ declare global {
|
|
|
1072
1066
|
|
|
1073
1067
|
declare global {
|
|
1074
1068
|
interface HTMLElementTagNameMap {
|
|
1075
|
-
'gs-
|
|
1069
|
+
'gs-lineage-filter': LineageFilterComponent;
|
|
1070
|
+
}
|
|
1071
|
+
interface HTMLElementEventMap {
|
|
1072
|
+
'gs-lineage-filter-changed': LineageFilterChangedEvent;
|
|
1076
1073
|
}
|
|
1077
1074
|
}
|
|
1078
1075
|
|
|
@@ -1080,7 +1077,7 @@ declare global {
|
|
|
1080
1077
|
declare global {
|
|
1081
1078
|
namespace JSX {
|
|
1082
1079
|
interface IntrinsicElements {
|
|
1083
|
-
'gs-
|
|
1080
|
+
'gs-lineage-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
1084
1081
|
}
|
|
1085
1082
|
}
|
|
1086
1083
|
}
|
|
@@ -1088,7 +1085,10 @@ declare global {
|
|
|
1088
1085
|
|
|
1089
1086
|
declare global {
|
|
1090
1087
|
interface HTMLElementTagNameMap {
|
|
1091
|
-
'gs-
|
|
1088
|
+
'gs-mutation-filter': MutationFilterComponent;
|
|
1089
|
+
}
|
|
1090
|
+
interface HTMLElementEventMap {
|
|
1091
|
+
'gs-mutation-filter-changed': CustomEvent<MutationsFilter>;
|
|
1092
1092
|
}
|
|
1093
1093
|
}
|
|
1094
1094
|
|
|
@@ -1096,7 +1096,7 @@ declare global {
|
|
|
1096
1096
|
declare global {
|
|
1097
1097
|
namespace JSX {
|
|
1098
1098
|
interface IntrinsicElements {
|
|
1099
|
-
'gs-
|
|
1099
|
+
'gs-mutation-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
1100
1100
|
}
|
|
1101
1101
|
}
|
|
1102
1102
|
}
|
package/dist/util.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { D, a, L, T, d, v } from "./LineageFilterChangedEvent-
|
|
1
|
+
import { D, a, L, T, d, v } from "./LineageFilterChangedEvent-COWV-Y0k.js";
|
|
2
2
|
export {
|
|
3
3
|
D as DateRangeOptionChangedEvent,
|
|
4
4
|
a as LineageFilterChangedEvent,
|
|
5
5
|
L as LocationChangedEvent,
|
|
6
|
-
T as
|
|
6
|
+
T as TextFilterChangedEvent,
|
|
7
7
|
d as dateRangeOptionPresets,
|
|
8
8
|
v as views
|
|
9
9
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@genspectrum/dashboard-components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.15.0",
|
|
4
4
|
"description": "GenSpectrum web components for building dashboards",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "AGPL-3.0-only",
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"types": "dist/genspectrum-components.d.ts",
|
|
10
10
|
"repository": {
|
|
11
11
|
"type": "git",
|
|
12
|
-
"url": "https://github.com/GenSpectrum/dashboard-components.git",
|
|
12
|
+
"url": "git+https://github.com/GenSpectrum/dashboard-components.git",
|
|
13
13
|
"directory": "components"
|
|
14
14
|
},
|
|
15
15
|
"publishConfig": {
|
package/src/lapisApi/lapisApi.ts
CHANGED
|
@@ -146,7 +146,7 @@ async function callLapis(
|
|
|
146
146
|
const handleErrors = async (response: Response, requestedData: string) => {
|
|
147
147
|
if (!response.ok) {
|
|
148
148
|
if (response.status >= 400 && response.status < 500) {
|
|
149
|
-
const json = await response.json();
|
|
149
|
+
const json = (await response.json()) as unknown;
|
|
150
150
|
|
|
151
151
|
const lapisErrorResult = lapisError.safeParse(json);
|
|
152
152
|
if (lapisErrorResult.success) {
|
|
@@ -23,6 +23,6 @@ describe('FillMissingOperator', () => {
|
|
|
23
23
|
(id) => ({ id }),
|
|
24
24
|
);
|
|
25
25
|
const result = await query.evaluate('lapis');
|
|
26
|
-
|
|
26
|
+
expectEqualAfterSorting(result.content, [{ id: 1 }, { id: 2 }, { id: 3 }], (a, b) => a.id - b.id);
|
|
27
27
|
});
|
|
28
28
|
});
|
|
@@ -14,7 +14,7 @@ describe('GroupByAndSumOperator', () => {
|
|
|
14
14
|
|
|
15
15
|
const query = new GroupByAndSumOperator(child, 'lineage', 'n');
|
|
16
16
|
const result = await query.evaluate('lapis');
|
|
17
|
-
|
|
17
|
+
expectEqualAfterSorting(
|
|
18
18
|
result.content,
|
|
19
19
|
[
|
|
20
20
|
{ lineage: 'A', n: 3 },
|
|
@@ -17,7 +17,7 @@ describe('GroupByOperator', () => {
|
|
|
17
17
|
n: values.length,
|
|
18
18
|
}));
|
|
19
19
|
const resultCount = await queryCount.evaluate('lapis');
|
|
20
|
-
|
|
20
|
+
expectEqualAfterSorting(
|
|
21
21
|
resultCount.content,
|
|
22
22
|
[
|
|
23
23
|
{ lineage: 'A', n: 2 },
|
|
@@ -31,7 +31,7 @@ describe('GroupByOperator', () => {
|
|
|
31
31
|
n: values.reduce((a, b) => a + b.n, 0),
|
|
32
32
|
}));
|
|
33
33
|
const resultSum = await querySum.evaluate('lapis');
|
|
34
|
-
|
|
34
|
+
expectEqualAfterSorting(
|
|
35
35
|
resultSum.content,
|
|
36
36
|
[
|
|
37
37
|
{ lineage: 'A', n: 3 },
|
|
@@ -8,6 +8,6 @@ describe('MapOperator', () => {
|
|
|
8
8
|
const child = new MockOperator([1, 2, 3]);
|
|
9
9
|
const query = new MapOperator(child, (x) => x * 2);
|
|
10
10
|
const result = await query.evaluate('lapis');
|
|
11
|
-
|
|
11
|
+
expect(result.content).deep.equal([2, 4, 6]);
|
|
12
12
|
});
|
|
13
13
|
});
|
|
@@ -6,6 +6,6 @@ describe('MockOperator', () => {
|
|
|
6
6
|
it('should be a mock', async () => {
|
|
7
7
|
const query = new MockOperator([1, 2, 3]);
|
|
8
8
|
const result = await query.evaluate();
|
|
9
|
-
|
|
9
|
+
expect(result.content).to.deep.equal([1, 2, 3]);
|
|
10
10
|
});
|
|
11
11
|
});
|
|
@@ -4,9 +4,11 @@ import { type Operator } from './Operator';
|
|
|
4
4
|
export class MockOperator<T> implements Operator<T> {
|
|
5
5
|
constructor(private content: T[]) {}
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
return
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
evaluate(): Promise<Dataset<T>> {
|
|
8
|
+
return new Promise((resolve) =>
|
|
9
|
+
resolve({
|
|
10
|
+
content: this.content,
|
|
11
|
+
}),
|
|
12
|
+
);
|
|
11
13
|
}
|
|
12
14
|
}
|
|
@@ -8,6 +8,6 @@ describe('SortOperator', () => {
|
|
|
8
8
|
const child = new MockOperator([3, 1, 2]);
|
|
9
9
|
const query = new SortOperator(child, (a, b) => a - b);
|
|
10
10
|
const result = await query.evaluate('lapis');
|
|
11
|
-
|
|
11
|
+
expect(result.content).deep.equal([1, 2, 3]);
|
|
12
12
|
});
|
|
13
13
|
});
|
|
@@ -104,7 +104,7 @@ export const WithEmptyFieldString: StoryObj<AggregateProps> = {
|
|
|
104
104
|
fields: [''],
|
|
105
105
|
},
|
|
106
106
|
play: async ({ canvasElement, step }) => {
|
|
107
|
-
step('expect error message', async () => {
|
|
107
|
+
await step('expect error message', async () => {
|
|
108
108
|
await expectInvalidAttributesErrorMessage(canvasElement, 'String must contain at least 1 character(s)');
|
|
109
109
|
});
|
|
110
110
|
},
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { type StoryObj } from '@storybook/preact';
|
|
2
2
|
import { type Meta } from '@storybook/web-components';
|
|
3
3
|
|
|
4
|
-
import { CsvDownloadButton, type CsvDownloadButtonProps } from './csv-download-button';
|
|
4
|
+
import { CsvDownloadButton, type CsvDownloadButtonProps, type DataValue } from './csv-download-button';
|
|
5
5
|
|
|
6
6
|
const meta: Meta<CsvDownloadButtonProps> = {
|
|
7
7
|
title: 'Component/CSV Download Button',
|
|
@@ -10,7 +10,7 @@ const meta: Meta<CsvDownloadButtonProps> = {
|
|
|
10
10
|
|
|
11
11
|
export default meta;
|
|
12
12
|
|
|
13
|
-
export const DownloadButton: StoryObj = {
|
|
13
|
+
export const DownloadButton: StoryObj<CsvDownloadButtonProps & { data: Record<string, DataValue>[] }> = {
|
|
14
14
|
render: (args) => {
|
|
15
15
|
return <CsvDownloadButton label={args.label} filename={args.filename} getData={() => args.data} />;
|
|
16
16
|
},
|
|
@@ -4,7 +4,7 @@ type ToStringable = {
|
|
|
4
4
|
toString: () => string;
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
type DataValue = string | number | boolean | null | ToStringable;
|
|
7
|
+
export type DataValue = string | number | boolean | null | undefined | ToStringable;
|
|
8
8
|
|
|
9
9
|
export interface CsvDownloadButtonProps {
|
|
10
10
|
label?: string;
|
|
@@ -2,7 +2,7 @@ import { type Meta, type StoryObj } from '@storybook/preact';
|
|
|
2
2
|
import { expect, waitFor, within } from '@storybook/test';
|
|
3
3
|
import z from 'zod';
|
|
4
4
|
|
|
5
|
-
import { ErrorBoundary } from './error-boundary';
|
|
5
|
+
import { ErrorBoundary, type ErrorBoundaryProps } from './error-boundary';
|
|
6
6
|
import { UserFacingError } from './error-display';
|
|
7
7
|
|
|
8
8
|
const meta: Meta = {
|
|
@@ -28,7 +28,7 @@ const someSchema = z.object({
|
|
|
28
28
|
const someValidProps = { test: 'someValue' };
|
|
29
29
|
const someInvalidProps = { test: '' };
|
|
30
30
|
|
|
31
|
-
export const ErrorBoundaryWithoutErrorStory: StoryObj = {
|
|
31
|
+
export const ErrorBoundaryWithoutErrorStory: StoryObj<ErrorBoundaryProps<typeof someValidProps>> = {
|
|
32
32
|
render: (args) => (
|
|
33
33
|
<ErrorBoundary size={args.size} schema={someSchema} componentProps={someValidProps}>
|
|
34
34
|
<div>Some content</div>
|
|
@@ -41,7 +41,7 @@ export const ErrorBoundaryWithoutErrorStory: StoryObj = {
|
|
|
41
41
|
},
|
|
42
42
|
};
|
|
43
43
|
|
|
44
|
-
export const ErrorBoundaryWithErrorStory: StoryObj = {
|
|
44
|
+
export const ErrorBoundaryWithErrorStory: StoryObj<ErrorBoundaryProps<typeof someValidProps>> = {
|
|
45
45
|
render: (args) => (
|
|
46
46
|
<ErrorBoundary size={args.size} schema={someSchema} componentProps={someValidProps}>
|
|
47
47
|
<ContentThatThrowsError error={() => new Error('Some error')} />
|
|
@@ -55,7 +55,7 @@ export const ErrorBoundaryWithErrorStory: StoryObj = {
|
|
|
55
55
|
},
|
|
56
56
|
};
|
|
57
57
|
|
|
58
|
-
export const ErrorBoundaryWithParsingErrorStory: StoryObj = {
|
|
58
|
+
export const ErrorBoundaryWithParsingErrorStory: StoryObj<ErrorBoundaryProps<typeof someValidProps>> = {
|
|
59
59
|
render: (args) => (
|
|
60
60
|
<ErrorBoundary size={args.size} schema={someSchema} componentProps={someInvalidProps}>
|
|
61
61
|
<ContentThatThrowsError error={() => new Error('Some error')} />
|
|
@@ -69,7 +69,7 @@ export const ErrorBoundaryWithParsingErrorStory: StoryObj = {
|
|
|
69
69
|
},
|
|
70
70
|
};
|
|
71
71
|
|
|
72
|
-
export const ErrorBoundaryWithUserFacingErrorStory: StoryObj = {
|
|
72
|
+
export const ErrorBoundaryWithUserFacingErrorStory: StoryObj<ErrorBoundaryProps<typeof someValidProps>> = {
|
|
73
73
|
render: (args) => (
|
|
74
74
|
<ErrorBoundary size={args.size} schema={someSchema} componentProps={someValidProps}>
|
|
75
75
|
<ContentThatThrowsError error={() => new UserFacingError('Error Headline', 'Some error')} />
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { type RenderableProps } from 'preact';
|
|
2
|
-
import { useErrorBoundary, useMemo } from 'preact/hooks';
|
|
2
|
+
import { useEffect, useErrorBoundary, useMemo } from 'preact/hooks';
|
|
3
3
|
import { type ZodSchema } from 'zod';
|
|
4
4
|
|
|
5
5
|
import { ErrorDisplay, type ErrorDisplayProps, InvalidPropsError } from './error-display';
|
|
6
6
|
import { ResizeContainer, type Size } from './resize-container';
|
|
7
7
|
|
|
8
|
-
type ErrorBoundaryProps<T> = {
|
|
8
|
+
export type ErrorBoundaryProps<T> = {
|
|
9
9
|
size: Size;
|
|
10
10
|
componentProps: T;
|
|
11
11
|
schema: ZodSchema<T>;
|
|
@@ -19,13 +19,24 @@ export const ErrorBoundary = <T extends Record<string, unknown>>({
|
|
|
19
19
|
schema,
|
|
20
20
|
children,
|
|
21
21
|
}: RenderableProps<ErrorBoundaryProps<T>>) => {
|
|
22
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- useErrorBoundary unfortunately return `[any, ...]`
|
|
22
23
|
const [internalError, resetError] = useErrorBoundary();
|
|
23
24
|
const componentPropsParseError = useCheckComponentProps(schema, componentProps);
|
|
24
25
|
|
|
26
|
+
useEffect(
|
|
27
|
+
() => {
|
|
28
|
+
if (internalError) {
|
|
29
|
+
resetError();
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps -- this should run if and only if the props of the component change
|
|
33
|
+
[componentProps],
|
|
34
|
+
);
|
|
35
|
+
|
|
25
36
|
if (internalError) {
|
|
26
37
|
return (
|
|
27
38
|
<ResizeContainer size={size}>
|
|
28
|
-
<ErrorDisplay error={internalError} resetError={resetError} layout={layout} />
|
|
39
|
+
<ErrorDisplay error={internalError as Error} resetError={resetError} layout={layout} />
|
|
29
40
|
</ResizeContainer>
|
|
30
41
|
);
|
|
31
42
|
}
|
|
@@ -39,12 +39,12 @@ export const UserFacingErrorStory: StoryObj = {
|
|
|
39
39
|
const error = canvas.getByText('Oops! Something went wrong.', { exact: false });
|
|
40
40
|
const detailMessage = () => canvas.getByText('some message');
|
|
41
41
|
await waitFor(() => expect(error).toBeInTheDocument());
|
|
42
|
-
await waitFor(() => {
|
|
43
|
-
expect(detailMessage()).not.toBeVisible();
|
|
42
|
+
await waitFor(async () => {
|
|
43
|
+
await expect(detailMessage()).not.toBeVisible();
|
|
44
44
|
});
|
|
45
45
|
await userEvent.click(canvas.getByText('Show details.'));
|
|
46
|
-
await waitFor(() => {
|
|
47
|
-
expect(detailMessage()).toBeVisible();
|
|
46
|
+
await waitFor(async () => {
|
|
47
|
+
await expect(detailMessage()).toBeVisible();
|
|
48
48
|
});
|
|
49
49
|
},
|
|
50
50
|
};
|
|
@@ -60,9 +60,9 @@ export const FiresEvent: StoryObj = {
|
|
|
60
60
|
const listenerMock = fn();
|
|
61
61
|
canvasElement.addEventListener('gs-error', listenerMock);
|
|
62
62
|
|
|
63
|
-
await waitFor(() => {
|
|
64
|
-
expect(listenerMock.mock.calls.at(-1)![0].error.name).toStrictEqual('UserFacingError');
|
|
65
|
-
expect(listenerMock.mock.calls.at(-1)![0].error.message).toStrictEqual('some message');
|
|
63
|
+
await waitFor(async () => {
|
|
64
|
+
await expect(listenerMock.mock.calls.at(-1)![0].error.name).toStrictEqual('UserFacingError');
|
|
65
|
+
await expect(listenerMock.mock.calls.at(-1)![0].error.message).toStrictEqual('some message');
|
|
66
66
|
});
|
|
67
67
|
},
|
|
68
68
|
};
|
|
@@ -81,8 +81,8 @@ export const TriggersResetErrorOnReloadButton: StoryObj = {
|
|
|
81
81
|
|
|
82
82
|
await userEvent.click(canvas.getByText('Try again'));
|
|
83
83
|
|
|
84
|
-
await waitFor(() => {
|
|
85
|
-
expect(resetErrorMock).toHaveBeenCalled();
|
|
84
|
+
await waitFor(async () => {
|
|
85
|
+
await expect(resetErrorMock).toHaveBeenCalled();
|
|
86
86
|
});
|
|
87
87
|
},
|
|
88
88
|
};
|
|
@@ -6,14 +6,14 @@ export const Fullscreen = () => {
|
|
|
6
6
|
return (
|
|
7
7
|
<button
|
|
8
8
|
ref={element}
|
|
9
|
-
onClick={
|
|
9
|
+
onClick={() => {
|
|
10
10
|
if (element.current) {
|
|
11
11
|
if (isFullscreen) {
|
|
12
|
-
|
|
12
|
+
void document.exitFullscreen();
|
|
13
13
|
} else {
|
|
14
14
|
const componentRoot = findComponentRoot(element.current);
|
|
15
15
|
if (componentRoot) {
|
|
16
|
-
|
|
16
|
+
void componentRoot.requestFullscreen();
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
}
|
|
@@ -97,7 +97,7 @@ function componentParametersToCode(componentName: string, params: object, lapisU
|
|
|
97
97
|
|
|
98
98
|
const attributes = indentLines(
|
|
99
99
|
Object.entries(params)
|
|
100
|
-
.map(([key, value]) => `${key}='${stringifyIfNeeded(value)}'`)
|
|
100
|
+
.map(([key, value]) => `${key}='${stringifyIfNeeded(value) as string}'`)
|
|
101
101
|
.join('\n'),
|
|
102
102
|
4,
|
|
103
103
|
);
|
|
@@ -108,7 +108,7 @@ export const OneTypesSelected: StoryObj<MutationTypeSelectorProps> = {
|
|
|
108
108
|
const canvas = within(canvasElement);
|
|
109
109
|
|
|
110
110
|
await step('Show the selected type as label', async () => {
|
|
111
|
-
const substitutionElements =
|
|
111
|
+
const substitutionElements = canvas.getAllByText('Substitution');
|
|
112
112
|
await expect(substitutionElements.length).toBe(2);
|
|
113
113
|
});
|
|
114
114
|
},
|