Skip to content

Commit

Permalink
refactor: update json data for datalayers (#3)
Browse files Browse the repository at this point in the history
  • Loading branch information
ysfscream authored Nov 29, 2024
1 parent b134297 commit 5811e0d
Show file tree
Hide file tree
Showing 4 changed files with 22 additions and 83 deletions.
3 changes: 0 additions & 3 deletions provisioning/datasources/datalayers.yml
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,7 @@ datasources:
uid: 'datalayersio-datasource'
jsonData:
host: 'your_host_ip:8360'
selectedAuthType: 'username/password'
username: 'admin'
metadata:
- database: 'demo'
secureJsonData:
password: 'public'
version: 1
Expand Down
95 changes: 20 additions & 75 deletions src/components/ConfigEditor.tsx
Original file line number Diff line number Diff line change
@@ -1,17 +1,12 @@
import React, {useEffect, useState} from 'react'
import {InlineSwitch, FieldSet, InlineField, SecretInput, Input, InlineFieldRow, InlineLabel, TextArea} from '@grafana/ui'
import {DataSourcePluginOptionsEditorProps, SelectableValue} from '@grafana/data'
import React from 'react'
import {InlineSwitch, FieldSet, InlineField, SecretInput, Input, TextArea} from '@grafana/ui'
import {DataSourcePluginOptionsEditorProps} from '@grafana/data'
import {FlightSQLDataSourceOptions, SecureJsonData} from '../types'
import {
onHostChange,
onSecureChange,
onUsernameChange,
onPasswordChange,
onAuthTypeChange,
onKeyChange,
onValueChange,
addMetaData,
removeMetaData,
onResetPassword,
} from './utils'

Expand All @@ -20,31 +15,9 @@ export function ConfigEditor(props: DataSourcePluginOptionsEditorProps<FlightSQL
const {jsonData} = options
const {secureJsonData, secureJsonFields} = options

const [selectedAuthType] = useState<SelectableValue<string>>({
value: jsonData?.selectedAuthType,
label: jsonData?.selectedAuthType,
})
const existingMetastate = jsonData?.metadata?.length && jsonData?.metadata?.map((m: any) => ({key: Object.keys(m)[0], value: Object.values(m)[0]}))
const [metaDataArr, setMetaData] = useState(existingMetastate || [{key: '', value: ''}])
useEffect(() => {
onAuthTypeChange(selectedAuthType, options, onOptionsChange)
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [selectedAuthType])

useEffect(() => {
const {onOptionsChange, options} = props
const mapData = metaDataArr?.map((m: any) => ({[m.key]: m.value}))
const jsonData = {
...options.jsonData,
metadata: mapData,
}
onOptionsChange({...options, jsonData})
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [metaDataArr])

return (
<div>
<FieldSet label="FlightSQL Connection" width={400}>
<FieldSet label="Datalayers Connection" width={400}>
<InlineField labelWidth={20} label="Host:Port">
<Input
width={40}
Expand Down Expand Up @@ -78,7 +51,22 @@ export function ConfigEditor(props: DataSourcePluginOptionsEditorProps<FlightSQL
isConfigured={secureJsonFields?.password}
></SecretInput>
</InlineField>

<InlineField labelWidth={20} label="Database">
<Input
width={40}
name="database"
type="text"
placeholder="database name"
onChange={(e) => {
const jsonData = {
...options.jsonData,
database: e.currentTarget.value,
}
onOptionsChange({ ...options, jsonData })
}}
value={jsonData.database || ''}
></Input>
</InlineField>
<InlineField labelWidth={20} label="Require TLS / SSL">
<InlineSwitch
label=""
Expand All @@ -98,49 +86,6 @@ export function ConfigEditor(props: DataSourcePluginOptionsEditorProps<FlightSQL
}

</FieldSet>
<FieldSet label="MetaData" width={400}>
{metaDataArr?.map((_: any, i: any) => (
<InlineFieldRow key={i} style={{flexFlow: 'row'}}>
<InlineField labelWidth={20} label="Key">
<Input
key={i}
width={40}
name="key"
type="text"
value={metaDataArr[i]?.key || ''}
placeholder="key"
onChange={(e) => onKeyChange(e, metaDataArr, i, setMetaData)}
></Input>
</InlineField>
<InlineField labelWidth={20} label="Value">
<Input
key={i}
width={40}
name="value"
type="text"
value={metaDataArr[i]?.value || ''}
placeholder="value"
onChange={(e) => onValueChange(e, metaDataArr, i, setMetaData)}
></Input>
</InlineField>
{i + 1 >= metaDataArr.length && (
<InlineLabel as="button" className="" onClick={() => addMetaData(setMetaData, metaDataArr)} width="auto">
+
</InlineLabel>
)}
{i > 0 && (
<InlineLabel
as="button"
className=""
width="auto"
onClick={() => removeMetaData(i, setMetaData, metaDataArr)}
>
-
</InlineLabel>
)}
</InlineFieldRow>
))}
</FieldSet>
</div>
)
}
2 changes: 0 additions & 2 deletions src/mock-datasource.ts
Original file line number Diff line number Diff line change
Expand Up @@ -55,8 +55,6 @@ export const mockDatasourceOptions: DataSourcePluginOptionsEditorProps<FlightSQL
host: '',
secure: true,
username: '',
selectedAuthType: '',
metadata: [],
},
secureJsonFields: {
token: false,
Expand Down
5 changes: 2 additions & 3 deletions src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,12 +20,11 @@ export const DEFAULT_QUERY: Partial<SQLQuery> = {}
*/
export interface FlightSQLDataSourceOptions extends DataSourceJsonData {
host?: string
token?: string
secure?: boolean
username?: string
password?: string
selectedAuthType?: string
metadata?: any
database?: string
token?: string
}

export interface SecureJsonData {
Expand Down

0 comments on commit 5811e0d

Please sign in to comment.