Skip to content

Commit 100d845

Browse files
FalkWolskyFalkWolsky
authored
Merge pull request #1411 from lowcoder-org/dev
Dev -> Main v2.5.3
2 parents 5cdf061 + dcaa670 commit 100d845

File tree

16 files changed

+194
-177
lines changed

16 files changed

+194
-177
lines changed

‎client/VERSION

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
2.5.2
1+
2.5.3

‎client/packages/lowcoder-comps/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "lowcoder-comps",
3-
"version": "2.5.3",
3+
"version": "2.5.4",
44
"type": "module",
55
"license": "MIT",
66
"dependencies": {

‎client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartConstants.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ import {
1616
uiChildren,
1717
clickEvent,
1818
styleControl,
19-
EchartsStyle,
2019
EchartDefaultChartStyle,
2120
EchartDefaultTextStyle
2221
} from "lowcoder-sdk";
@@ -279,7 +278,7 @@ let chartJsonModeChildren: any = {
279278
opacity:withDefault(NumberControl,trans('funnelChart.defaultOpacity'))
280279
}
281280

282-
if (EchartsStyle) {
281+
if (EchartDefaultChartStyle && EchartDefaultTextStyle) {
283282
chartJsonModeChildren = {
284283
...chartJsonModeChildren,
285284
chartStyle: styleControl(EchartDefaultChartStyle, 'chartStyle'),

‎client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartConstants.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ import {
1616
uiChildren,
1717
clickEvent,
1818
styleControl,
19-
EchartsStyle,
2019
EchartDefaultChartStyle,
2120
EchartDefaultTextStyle
2221
} from "lowcoder-sdk";
@@ -281,7 +280,7 @@ let chartJsonModeChildren: any = {
281280
progressBarWidth:withDefault(NumberControl,trans('gaugeChart.defaultProgressBarWidth')),
282281

283282
}
284-
if (EchartsStyle) {
283+
if (EchartDefaultChartStyle && EchartDefaultTextStyle) {
285284
chartJsonModeChildren = {
286285
...chartJsonModeChildren,
287286
chartStyle: styleControl(EchartDefaultChartStyle, 'chartStyle'),

‎client/packages/lowcoder/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@
5757
src="https://tag.clearbitscripts.com/v1/pk_dfbc0aeefb28dc63475b67134facf127/tags.js"
5858
referrerPolicy="no-referrer"
5959
></script>
60+
<script async defer src="//js-eu1.hs-scripts.com/144574215.js" type="text/javascript" id="hs-script-loader"></script>
6061
</head>
6162
<body>
6263
<div id="not-supported-browser"></div>

‎client/packages/lowcoder/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "lowcoder",
3-
"version": "2.5.1",
3+
"version": "2.5.3",
44
"private": true,
55
"type": "module",
66
"main": "src/index.sdk.ts",

‎client/packages/lowcoder/src/app.tsx

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -129,10 +129,6 @@ class AppIndex extends React.Component<AppIndexProps, any> {
129129
// we check if we are on the public cloud
130130
const isLowCoderDomain = window.location.hostname === 'app.lowcoder.cloud';
131131
const isLocalhost = window.location.hostname === 'localhost';
132-
133-
/* if (isLocalhost || isLowCoderDomain) {
134-
posthog.init('phc_lD36OXeppUehLgI33YFhioTpXqThZ5QqR8IWeKvXP7f', { api_host: 'https://eu.i.posthog.com', person_profiles: 'always' });
135-
} */
136132

137133
// make sure all users in this app have checked login info
138134
if (!this.props.isFetchUserFinished || (this.props.currentUserId && !this.props.fetchHomeDataFinished)) {
@@ -143,7 +139,6 @@ class AppIndex extends React.Component<AppIndexProps, any> {
143139
// if the user just logged in, we send the event to posthog
144140
if (isLocalhost || isLowCoderDomain) {
145141
if (sessionStorage.getItem('_just_logged_in_')) {
146-
// posthog.identify(this.props.currentUserId);
147142
sessionStorage.removeItem('_just_logged_in_');
148143
}
149144
}

‎client/packages/lowcoder/src/components/layout/Layout.tsx

Lines changed: 96 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,15 @@ import { Route, Switch } from "react-router-dom";
22
import { default as AntdLayout } from "antd/es/layout";
33
import { AppHeader } from "pages/common/header";
44
import * as React from "react";
5-
import { ReactElement } from "react";
5+
import { ReactElement, useState, useEffect } from "react";
66
import { HelpDropdown } from "pages/common/help";
77
import MainContent from "components/layout/MainContent";
88
import SideBar from "components/layout/SideBar";
99
import { CNMainContent, CNSidebar } from "constants/styleSelectors";
1010
import { SideBarSection, SideBarSectionProps } from "./SideBarSection";
1111
import styled from "styled-components";
12+
import { MenuOutlined } from "@ant-design/icons";
13+
import { Drawer, Button } from "antd";
1214

1315
type LayoutProps = {
1416
sections: SideBarSectionProps[];
@@ -29,9 +31,53 @@ const SideBarV2 = styled(SideBar)`
2931
}
3032
`;
3133

34+
const MobileMenuButton = styled(Button)`
35+
display: none;
36+
position: fixed;
37+
top: 75px;
38+
right: 22px;
39+
z-index: 1000;
40+
41+
@media screen and (max-width: 720px) {
42+
display: block;
43+
}
44+
`;
45+
46+
const DrawerContentWrapper = styled.div`
47+
height: 100%;
48+
display: flex;
49+
flex-direction: column;
50+
`;
51+
3252
export function Layout(props: LayoutProps) {
53+
54+
const [drawerVisible, setDrawerVisible] = useState(false);
55+
const [isMobile, setIsMobile] = useState(false);
56+
57+
const toggleDrawer = () => {
58+
setDrawerVisible(!drawerVisible);
59+
};
60+
61+
const handleMenuClick = () => {
62+
setDrawerVisible(false); // Close the drawer
63+
};
64+
65+
useEffect(() => {
66+
const handleResize = () => setIsMobile(window.innerWidth <= 720);
67+
handleResize(); // Check on initial render
68+
window.addEventListener("resize", handleResize);
69+
return () => window.removeEventListener("resize", handleResize);
70+
}, []);
71+
72+
const mobileSections = props.sections.map((section) => ({
73+
...section,
74+
items: section.items.filter((item) => item.mobileVisible !== false), // Filter mobile-visible items
75+
}));
76+
77+
const desktopSections = props.sections;
78+
3379
const routes: ReactElement[] = [];
34-
props.sections.forEach((section) => {
80+
desktopSections.forEach((section) => {
3581
section.items.forEach((item) => {
3682
routes.push(
3783
<Route
@@ -48,18 +94,57 @@ export function Layout(props: LayoutProps) {
4894
<AntdLayout style={{ height: "100%" }}>
4995
<AppHeader />
5096
<HelpDropdown />
97+
98+
{/* Mobile Hamburger Button */}
99+
{isMobile && (
100+
<MobileMenuButton
101+
type="primary"
102+
shape="circle"
103+
icon={<MenuOutlined />}
104+
onClick={toggleDrawer}
105+
/>
106+
)}
107+
108+
{/* Drawer for Mobile Sidebar */}
109+
<Drawer
110+
width={"240px"}
111+
placement="right"
112+
closable={true}
113+
onClose={toggleDrawer}
114+
visible={drawerVisible}
115+
bodyStyle={{ padding: "0px" }}
116+
destroyOnClose // Ensure drawer content is removed when closed
117+
>
118+
<DrawerContentWrapper>
119+
<SideBarV2 className={CNSidebar}>
120+
{mobileSections
121+
.filter((section) => section.items.length > 0)
122+
.map((section, index) => (
123+
<SideBarSection
124+
key={index}
125+
{...section}
126+
onItemClick={handleMenuClick} // Pass handler to close the drawer
127+
/>
128+
))}
129+
</SideBarV2>
130+
</DrawerContentWrapper>
131+
</Drawer>
132+
133+
{/* Desktop Layout */}
51134
<AntdLayout>
52-
<SideBarV2 className={CNSidebar}>
53-
{props.sections
54-
.filter((section) => section.items.length > 0)
55-
.map((section, index) => (
56-
<SideBarSection key={index} {...section} />
57-
))}
58-
</SideBarV2>
135+
{!isMobile && (
136+
<SideBarV2 className={`${CNSidebar} desktop-only`}>
137+
{desktopSections
138+
.filter((section) => section.items.length > 0)
139+
.map((section, index) => (
140+
<SideBarSection key={index} {...section} />
141+
))}
142+
</SideBarV2>
143+
)}
59144
<MainContent className={CNMainContent}>
60-
<Switch>{routes} </Switch>
145+
<Switch>{routes}</Switch>
61146
</MainContent>
62147
</AntdLayout>
63148
</AntdLayout>
64149
);
65-
}
150+
}

‎client/packages/lowcoder/src/components/layout/SideBarSection.tsx

Lines changed: 17 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,12 @@ export const SideBarSection = (props: SideBarSectionProps) => {
2424
const user = useSelector<AppState, User>(getUser);
2525
const applications = useSelector<AppState, ApplicationMeta[]>(normalAppListSelector);
2626
const currentPath = useLocation().pathname;
27-
const isShow = props.items.map(item => item.visible ? item.visible({ user: user, applications: applications }) : true).includes(true);
27+
const isShow = props.items
28+
.map((item) => (item.visible ? item.visible({ user: user, applications: applications }) : true))
29+
.includes(true);
30+
2831
return (
29-
<Wrapper className={ isShow ? CNSidebarSection : ''} style={props.style}>
32+
<Wrapper className={isShow ? CNSidebarSection : ""} style={props.style}>
3033
{props.title}
3134
{props.items
3235
.filter((item) =>
@@ -42,10 +45,15 @@ export const SideBarSection = (props: SideBarSectionProps) => {
4245
? item.onSelected(item.routePath, currentPath)
4346
: defaultOnSelectedFn(item.routePath, currentPath)
4447
}
45-
onClick={
46-
item.onClick ??
47-
(() => currentPath !== item.routePath && history.push(item.routePath))
48-
}
48+
onClick={() => {
49+
// Trigger item's onClick if defined
50+
item.onClick
51+
? item.onClick("")
52+
: currentPath !== item.routePath && history.push(item.routePath);
53+
54+
// Trigger parent onItemClick to close the drawer
55+
props.onItemClick?.();
56+
}}
4957
/>
5058
);
5159
})}
@@ -54,15 +62,17 @@ export const SideBarSection = (props: SideBarSectionProps) => {
5462
};
5563

5664
export type SideBarItemType = Omit<SideBarItemProps, "selected"> & {
57-
onSelected?: (routePath: string, currentPath: string) => boolean; // customize select logic from url path
65+
onSelected?: (routePath: string, currentPath: string) => boolean; // Customize select logic from URL path
5866
routePath: string;
5967
routePathExact?: boolean;
6068
visible?: (params: { user: User; applications: ApplicationMeta[] }) => boolean;
6169
routeComp: React.ComponentType<any>;
70+
mobileVisible?: boolean;
6271
};
6372

6473
export interface SideBarSectionProps {
6574
title?: ReactNode;
6675
items: SideBarItemType[];
6776
style?: CSSProperties;
77+
onItemClick?: () => void; // New prop for handling item click
6878
}

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy