Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 2b9de40

Browse files
kamal-qureshikamal-qureshi
committed
Updated navigation app for settings and JS
1 parent 524bc75 commit 2b9de40

File tree

3 files changed

+31
-23
lines changed

3 files changed

+31
-23
lines changed

‎client/packages/lowcoder/src/comps/comps/appSettingsComp.tsx

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -233,7 +233,11 @@ type ChildrenInstance = RecordConstructorToComp<typeof childrenMap> & {
233233
defaultTheme: string;
234234
};
235235

236-
function AppGeneralSettingsModal(props: ChildrenInstance) {
236+
type AppSettingsExtraProps = { isAggregationApp?: boolean };
237+
type AppGeneralSettingsModalProps = ChildrenInstance & AppSettingsExtraProps;
238+
type AppCanvasSettingsModalProps = ChildrenInstance & AppSettingsExtraProps;
239+
240+
function AppGeneralSettingsModal(props: AppGeneralSettingsModalProps) {
237241
const lowcoderCompsMeta = useSelector((state: AppState) => state.npmPlugin.packageMeta['lowcoder-comps']);
238242
const [lowcoderCompVersions, setLowcoderCompVersions] = useState(['latest']);
239243
const {
@@ -243,6 +247,7 @@ function AppGeneralSettingsModal(props: ChildrenInstance) {
243247
category,
244248
showHeaderInPublic,
245249
lowcoderCompVersion,
250+
isAggregationApp
246251
} = props;
247252

248253
useEffect(() => {
@@ -288,7 +293,8 @@ function AppGeneralSettingsModal(props: ChildrenInstance) {
288293
</div>
289294
</DivStyled>
290295
</BaseSection>
291-
<BaseSection
296+
{!isAggregationApp &&
297+
<BaseSection
292298
name={"Lowcoder Comps"}
293299
width={288}
294300
noMargin
@@ -319,7 +325,7 @@ function AppGeneralSettingsModal(props: ChildrenInstance) {
319325
}}
320326
/>
321327
</DivStyled>
322-
</BaseSection>
328+
</BaseSection>}
323329
<BaseSection
324330
name={"Shortcuts"}
325331
width={288}
@@ -337,7 +343,7 @@ function AppGeneralSettingsModal(props: ChildrenInstance) {
337343
);
338344
}
339345

340-
function AppCanvasSettingsModal(props: ChildrenInstance) {
346+
function AppCanvasSettingsModal(props: AppCanvasSettingsModalProps) {
341347
const isPublicApp = useSelector(isPublicApplication);
342348
const {
343349
themeList,
@@ -516,13 +522,12 @@ export const AppSettingsComp = new MultiCompBuilder(childrenMap, (props) => {
516522
maxWidth: Number(props.maxWidth),
517523
};
518524
})
519-
.setPropertyViewFn((children) => {
525+
.setPropertyViewFn((children, extraProps) => {
520526
const { settingType } = useContext(AppSettingContext);
521527
const themeList = useSelector(getThemeList) || [];
522528
const defaultTheme = (useSelector(getDefaultTheme) || "").toString();
523-
524529
return settingType === 'canvas'
525-
? <AppCanvasSettingsModal {...children} themeList={themeList} defaultTheme={defaultTheme} />
526-
: <AppGeneralSettingsModal {...children} themeList={themeList} defaultTheme={defaultTheme} />;
530+
? <AppCanvasSettingsModal {...children} themeList={themeList} defaultTheme={defaultTheme} {...(extraProps || {})} />
531+
: <AppGeneralSettingsModal {...children} themeList={themeList} defaultTheme={defaultTheme} {...(extraProps || {})} />;
527532
})
528533
.build();

‎client/packages/lowcoder/src/comps/generators/multi.tsx

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -51,9 +51,10 @@ export type ViewFnTypeForComp<ViewReturn, ChildrenCompMap> = ViewFnType<
5151
ViewReturn,
5252
ToViewReturn<ChildrenCompMap>
5353
>;
54-
export type PropertyViewFnTypeForComp<ChildrenCompMap> = (
54+
export type PropertyViewFnTypeForComp<ChildrenCompMap, ExtraProps = any> = (
5555
children: ChildrenCompMap,
56-
dispatch: (action: CompAction) => void
56+
dispatch: (action: CompAction) => void,
57+
extraProps?: ExtraProps
5758
) => ReactNode;
5859

5960
export function parseChildrenFromValueAndChildrenMap<
@@ -83,10 +84,10 @@ export function parseChildrenFromValueAndChildrenMap<
8384
* Building comp this way can use typescript's type inference capabilities.
8485
* Using ChildrenCompMap as a generic is to retain the information of each class, such as not wanting StringControl to degenerate into Comp<string>
8586
*/
86-
export class MultiCompBuilder<ViewReturn, ChildrenCompMap extends Record<string, Comp<unknown>>> {
87+
export class MultiCompBuilder<ViewReturn, ChildrenCompMap extends Record<string, Comp<unknown>>, ExtraProps = any> {
8788
private childrenMap: ToConstructor<ChildrenCompMap>;
8889
private viewFn: ViewFnTypeForComp<ViewReturn, ChildrenCompMap>;
89-
private propertyViewFn?: PropertyViewFnTypeForComp<ChildrenCompMap>;
90+
private propertyViewFn?: PropertyViewFnTypeForComp<ChildrenCompMap, ExtraProps>;
9091

9192
/**
9293
* If viewFn is not placed in the constructor, the type of ViewReturn cannot be inferred
@@ -99,7 +100,7 @@ export class MultiCompBuilder<ViewReturn, ChildrenCompMap extends Record<string,
99100
this.viewFn = viewFn;
100101
}
101102

102-
setPropertyViewFn(propertyViewFn: PropertyViewFnTypeForComp<ChildrenCompMap>) {
103+
setPropertyViewFn(propertyViewFn: PropertyViewFnTypeForComp<ChildrenCompMap, ExtraProps>) {
103104
this.propertyViewFn = propertyViewFn;
104105
return this;
105106
}
@@ -129,8 +130,8 @@ export class MultiCompBuilder<ViewReturn, ChildrenCompMap extends Record<string,
129130
);
130131
}
131132

132-
override getPropertyView(): ReactNode {
133-
return <PropertyView comp={this} propertyViewFn={builder.propertyViewFn} />;
133+
override getPropertyView(extraProps?: ExtraProps): ReactNode {
134+
return <PropertyView comp={this} propertyViewFn={builder.propertyViewFn} extraProps={extraProps} />;
134135
}
135136
}
136137

@@ -141,12 +142,12 @@ export class MultiCompBuilder<ViewReturn, ChildrenCompMap extends Record<string,
141142
/**
142143
* Guaranteed to be in a react component, so that react hooks can be used internally
143144
*/
144-
export function PropertyView(props: { comp: any; propertyViewFn: any }) {
145+
export function PropertyView(props: { comp: any; propertyViewFn: any; extraProps?: any }) {
145146
const comp = props.comp;
146147
if (!props.propertyViewFn) {
147148
return null;
148149
}
149-
return props.propertyViewFn(comp.children, comp.dispatch);
150+
return props.propertyViewFn(comp.children, comp.dispatch, props.extraProps);
150151
}
151152

152153
export function childrenToProps<ChildrenCompMap extends Record<string, Comp<unknown>>>(

‎client/packages/lowcoder/src/pages/editor/editorView.tsx

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -337,7 +337,11 @@ const aggregationSiderItems = [
337337
{
338338
key: SiderKey.Setting,
339339
icon: <LeftSettingIcon />,
340-
}
340+
},
341+
{
342+
key: SiderKey.JS,
343+
icon: <LeftJSSettingIcon />,
344+
},
341345
];
342346

343347
const DeviceWrapper = ({
@@ -706,11 +710,9 @@ function EditorView(props: EditorViewProps) {
706710
<SettingsDiv>
707711
<ScrollBar>
708712
{application &&
709-
!isAggregationApp(
710-
AppUILayoutType[application.applicationType]
711-
) && (
713+
(
712714
<>
713-
{appSettingsComp.getPropertyView()}
715+
{appSettingsComp.getPropertyView({ isAggregationApp: isAggregationApp(AppUILayoutType[application.applicationType]) })}
714716
</>
715717
)}
716718
</ScrollBar>
@@ -724,7 +726,7 @@ function EditorView(props: EditorViewProps) {
724726
AppUILayoutType[application.applicationType]
725727
) && (
726728
<>
727-
{appSettingsComp.getPropertyView()}
729+
{appSettingsComp.getPropertyView({ isAggregationApp: isAggregationApp(AppUILayoutType[application.applicationType]) })}
728730
</>
729731
)}
730732
</ScrollBar>

0 commit comments

Comments
 (0)