External datasource ordering (#9048)

* Sort external datasources

* lint

* Refactor
This commit is contained in:
melohagan 2022-12-19 08:23:24 +00:00 committed by GitHub
parent c32c93d5c8
commit e6a81f2106
2 changed files with 35 additions and 2 deletions

View File

@ -11,7 +11,7 @@
import { onMount } from "svelte" import { onMount } from "svelte"
import ICONS from "../icons" import ICONS from "../icons"
import { API } from "api" import { API } from "api"
import { IntegrationTypes } from "constants/backend" import { IntegrationTypes, DatasourceTypes } from "constants/backend"
import CreateTableModal from "components/backend/TableNavigator/modals/CreateTableModal.svelte" import CreateTableModal from "components/backend/TableNavigator/modals/CreateTableModal.svelte"
import DatasourceConfigModal from "components/backend/DatasourceNavigator/modals/DatasourceConfigModal.svelte" import DatasourceConfigModal from "components/backend/DatasourceNavigator/modals/DatasourceConfigModal.svelte"
import GoogleDatasourceConfigModal from "components/backend/DatasourceNavigator/modals/GoogleDatasourceConfigModal.svelte" import GoogleDatasourceConfigModal from "components/backend/DatasourceNavigator/modals/GoogleDatasourceConfigModal.svelte"
@ -31,6 +31,7 @@
$: customIntegrations = Object.entries(integrations).filter( $: customIntegrations = Object.entries(integrations).filter(
entry => entry[1].custom entry => entry[1].custom
) )
$: sortedIntegrations = sortIntegrations(integrations)
checkShowImport() checkShowImport()
@ -99,6 +100,29 @@
} }
integrations = newIntegrations integrations = newIntegrations
} }
function sortIntegrations(integrations) {
let integrationsArray = Object.entries(integrations)
function getTypeOrder(schema) {
if (schema.type === DatasourceTypes.API) {
return 1
}
if (schema.type === DatasourceTypes.RELATIONAL) {
return 2
}
return schema.type?.charCodeAt(0)
}
integrationsArray.sort((a, b) => {
let typeOrderA = getTypeOrder(a[1])
let typeOrderB = getTypeOrder(b[1])
if (typeOrderA === typeOrderB) {
return a[1].friendlyName?.localeCompare(b[1].friendlyName)
}
return typeOrderA < typeOrderB ? -1 : 1
})
return integrationsArray
}
</script> </script>
<Modal bind:this={internalTableModal}> <Modal bind:this={internalTableModal}>
@ -157,7 +181,7 @@
<Layout noPadding gap="XS"> <Layout noPadding gap="XS">
<Body size="S">Connect to an external datasource</Body> <Body size="S">Connect to an external datasource</Body>
<div class="item-list"> <div class="item-list">
{#each Object.entries(integrations).filter(([key, val]) => key !== IntegrationTypes.INTERNAL && !val.custom) as [integrationType, schema]} {#each sortedIntegrations.filter(([key, val]) => key !== IntegrationTypes.INTERNAL && !val.custom) as [integrationType, schema]}
<DatasourceCard <DatasourceCard
on:selected={evt => selectIntegration(evt.detail)} on:selected={evt => selectIntegration(evt.detail)}
{schema} {schema}

View File

@ -261,3 +261,12 @@ export const BannedSearchTypes = [
"json", "json",
"jsonarray", "jsonarray",
] ]
export const DatasourceTypes = {
RELATIONAL: "Relational",
NON_RELATIONAL: "Non-relational",
SPREADSHEET: "Spreadsheet",
OBJECT_STORE: "Object store",
GRAPH: "Graph",
API: "API",
}