Skip to content

Commit d745b00

Browse files
committed
feat: select comp search options enable js mode
fix: hidden comp in module fix(BoolControl): fix BoolControl's changeDispatch
1 parent 0ffa425 commit d745b00

File tree

21 files changed

+141
-83
lines changed

21 files changed

+141
-83
lines changed

client/packages/openblocks-sdk/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { AppViewInstance, bootstrapAppAt, OpenblocksAppView } from "./src/index"
44

55
const url = new URL(location.href);
66
const appId = url.searchParams.get("appId");
7-
const baseUrl = url.searchParams.get("baseUrl") || "http://localhost:3000";
7+
const baseUrl = url.searchParams.get("baseUrl") || "http://localhost:8000";
88

99
function ReactDemoApp() {
1010
const ref = useRef<AppViewInstance | null>(null);

client/packages/openblocks-sdk/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "openblocks-sdk",
3-
"version": "0.0.22",
3+
"version": "0.0.28",
44
"type": "module",
55
"files": [
66
"src",

client/packages/openblocks/src/components/EditableCell.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import _ from "lodash";
22
import { changeChildAction, DispatchType } from "openblocks-core";
33
import { constantColors } from "openblocks-design";
4-
import { ReactNode, useCallback, useEffect, useMemo, useState } from "react";
4+
import React, { ReactNode, useCallback, useEffect, useMemo, useState } from "react";
55
import styled from "styled-components";
66
import { developEnv } from "util/envUtils";
77
import { JSONValue } from "util/jsonTypes";
88

99
export const TABLE_EDITABLE_SWITCH_ON = developEnv();
10+
export const TagsContext = React.createContext<string[]>([]);
1011
export type UpdateChangeSet<T> = (value: T) => void;
1112

1213
// a top-right triangle chip
@@ -27,6 +28,7 @@ const EditableChip = styled.div`
2728
export interface CellProps {
2829
editable?: boolean;
2930
size?: string;
31+
candidateTags?: string[];
3032
}
3133
export type CellViewReturn = (props: CellProps) => ReactNode;
3234
export type EditViewFn<T> = (props: {
@@ -62,7 +64,7 @@ interface EditableCellProps<T> extends CellProps {
6264
}
6365

6466
export function EditableCell<T extends JSONValue>(props: EditableCellProps<T>) {
65-
const { dispatch, normalView, editViewFn, changeValue, baseValue } = props;
67+
const { dispatch, normalView, editViewFn, changeValue, baseValue, candidateTags } = props;
6668
const status = _.isNil(changeValue) ? "normal" : "toSave";
6769
const editable = editViewFn ? props.editable : false;
6870
const [isEditing, setIsEditing] = useState(false);
@@ -99,7 +101,7 @@ export function EditableCell<T extends JSONValue>(props: EditableCellProps<T>) {
99101
return (
100102
<>
101103
<BorderDiv />
102-
{editView}
104+
<TagsContext.Provider value={candidateTags ?? []}>{editView}</TagsContext.Provider>
103105
</>
104106
);
105107
}

client/packages/openblocks/src/comps/comps/rootComp.tsx

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,8 @@ import EditorSkeletonView from "pages/editor/editorSkeletonView";
1717
import { ThemeContext } from "comps/utils/themeContext";
1818
import { ModuleLayoutCompName } from "constants/compConstants";
1919
import { defaultTheme as localDefaultTheme } from "comps/controls/styleControlConstants";
20-
import { useSelector } from "redux/store/store";
21-
import { getDefaultTheme, getThemeList } from "redux/selectors/commonSettingSelectors";
22-
import { ThemeDetail } from "api/commonSettingApi";
2320
import { ModuleLoading } from "components/ModuleLoading";
21+
import { getGlobalSettings } from "comps/utils/globalSettings";
2422

2523
interface RootViewProps extends HTMLAttributes<HTMLDivElement> {
2624
comp: InstanceType<typeof RootComp>;
@@ -42,14 +40,14 @@ function RootView(props: RootViewProps) {
4240
const { comp, isModuleRoot, ...divProps } = props;
4341
const [editorState, setEditorState] = useState<EditorState>();
4442
const themeId = comp.children.settings.getView().themeId;
45-
const themeList = useSelector(getThemeList) || [];
46-
const defaultTheme = useSelector(getDefaultTheme);
47-
let theme = {} as ThemeDetail;
43+
const { orgCommonSettings } = getGlobalSettings();
44+
const themeList = orgCommonSettings?.themeList || [];
45+
const defaultTheme = orgCommonSettings?.defaultTheme || [];
46+
47+
let theme = localDefaultTheme;
4848
if (themeId === "default") {
4949
theme = themeList.find((theme) => theme.id === defaultTheme)?.theme || localDefaultTheme;
50-
} else if (themeId === "") {
51-
theme = localDefaultTheme;
52-
} else {
50+
} else if (themeId) {
5351
theme = themeList.find((theme) => theme.id === themeId)?.theme || localDefaultTheme;
5452
}
5553
theme = previewTheme?.previewTheme || theme;

client/packages/openblocks/src/comps/comps/selectInputComp/cascaderContants.tsx

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,20 @@
11
import { SelectEventHandlerControl } from "../../controls/eventHandlerControl";
22
import { Section, sectionNames } from "openblocks-design";
33
import { RecordConstructorToComp } from "openblocks-core";
4-
import { JSONObjectArrayControl, BoolCodeControl, StringControl } from "comps/controls/codeControl";
4+
import { BoolCodeControl, JSONObjectArrayControl, StringControl } from "comps/controls/codeControl";
55
import { arrayStringExposingStateControl } from "comps/controls/codeStateControl";
6-
import { BoolControl, BoolPureControl } from "comps/controls/boolControl";
6+
import { BoolControl } from "comps/controls/boolControl";
77
import { LabelControl } from "comps/controls/labelControl";
88
import { styleControl } from "comps/controls/styleControl";
99
import { CascaderStyle } from "comps/controls/styleControlConstants";
1010
import {
1111
allowClearPropertyView,
12-
hiddenPropertyView,
1312
disabledPropertyView,
13+
hiddenPropertyView,
1414
placeholderPropertyView,
1515
showSearchPropertyView,
1616
} from "comps/utils/propertyUtils";
17-
import { trans, i18nObjs } from "i18n";
18-
import { withDefault } from "comps/generators";
17+
import { i18nObjs, trans } from "i18n";
1918

2019
export const defaultDataSource = JSON.stringify(i18nObjs.cascader, null, " ");
2120

@@ -28,7 +27,7 @@ export const CascaderChildren = {
2827
allowClear: BoolControl,
2928
options: JSONObjectArrayControl,
3029
style: styleControl(CascaderStyle),
31-
showSearch: withDefault(BoolPureControl, true),
30+
showSearch: BoolControl.DEFAULT_TRUE,
3231
};
3332

3433
export const CascaderPropertyView = (

client/packages/openblocks/src/comps/comps/selectInputComp/selectComp.tsx

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ import {
1010
SelectInputInvalidConfig,
1111
useSelectInputValidate,
1212
} from "./selectInputConstants";
13+
import { useRef } from "react";
14+
import { RecordConstructorToView } from "openblocks-core";
1315

1416
export const SelectBasicComp = (function () {
1517
const childrenMap = {
@@ -18,8 +20,12 @@ export const SelectBasicComp = (function () {
1820
style: styleControl(SelectStyle),
1921
};
2022
return new UICompBuilder(childrenMap, (props, dispatch) => {
23+
const [validateState, handleValidate] = useSelectInputValidate(props);
24+
25+
const propsRef = useRef<RecordConstructorToView<typeof childrenMap>>(props);
26+
propsRef.current = props;
27+
2128
const valueSet = new Set<any>(props.options.map((o) => o.value)); // Filter illegal default values entered by the user
22-
const [validateState, onChange] = useSelectInputValidate(props);
2329
return props.label({
2430
required: props.required,
2531
style: props.style,
@@ -28,9 +34,10 @@ export const SelectBasicComp = (function () {
2834
{...props}
2935
value={valueSet.has(props.value.value) ? props.value.value : undefined}
3036
onChange={(value) => {
31-
onChange(value ?? "");
32-
props.value.onChange(value ?? "");
33-
props.onEvent("change");
37+
props.value.onChange(value ?? "").then(() => {
38+
propsRef.current.onEvent("change");
39+
handleValidate(value ?? "");
40+
});
3441
}}
3542
dispatch={dispatch}
3643
/>

client/packages/openblocks/src/comps/comps/selectInputComp/selectCompConstants.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import {
44
RecordConstructorToComp,
55
RecordConstructorToView,
66
} from "openblocks-core";
7-
import { BoolControl, BoolPureControl } from "../../controls/boolControl";
7+
import { BoolControl } from "../../controls/boolControl";
88
import { LabelControl } from "../../controls/labelControl";
99
import { BoolCodeControl, StringControl } from "../../controls/codeControl";
1010
import {
@@ -31,7 +31,7 @@ import {
3131
SelectStyleType,
3232
TreeSelectStyleType,
3333
} from "comps/controls/styleControlConstants";
34-
import { stateComp, withDefault } from "../../generators";
34+
import { stateComp } from "../../generators";
3535
import {
3636
allowClearPropertyView,
3737
disabledPropertyView,
@@ -165,7 +165,7 @@ export const SelectChildrenMap = {
165165
options: SelectOptionControl,
166166
allowClear: BoolControl,
167167
inputValue: stateComp<string>(""), // user's input value when search
168-
showSearch: withDefault(BoolPureControl, true),
168+
showSearch: BoolControl.DEFAULT_TRUE,
169169
...SelectInputValidationChildren,
170170
...formDataChildren,
171171
};

client/packages/openblocks/src/comps/comps/selectInputComp/selectInputConstants.tsx

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
} from "../../controls/codeStateControl";
1212
import { requiredPropertyView } from "comps/utils/propertyUtils";
1313
import { trans } from "i18n";
14-
import { useState } from "react";
14+
import { useRef, useState } from "react";
1515
import { SelectInputOptionControl } from "../../controls/optionsControl";
1616

1717
export const SelectInputValidationChildren = {
@@ -43,17 +43,21 @@ export const selectInputValidate = (
4343
};
4444

4545
export const useSelectInputValidate = (props: ValidationParams) => {
46+
const propsRef = useRef<ValidationParams>(props);
47+
propsRef.current = props;
48+
4649
const [validateState, setValidateState] = useState({});
47-
const handleChange = (value: string | (string | number)[]) => {
48-
const validateRes = selectInputValidate({
49-
...props,
50-
value: {
51-
value,
52-
},
53-
});
54-
setValidateState(validateRes);
50+
const handleValidate = (value: string | (string | number)[]) => {
51+
setValidateState(
52+
selectInputValidate({
53+
...propsRef.current,
54+
value: {
55+
value,
56+
},
57+
})
58+
);
5559
};
56-
return [validateState, handleChange] as const;
60+
return [validateState, handleValidate] as const;
5761
};
5862

5963
type ValidationCompWithValue = ValidationComp & {

client/packages/openblocks/src/comps/comps/tableComp/tableUtils.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -178,6 +178,17 @@ function renderTitle(props: { title: string; editable: boolean }) {
178178
);
179179
}
180180

181+
function getUniqueTags(column: RawColumnType) {
182+
const compType = column.render[0]
183+
? column.render[0].getComp().children.compType.getView()
184+
: undefined;
185+
const uniqueTags: string[] =
186+
column.editable && compType === "tag"
187+
? _.uniq(Object.values(column.render).map((comp) => comp.getView().value))
188+
: [];
189+
return uniqueTags;
190+
}
191+
181192
/**
182193
* convert column in raw format into antd format
183194
*/
@@ -223,6 +234,7 @@ export function columnsToAntdFormat(
223234
) {
224235
return [];
225236
}
237+
const tags = getUniqueTags(column); // warn: this costs O(n) time
226238
const title = renderTitle({ title: column.title, editable: column.editable });
227239
return {
228240
title: title,
@@ -235,7 +247,7 @@ export function columnsToAntdFormat(
235247
return column.render[record.index]
236248
.setParams({ currentIndex: index })
237249
.getView()
238-
.view({ editable: column.editable, size });
250+
.view({ editable: column.editable, size, candidateTags: tags });
239251
},
240252
...(column.sortable
241253
? {

client/packages/openblocks/src/comps/comps/treeComp/treeSelectComp.tsx

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { changeChildAction, DispatchType, RecordConstructorToView } from "openblocks-core";
22
import { UICompBuilder } from "comps/generators/uiCompBuilder";
33
import { NameConfig, withExposingConfigs } from "comps/generators/withExposing";
4-
import { Section, sectionNames } from "openblocks-design";
4+
import { Section, sectionNames, ValueFromOption } from "openblocks-design";
55
import { TreeSelect } from "antd";
66
import { useEffect } from "react";
77
import styled from "styled-components";
@@ -22,11 +22,10 @@ import {
2222
} from "./treeUtils";
2323
import { getStyle } from "../selectInputComp/selectCompConstants";
2424
import { useSelectInputValidate } from "../selectInputComp/selectInputConstants";
25-
import { ValueFromOption } from "openblocks-design";
2625
import { StringControl } from "comps/controls/codeControl";
2726
import { SelectEventHandlerControl } from "comps/controls/eventHandlerControl";
28-
import { BoolControl, BoolPureControl } from "comps/controls/boolControl";
29-
import { stateComp, withDefault } from "comps/generators/simpleGenerators";
27+
import { BoolControl } from "comps/controls/boolControl";
28+
import { stateComp } from "comps/generators/simpleGenerators";
3029
import { trans } from "i18n";
3130
import {
3231
allowClearPropertyView,
@@ -60,7 +59,7 @@ const childrenMap = {
6059
// TODO: more event
6160
onEvent: SelectEventHandlerControl,
6261
allowClear: BoolControl,
63-
showSearch: withDefault(BoolPureControl, true),
62+
showSearch: BoolControl.DEFAULT_TRUE,
6463
inputValue: stateComp<string>(""), // search value
6564
style: styleControl(TreeSelectStyle),
6665
};

client/packages/openblocks/src/comps/controls/boolControl.tsx

Lines changed: 20 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,20 @@
1-
import { AbstractComp, CompParams, SimpleComp } from "openblocks-core";
21
import { withDefault } from "comps/generators";
3-
import { Switch, SwitchWrapper } from "openblocks-design";
4-
import { SwitchJsIcon } from "openblocks-design";
5-
import { Node, ValueAndMsg } from "openblocks-core";
2+
import {
3+
AbstractComp,
4+
CompAction,
5+
CompActionTypes,
6+
CompParams,
7+
customAction,
8+
DispatchType,
9+
Node,
10+
SimpleComp,
11+
ValueAndMsg,
12+
} from "openblocks-core";
13+
import { CheckBox, Switch, SwitchJsIcon, SwitchWrapper } from "openblocks-design";
614
import { ReactNode } from "react";
715
import { setFieldsNoTypeCheck } from "util/objectUtils";
8-
import { CompAction, CompActionTypes, customAction } from "openblocks-core";
916
import { BoolCodeControl } from "./codeControl";
1017
import { ControlParams } from "./controlParams";
11-
import { CheckBox } from "openblocks-design";
1218

1319
/**
1420
* BoolControl without CodeEditor
@@ -135,6 +141,14 @@ class BoolControl extends AbstractComp<boolean, DataType, Node<ValueAndMsg<boole
135141
override nodeWithoutCache() {
136142
return this.codeControl.nodeWithoutCache();
137143
}
144+
145+
changeDispatch(dispatch: DispatchType): this {
146+
return setFieldsNoTypeCheck(
147+
super.changeDispatch(dispatch),
148+
{ codeControl: this.codeControl.changeDispatch(dispatch) },
149+
{ keepCacheKeys: ["node"] }
150+
);
151+
}
138152
}
139153

140154
const BoolDefaultTrueControl: typeof BoolControl = withDefault(BoolControl, true);

client/packages/openblocks/src/comps/controls/codeStateControl.tsx

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,14 @@
11
import { JSONObject, JSONValue } from "util/jsonTypes";
22
import {
3-
CompAction,
3+
AbstractComp,
4+
AbstractNode,
45
changeChildAction,
6+
CompAction,
57
CompActionTypes,
8+
ConstructorToView,
9+
evalNodeOrMinor,
610
updateNodesV2Action,
711
} from "openblocks-core";
8-
import { AbstractComp, ConstructorToView } from "openblocks-core";
912
import {
1013
ArrayStringControl,
1114
BoolCodeControl,
@@ -23,21 +26,21 @@ import {
2326
ExposeMethodCompConstructor,
2427
withMethodExposingBase,
2528
} from "comps/generators/withMethodExposing";
26-
import { AbstractNode, evalNodeOrMinor } from "openblocks-core";
2729
import _ from "lodash";
2830
import { ReactNode } from "react";
2931
import { memo } from "util/cacheUtils";
3032
import {
31-
toString,
32-
toNumber,
3333
toBoolean,
3434
toJSONObject,
35-
toStringArray,
3635
toJSONValue,
36+
toNumber,
37+
toString,
38+
toStringArray,
3739
toStringNumberArray,
3840
} from "util/convertUtils";
3941
import { EvalParamType, ParamConfig, ParamType } from "./actionSelector/executeCompTypes";
4042
import { trans } from "i18n";
43+
import { getPromiseAfterDispatch } from "../../util/promiseUtils";
4144

4245
export const __TMP_STATE_FIELD_NAME = "__TMP_STATE_FIELD_NAME";
4346

@@ -89,7 +92,9 @@ function withTmpState<T extends CodeControlJSONType>(
8992
}
9093

9194
change(value: ConstructorToView<T>) {
92-
this.dispatch(changeChildAction("value", value));
95+
return getPromiseAfterDispatch(this.dispatch, changeChildAction("value", value), {
96+
autoHandleAfterReduce: true,
97+
});
9398
}
9499

95100
reset() {

0 commit comments

Comments
 (0)