Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 1c3716c

Browse files
author
FalkWolsky
committed
Cleaning up Data Sources Display
1 parent dfd71b5 commit 1c3716c

File tree

41 files changed

+175
-113
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+175
-113
lines changed

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

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -744,7 +744,19 @@ export const en = {
744744
"jsQueryDocLink": "About JavaScript Query",
745745
"dynamicDataSourceConfigLoadingText": "Loading extra datasource configuration...",
746746
"dynamicDataSourceConfigErrText": "Failed to load extra datasource configuration.",
747-
"retry": "Retry"
747+
"retry": "Retry",
748+
"categoryDatabase" : "Database",
749+
"categoryBigdata" : "Big Data",
750+
"categoryAi" : "AI",
751+
"categoryDevops" : "DevOps",
752+
"categoryAppdevelopment" : "App Development",
753+
"categoryWorkflow" : "Workflow",
754+
"categoryMessaging" : "Messaging",
755+
"categoryAssets" : "Assets & Storage",
756+
"categoryProjectManagement" : "Project Management",
757+
"categoryCrm" : "CRM",
758+
"categoryEcommerce" : "E-commerce",
759+
"categoryApis" : "Others",
748760
},
749761

750762

‎client/packages/lowcoder/src/pages/datasource/pluginPanel.tsx

Lines changed: 59 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -103,12 +103,59 @@ export const localeContains = (str: string, sub: string): boolean => {
103103
return ascii(str).includes(ascii(sub));
104104
}
105105

106+
// Define interfaces
107+
interface Category {
108+
label: string;
109+
filter: (t: DataSourceTypeInfo) => boolean;
110+
}
111+
112+
interface SectionProps {
113+
label: string;
114+
filter: (t: DataSourceTypeInfo) => boolean;
115+
datasourceTypes: DataSourceTypeInfo[];
116+
searchValue: string;
117+
onSelect: (t: DataSourceTypeInfo) => void;
118+
}
119+
120+
const categories: Category[] = [
121+
{ label: trans("query.database"), filter: (t) => databasePlugins.includes(t.id) || t.id == "googleSheets" || t.definition?.category === "database" },
122+
{ label: trans("query.categoryBigdata"), filter: (t) => t.definition?.category === "Big Data" },
123+
{ label: trans("query.categoryAi"), filter: (t) => t.definition?.category === "AI" },
124+
{ label: trans("query.categoryDevops"), filter: (t) => t.definition?.category === "DevOps" },
125+
{ label: trans("query.categoryAppdevelopment"), filter: (t) => t.id == "restApi" || t.id == "graphql" || t.definition?.category === "App Development" },
126+
{ label: trans("query.categoryWorkflow"), filter: (t) => t.definition?.category === "Workflow" },
127+
{ label: trans("query.categoryMessaging"), filter: (t) => t.id == "smtp" || t.definition?.category === "Messaging" },
128+
{ label: trans("query.categoryAssets"), filter: (t) => t.definition?.category === "Assets" },
129+
{ label: trans("query.categoryProjectManagement"), filter: (t) => t.definition?.category === "Project Management" },
130+
{ label: trans("query.categoryCrm"), filter: (t) => t.definition?.category === "CRM" },
131+
{ label: trans("query.categoryEcommerce"), filter: (t) => t.definition?.category === "eCommerce" },
132+
{ label: trans("query.categoryApis"), filter: (t) => t.definition?.category === "api" },
133+
];
134+
135+
// Section component
136+
const Section: React.FC<SectionProps> = ({ label, filter, datasourceTypes, searchValue, onSelect }) => (
137+
<SectionWrapper>
138+
<SectionLabel>{label}</SectionLabel>
139+
<SectionBody>
140+
{datasourceTypes
141+
.filter(filter)
142+
.filter((t) => localeContains(t.name, searchValue))
143+
.map((t) => (
144+
<DataSourceButton key={t.id} onClick={() => onSelect(t)}>
145+
{t.id && getBottomResIcon(t.id, "large", t.definition?.icon)}
146+
{t.name}
147+
</DataSourceButton>
148+
))}
149+
</SectionBody>
150+
</SectionWrapper>
151+
);
152+
106153
export const PluginPanel = (props: { onSelect: (t: DataSourceTypeInfo) => void }) => {
107154
const datasourceTypes = useSelector(getDataSourceTypes);
108155
const currentPage = useCurrentPage();
109156
const [searchValue, setSearchValue] = useState("");
110157
const apiList = currentPage === "queryLibrary" ? apiPluginsForQueryLibrary : apiPlugins;
111-
158+
112159
return (
113160
<PanelWrapper>
114161
<OperationRightWrapper>
@@ -119,36 +166,16 @@ export const PluginPanel = (props: { onSelect: (t: DataSourceTypeInfo) => void }
119166
style={{ width: "192px", height: "32px", margin: "0" }}
120167
/>
121168
</OperationRightWrapper>
122-
<SectionWrapper>
123-
<SectionLabel>{trans("query.database")}</SectionLabel>
124-
<SectionBody>
125-
{datasourceTypes
126-
.filter((t) => databasePlugins.includes(t.id) || t.definition?.category === "database")
127-
.filter((t) => localeContains(t.name, searchValue))
128-
.map((t) => {
129-
return (
130-
<DataSourceButton key={t.id} onClick={() => props.onSelect(t)}>
131-
{t.id && getBottomResIcon(t.id, "large", t.definition?.icon)}
132-
{t.name}
133-
</DataSourceButton>
134-
);
135-
})}
136-
</SectionBody>
137-
</SectionWrapper>
138-
<SectionWrapper>
139-
<SectionLabel>APIs</SectionLabel>
140-
<SectionBody>
141-
{datasourceTypes
142-
.filter((t) => apiList.includes(t.id) || t.definition?.category === "api")
143-
.filter((t) => localeContains(t.name, searchValue))
144-
.map((t) => (
145-
<DataSourceButton key={t.id} onClick={() => props.onSelect(t)}>
146-
{t.id && getBottomResIcon(t.id, "large", t.definition?.icon)}
147-
{t.name}
148-
</DataSourceButton>
149-
))}
150-
</SectionBody>
151-
</SectionWrapper>
169+
{categories.map(({ label, filter }) => (
170+
<Section
171+
key={label}
172+
label={label}
173+
filter={filter}
174+
datasourceTypes={datasourceTypes}
175+
searchValue={searchValue}
176+
onSelect={props.onSelect}
177+
/>
178+
))}
152179
</PanelWrapper>
153180
);
154-
};
181+
};

‎server/node-service/src/plugins/appconfig/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,8 +56,8 @@ function getAppConfigDataClient(dataSourceConfig: DataSourceDataType) {
5656

5757
const appConfigPlugin: DataSourcePlugin<ActionDataType, DataSourceDataType> = {
5858
id: "appconfig",
59-
name: "AppConfig",
60-
category: "api",
59+
name: "AWS AppConfig",
60+
category: "DevOps",
6161
icon: "appconfig.svg",
6262
dataSourceConfig,
6363
queryConfig,

‎server/node-service/src/plugins/asana/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ const asanaPlugin: DataSourcePlugin<any, DataSourceConfigType> = {
3939
id: "asana",
4040
name: "Asana",
4141
icon: "asana.svg",
42-
category: "api",
42+
category: "Project Management",
4343
dataSourceConfig,
4444
queryConfig: async () => {
4545
const { actions, categories } = await parseOpenApi(spec as OpenAPI.Document, parseOptions);

‎server/node-service/src/plugins/athena/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,8 @@ const timeout = 1000 * 60; // 60s
4040

4141
const athenaPlugin: DataSourcePlugin<ActionDataType, DataSourceDataType> = {
4242
id: "athena",
43-
name: "Athena",
44-
category: "api",
43+
name: "AWS Athena",
44+
category: "Big Data",
4545
icon: "athena.svg",
4646
dataSourceConfig,
4747
queryConfig,

‎server/node-service/src/plugins/bigQuery/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ import run, { validateDataSourceConfig } from "./run";
55

66
const bigQueryPlugin = {
77
id: "bigQuery",
8-
name: "Big Query",
8+
name: "Google Big Query",
99
icon: "bigQuery.svg",
10-
category: "database",
10+
category: "Big Data",
1111
dataSourceConfig,
1212
queryConfig: queryConfig,
1313

‎server/node-service/src/plugins/circleCi/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ const circleCiPlugin: DataSourcePlugin<any, DataSourceConfigType> = {
3131
id: "circleCi",
3232
name: "CircleCI",
3333
icon: "circleCI.svg",
34-
category: "api",
34+
category: "DevOps",
3535
dataSourceConfig,
3636
queryConfig: async () => {
3737
const { actions, categories } = await parseOpenApi(

‎server/node-service/src/plugins/cloudinary/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ const cloudinaryPlugin: DataSourcePlugin<any, DataSourceConfigType> = {
5252
id: "cloudinary",
5353
name: "Cloudinary",
5454
icon: "cloudinary.svg",
55-
category: "api",
55+
category: "Assets",
5656
dataSourceConfig,
5757
queryConfig: async () => {
5858
if (!queryConfig) {

‎server/node-service/src/plugins/datadog/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ const datadogPlugin: DataSourcePlugin<any, DataSourceConfigType> = {
4545
id: "datadog",
4646
name: "Datadog",
4747
icon: "datadog.svg",
48-
category: "api",
48+
category: "DevOps",
4949
dataSourceConfig,
5050
queryConfig: async () => {
5151
const { actions, categories } = await parseOpenApi(spec, parseOptions);

‎server/node-service/src/plugins/did/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ const didPlugin: DataSourcePlugin<any, DataSourceConfigType> = {
6161
id: "did",
6262
name: "D-ID",
6363
icon: "did.svg",
64-
category: "api",
64+
category: "AI",
6565
dataSourceConfig,
6666
queryConfig: async () => {
6767
if (!queryConfig) {

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /