Skip to content

Commit 4f58b96

Browse files
author
FalkWolsky
committed
Adding Admin Area Icons
1 parent 877f9f5 commit 4f58b96

File tree

6 files changed

+63
-91
lines changed

6 files changed

+63
-91
lines changed

‎client/packages/lowcoder-design/src/icons/index.ts‎

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -171,22 +171,6 @@ export { ReactComponent as videoPlayTriangle } from "./icon-video-play-triangle.
171171
export { ReactComponent as DrawerCompIcon } from "./icon-drawer.svg";
172172
export { ReactComponent as LeftMeetingIcon } from "./icon-left-comp-video.svg";
173173
export { ReactComponent as PlusIcon } from "./icon-plus.svg";
174-
export { ReactComponent as HomeIcon } from "./icon-application-home.svg";
175-
export { ReactComponent as HomeModuleIcon } from "./icon-application-module.svg";
176-
export { ReactComponent as HomeQueryLibraryIcon } from "./icon-application-query-library.svg";
177-
export { ReactComponent as HomeDataSourceIcon } from "./icon-application-datasource.svg";
178-
export { ReactComponent as RecyclerIcon } from "./icon-application-recycler.svg";
179-
export { ReactComponent as MarketplaceIcon } from "./icon-application-marketplace.svg";
180-
export { ReactComponent as LowcoderMarketplaceIcon } from "./icon-lowcoder-marketplace.svg";
181-
export { ReactComponent as HomeActiveIcon } from "./icon-application-home-active.svg";
182-
export { ReactComponent as HomeModuleActiveIcon } from "./icon-application-module-active.svg";
183-
export { ReactComponent as HomeQueryLibraryActiveIcon } from "./icon-application-query-library-active.svg";
184-
export { ReactComponent as HomeDataSourceActiveIcon } from "./icon-application-datasource-active.svg";
185-
export { ReactComponent as RecyclerActiveIcon } from "./icon-application-recycler-active.svg";
186-
export { ReactComponent as MarketplaceActiveIcon } from "./icon-application-marketplace-active.svg";
187-
export { ReactComponent as LowcoderMarketplaceActiveIcon } from "./icon-lowcoder-marketplace-active.svg";
188-
export { ReactComponent as FavoritesIcon } from "./icon-application-favorites.svg";
189-
export { ReactComponent as HomeSettingIcon } from "./icon-application-setting.svg";
190174
export { ReactComponent as FolderIcon } from "./icon-application-folder.svg";
191175
export { ReactComponent as AllTypesIcon } from "./icon-application-all.svg";
192176
export { ReactComponent as InviteUserIcon } from "./icon-application-invite-user.svg";
@@ -314,6 +298,23 @@ export { ReactComponent as LeftShow } from "./remix/eye-off-line.svg";
314298
export { ReactComponent as LeftHide } from "./remix/eye-line.svg";
315299
export { ReactComponent as LeftLock } from "./remix/lock-line.svg";
316300
export { ReactComponent as LeftUnlock } from "./remix/lock-unlock-line.svg";
301+
export { ReactComponent as UserGroupIcon } from "./remix/group-line.svg";
302+
export { ReactComponent as UserIcon } from "./remix/user-line.svg";
303+
export { ReactComponent as UserAddIcon } from "./remix/user-add-line.svg";
304+
export { ReactComponent as UserDeleteIcon } from "./remix/user-unfollow-line.svg";
305+
export { ReactComponent as UserShieldIcon } from "./remix/shield-user-line.svg";
306+
export { ReactComponent as ThemeIcon } from "./remix/palette-line.svg";
307+
export { ReactComponent as AppsIcon } from "./remix/apps-2-line.svg";
308+
export { ReactComponent as WorkspacesIcon } from "./remix/hotel-line.svg";
309+
310+
export { ReactComponent as HomeIcon } from "./remix/home-3-line.svg";
311+
export { ReactComponent as HomeModuleIcon } from "./remix/focus-mode.svg";
312+
export { ReactComponent as HomeQueryLibraryIcon } from "./remix/braces-line.svg";
313+
export { ReactComponent as HomeDataSourceIcon } from "./remix/database-2-line.svg";
314+
export { ReactComponent as RecyclerIcon } from "./remix/delete-bin-line.svg";
315+
export { ReactComponent as MarketplaceIcon } from "./icon-application-marketplace.svg";
316+
export { ReactComponent as FavoritesIcon } from "./icon-application-favorites.svg";
317+
export { ReactComponent as HomeSettingIcon } from "./remix/settings-4-line.svg";
317318

318319

319320
// new

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

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import { PropsWithChildren } from "react";
22
import styled from "styled-components";
33

44
const Wrapper = styled.div`
5-
min-width: 232px;
6-
width: 232px;
5+
min-width: 280px;
6+
width: 280px;
77
height: 100%;
88
background: #ffffff;
99
border-right: 1px solid #f0f0f0;
@@ -17,6 +17,7 @@ const Wrapper = styled.div`
1717
color: #222222;
1818
margin: 0 0 20px 20px;
1919
}
20+
2021
.ant-menu-inline .ant-menu-item {
2122
margin: 4px 0;
2223
padding: 10px 20px !important;

‎client/packages/lowcoder/src/i18n/locales/en.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1581,7 +1581,7 @@ export const en = {
15811581
"advanced": "Advanced",
15821582
"lab": "Lab",
15831583
"branding": "Branding",
1584-
"oauthProviders": "OAuth Providers",
1584+
"oauthProviders": "User Authentication",
15851585
"appUsage": "App Usage Logs",
15861586
"environments": "Environments",
15871587
"premium": "Premium"
@@ -2621,7 +2621,7 @@ export const en = {
26212621
"table": table,
26222622
},
26232623
"idSource": {
2624-
"title": "OAuth Providers",
2624+
"title": "User Authentication Provider",
26252625
"form": "Email",
26262626
"pay": "Premium",
26272627
"enable": "Enable",

‎client/packages/lowcoder/src/i18n/locales/zh.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1496,7 +1496,7 @@ settings: {
14961496
advanced: "高级",
14971497
lab: "实验室",
14981498
branding: "品牌",
1499-
oauthProviders: "OAuth 提供商",
1499+
oauthProviders: "User Authentication",
15001500
appUsage: "应用程序使用日志",
15011501
environments: "环境",
15021502
premium: "高级版",
@@ -2560,7 +2560,7 @@ componentDocExtra: {
25602560
table: table,
25612561
},
25622562
idSource: {
2563-
title: "OAuth 提供商",
2563+
title: "用户认证提供商",
25642564
form: "电子邮件",
25652565
pay: "高级",
25662566
enable: "启用",

‎client/packages/lowcoder/src/pages/ApplicationV2/index.tsx‎

Lines changed: 10 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import {
55
FOLDER_URL_PREFIX,
66
FOLDERS_URL,
77
MARKETPLACE_URL,
8-
MARKETPLACE_URL_BY_TYPE,
98
MODULE_APPLICATIONS_URL,
109
QUERY_LIBRARY_URL,
1110
SETTING,
@@ -17,25 +16,17 @@ import {
1716
EditPopover,
1817
EllipsisTextCss,
1918
FolderIcon,
20-
HomeActiveIcon,
21-
HomeDataSourceActiveIcon,
2219
HomeDataSourceIcon,
2320
HomeIcon,
24-
HomeModuleActiveIcon,
2521
HomeModuleIcon,
26-
HomeQueryLibraryActiveIcon,
2722
HomeQueryLibraryIcon,
28-
HomeSettingsActiveIcon,
29-
HomeSettingsIcon,
23+
HomeSettingIcon,
3024
InviteUserIcon,
3125
PlusIcon,
3226
PointIcon,
33-
RecyclerActiveIcon,
3427
RecyclerIcon,
3528
MarketplaceIcon,
36-
MarketplaceActiveIcon,
37-
LowcoderMarketplaceActiveIcon,
38-
LowcoderMarketplaceIcon,
29+
AppsIcon
3930
} from "lowcoder-design";
4031
import React, { useEffect, useState } from "react";
4132
import { fetchAllApplications, fetchHomeData } from "redux/reduxActions/applicationActions";
@@ -345,48 +336,28 @@ export default function ApplicationHome() {
345336
text: <TabLabel>{trans("home.allApplications")}</TabLabel>,
346337
routePath: ALL_APPLICATIONS_URL,
347338
routeComp: HomeView,
348-
icon: ({ selected, ...otherProps }) =>
349-
selected ? <HomeActiveIcon {...otherProps} /> : <HomeIcon {...otherProps} />,
339+
icon: ({ selected, ...otherProps }) => selected ? <AppsIcon {...otherProps} width={"24px"}/> : <AppsIcon {...otherProps} width={"24px"}/>,
350340
},
351341
{
352342
text: <TabLabel>{trans("home.allModules")}</TabLabel>,
353343
routePath: MODULE_APPLICATIONS_URL,
354344
routeComp: ModuleView,
355-
icon: ({ selected, ...otherProps }) =>
356-
selected ? (
357-
<HomeModuleActiveIcon {...otherProps} />
358-
) : (
359-
<HomeModuleIcon {...otherProps} />
360-
),
345+
icon: ({ selected, ...otherProps }) => selected ? <HomeModuleIcon {...otherProps} width={"24px"}/> : <HomeModuleIcon {...otherProps} width={"24px"}/>,
361346
visible: ({ user }) => user.orgDev,
362347
},
363348
{
364-
text: (
365-
<TabLabel>
366-
{trans("home.marketplace")}
367-
</TabLabel>
368-
),
349+
text: <TabLabel>{trans("home.marketplace")}</TabLabel>,
369350
routePath: MARKETPLACE_URL,
370351
routePathExact: false,
371352
routeComp: MarketplaceView,
372-
icon: ({ selected, ...otherProps }) =>
373-
selected ? (
374-
<MarketplaceActiveIcon {...otherProps} />
375-
) : (
376-
<MarketplaceIcon {...otherProps} />
377-
),
353+
icon: ({ selected, ...otherProps }) => selected ? <MarketplaceIcon {...otherProps} width={"24px"}/> : <MarketplaceIcon {...otherProps} width={"24px"}/>,
378354
visible: ({ user }) => user.orgDev,
379355
},
380356
{
381357
text: <TabLabel>{trans("home.trash")}</TabLabel>,
382358
routePath: TRASH_URL,
383359
routeComp: TrashView,
384-
icon: ({ selected, ...otherProps }) =>
385-
selected ? (
386-
<RecyclerActiveIcon {...otherProps} />
387-
) : (
388-
<RecyclerIcon {...otherProps} />
389-
),
360+
icon: ({ selected, ...otherProps }) => selected ? <RecyclerIcon {...otherProps} width={"24px"}/> : <RecyclerIcon {...otherProps} width={"24px"}/>,
390361
visible: ({ user }) => user.orgDev,
391362
},
392363
],
@@ -414,25 +385,15 @@ export default function ApplicationHome() {
414385
text: <TabLabel>{trans("home.queryLibrary")}</TabLabel>,
415386
routePath: QUERY_LIBRARY_URL,
416387
routeComp: QueryLibraryEditor,
417-
icon: ({ selected, ...otherProps }) =>
418-
selected ? (
419-
<HomeQueryLibraryActiveIcon {...otherProps} />
420-
) : (
421-
<HomeQueryLibraryIcon {...otherProps} />
422-
),
388+
icon: ({ selected, ...otherProps }) => selected ? <HomeQueryLibraryIcon {...otherProps} width={"24px"}/> : <HomeQueryLibraryIcon {...otherProps} width={"24px"}/>,
423389
visible: ({ user }) => user.orgDev,
424390
},
425391
{
426392
text: <TabLabel>{trans("home.datasource")}</TabLabel>,
427393
routePath: DATASOURCE_URL,
428394
routePathExact: false,
429395
routeComp: DatasourceHome,
430-
icon: ({ selected, ...otherProps }) =>
431-
selected ? (
432-
<HomeDataSourceActiveIcon {...otherProps} />
433-
) : (
434-
<HomeDataSourceIcon {...otherProps} />
435-
),
396+
icon: ({ selected, ...otherProps }) => selected ? <HomeDataSourceIcon {...otherProps} width={"24px"}/> : <HomeDataSourceIcon {...otherProps} width={"24px"}/>,
436397
visible: ({ user }) => user.orgDev,
437398
onSelected: (_, currentPath) => currentPath.split("/")[1] === "datasource",
438399
},
@@ -441,12 +402,7 @@ export default function ApplicationHome() {
441402
routePath: SETTING,
442403
routePathExact: false,
443404
routeComp: Setting,
444-
icon: ({ selected, ...otherProps }) =>
445-
selected ? (
446-
<HomeSettingsActiveIcon {...otherProps} />
447-
) : (
448-
<HomeSettingsIcon {...otherProps} />
449-
),
405+
icon: ({ selected, ...otherProps }) => selected ? <HomeSettingIcon {...otherProps} width={"24px"}/> : <HomeSettingIcon {...otherProps} width={"24px"}/>,
450406
visible: ({ user }) => user.orgDev,
451407
onSelected: (_, currentPath) => currentPath.split("/")[1] === "setting",
452408
},

‎client/packages/lowcoder/src/pages/setting/settingHome.tsx‎

Lines changed: 29 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,14 @@ import AuditSetting from "@lowcoder-ee/pages/setting/audit";
88
import { isEE, isEnterpriseMode, isSelfDomain, showAuditLog } from "util/envUtils";
99
import { TwoColumnSettingPageContent } from "./styled";
1010
import SubSideBar from "components/layout/SubSideBar";
11-
import { Menu } from "lowcoder-design";
11+
import {
12+
Menu,
13+
UserGroupIcon,
14+
UserShieldIcon,
15+
LeftSettingIcon,
16+
ThemeIcon,
17+
WorkspacesIcon
18+
} from "lowcoder-design";
1219
import { useSelector } from "react-redux";
1320
import { getUser } from "redux/selectors/usersSelectors";
1421
import history from "util/history";
@@ -37,25 +44,35 @@ export function SettingHome() {
3744
const selectKey = useParams<{ setting: string }>().setting || SettingPageEnum.UserGroups;
3845

3946
const items = [
40-
{
41-
key: SettingPageEnum.UserGroups,
42-
label: trans("settings.userGroups"),
43-
},
4447
{
4548
key: SettingPageEnum.Organization,
4649
label: trans("settings.organization"),
50+
icon: <WorkspacesIcon width={"20px"}/>,
51+
},
52+
{
53+
key: SettingPageEnum.OAuthProvider,
54+
label: (trans("settings.oauthProviders")),
55+
disabled: !currentOrgAdmin(user),
56+
icon: <UserShieldIcon width={"20px"}/>,
57+
},
58+
{
59+
key: SettingPageEnum.UserGroups,
60+
label: trans("settings.userGroups"),
61+
icon: <UserGroupIcon width={"20px"}/>,
4762
},
4863
{
4964
key: SettingPageEnum.Theme,
5065
label: trans("settings.theme"),
66+
icon: <ThemeIcon width={"20px"}/>,
5167
},
5268
{
53-
key: SettingPageEnum.OAuthProvider,
54-
label: (
55-
<span className="text">{trans("settings.oauthProviders")}</span>
56-
),
57-
disabled: !currentOrgAdmin(user),
69+
key: SettingPageEnum.Advanced,
70+
label: trans("settings.advanced"),
71+
icon: <LeftSettingIcon width={"20px"}/>,
5872
},
73+
74+
// Premium features
75+
5976
{
6077
key: SettingPageEnum.Environments,
6178
label: (
@@ -107,16 +124,13 @@ export function SettingHome() {
107124
!enableCustomBrand(config) ||
108125
(!isSelfDomain(config) && !isEnterpriseMode(config)),
109126
},
110-
{
111-
key: SettingPageEnum.Advanced,
112-
label: trans("settings.advanced"),
113-
},
114127
];
115128

116129
return (
117130
<TwoColumnSettingPageContent>
118131
<SubSideBar title={trans("settings.title")}>
119-
<Menu
132+
<Menu
133+
style={{ border: "none" }}
120134
mode="inline"
121135
selectedKeys={[selectKey]}
122136
onClick={(value) => {

0 commit comments

Comments
 (0)