mirror of
https://github.com/dbgate/dbgate
synced 2024-11-07 20:26:23 +00:00
settings WIP
This commit is contained in:
parent
2b61c8a21f
commit
9267ca326f
@ -30,14 +30,14 @@ try {
|
||||
initialConfig = {};
|
||||
}
|
||||
|
||||
let settingsJson = {};
|
||||
try {
|
||||
const datadir = path.join(os.homedir(), 'dbgate-data');
|
||||
settingsJson = JSON.parse(fs.readFileSync(path.join(datadir, 'settings.json'), { encoding: 'utf-8' }));
|
||||
} catch (err) {
|
||||
console.log('Error loading settings.json:', err.message);
|
||||
settingsJson = {};
|
||||
}
|
||||
// let settingsJson = {};
|
||||
// try {
|
||||
// const datadir = path.join(os.homedir(), 'dbgate-data');
|
||||
// settingsJson = JSON.parse(fs.readFileSync(path.join(datadir, 'settings.json'), { encoding: 'utf-8' }));
|
||||
// } catch (err) {
|
||||
// console.log('Error loading settings.json:', err.message);
|
||||
// settingsJson = {};
|
||||
// }
|
||||
|
||||
// Keep a global reference of the window object, if you don't, the window will
|
||||
// be closed automatically when the JavaScript object is garbage collected.
|
||||
@ -199,7 +199,10 @@ function createWindow() {
|
||||
mainMenu = buildMenu();
|
||||
mainWindow.setMenu(mainMenu);
|
||||
|
||||
function loadMainWindow() {
|
||||
async function loadMainWindow() {
|
||||
const settings = await main.configController.getSettings();
|
||||
console.log(settings);
|
||||
|
||||
const startUrl =
|
||||
process.env.ELECTRON_START_URL ||
|
||||
url.format({
|
||||
|
@ -5,21 +5,24 @@ const { datadir } = require('../utility/directories');
|
||||
const hasPermission = require('../utility/hasPermission');
|
||||
const socket = require('../utility/socket');
|
||||
const _ = require('lodash');
|
||||
const AsyncLock = require('async-lock');
|
||||
|
||||
const currentVersion = require('../currentVersion');
|
||||
const platformInfo = require('../utility/platformInfo');
|
||||
const connections = require('../controllers/connections');
|
||||
|
||||
module.exports = {
|
||||
settingsValue: {},
|
||||
const lock = new AsyncLock();
|
||||
|
||||
async _init() {
|
||||
try {
|
||||
this.settingsValue = JSON.parse(await fs.readFile(path.join(datadir(), 'settings.json'), { encoding: 'utf-8' }));
|
||||
} catch (err) {
|
||||
this.settingsValue = {};
|
||||
}
|
||||
},
|
||||
module.exports = {
|
||||
// settingsValue: {},
|
||||
|
||||
// async _init() {
|
||||
// try {
|
||||
// this.settingsValue = JSON.parse(await fs.readFile(path.join(datadir(), 'settings.json'), { encoding: 'utf-8' }));
|
||||
// } catch (err) {
|
||||
// this.settingsValue = {};
|
||||
// }
|
||||
// },
|
||||
|
||||
get_meta: true,
|
||||
async get() {
|
||||
@ -40,24 +43,33 @@ module.exports = {
|
||||
|
||||
getSettings_meta: true,
|
||||
async getSettings() {
|
||||
return this.settingsValue;
|
||||
try {
|
||||
return JSON.parse(await fs.readFile(path.join(datadir(), 'settings.json'), { encoding: 'utf-8' }));
|
||||
} catch (err) {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
|
||||
updateSettings_meta: true,
|
||||
async updateSettings(values) {
|
||||
if (!hasPermission(`settings/change`)) return false;
|
||||
try {
|
||||
const updated = {
|
||||
...this.settingsValue,
|
||||
...values,
|
||||
};
|
||||
await fs.writeFile(path.join(datadir(), 'settings.json'), JSON.stringify(updated, undefined, 2));
|
||||
this.settingsValue = updated;
|
||||
socket.emitChanged(`settings-changed`);
|
||||
return updated;
|
||||
} catch (err) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const res = await lock.acquire('update', async () => {
|
||||
const currentValue = await this.getSettings();
|
||||
try {
|
||||
const updated = {
|
||||
...currentValue,
|
||||
...values,
|
||||
};
|
||||
await fs.writeFile(path.join(datadir(), 'settings.json'), JSON.stringify(updated, undefined, 2));
|
||||
// this.settingsValue = updated;
|
||||
socket.emitChanged(`settings-changed`);
|
||||
return updated;
|
||||
} catch (err) {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
return res;
|
||||
},
|
||||
|
||||
changelog_meta: true,
|
||||
|
@ -110,7 +110,7 @@ module.exports = {
|
||||
msgtype: 'connect',
|
||||
connection: { ...connection, database },
|
||||
structure: lastClosed ? lastClosed.structure : null,
|
||||
globalSettings: config.settingsValue,
|
||||
globalSettings: await config.getSettings(),
|
||||
});
|
||||
return newOpened;
|
||||
},
|
||||
|
@ -69,7 +69,7 @@ module.exports = {
|
||||
if (newOpened.disconnected) return;
|
||||
this.close(conid, false);
|
||||
});
|
||||
subprocess.send({ msgtype: 'connect', ...connection, globalSettings: config.settingsValue });
|
||||
subprocess.send({ msgtype: 'connect', ...connection, globalSettings: await config.getSettings() });
|
||||
return newOpened;
|
||||
});
|
||||
return res;
|
||||
|
@ -145,4 +145,4 @@ function initializeElectronSender(electronSender) {
|
||||
socket.setElectronSender(electronSender);
|
||||
}
|
||||
|
||||
module.exports = { start, useAllControllers, initializeElectronSender };
|
||||
module.exports = { start, useAllControllers, initializeElectronSender, configController: config };
|
||||
|
23
packages/web/src/forms/SettingsCheckboxField.svelte
Normal file
23
packages/web/src/forms/SettingsCheckboxField.svelte
Normal file
@ -0,0 +1,23 @@
|
||||
<script lang="ts">
|
||||
import { getFormContext } from './FormProviderCore.svelte';
|
||||
import SettingsCheckboxFieldRaw from './SettingsCheckboxFieldRaw.svelte';
|
||||
|
||||
export let label;
|
||||
export let name;
|
||||
export let disabled = false;
|
||||
export let templateProps = {};
|
||||
|
||||
const { template, setFieldValue, values } = getFormContext();
|
||||
</script>
|
||||
|
||||
<svelte:component
|
||||
this={template}
|
||||
on:change
|
||||
type="checkbox"
|
||||
{label}
|
||||
{disabled}
|
||||
{...templateProps}
|
||||
labelProps={disabled ? { disabled: true } : { onClick: () => setFieldValue(name, !$values[name]) }}
|
||||
>
|
||||
<SettingsCheckboxFieldRaw {name} {...$$restProps} {disabled} />
|
||||
</svelte:component>
|
17
packages/web/src/forms/SettingsCheckboxFieldRaw.svelte
Normal file
17
packages/web/src/forms/SettingsCheckboxFieldRaw.svelte
Normal file
@ -0,0 +1,17 @@
|
||||
<script lang="ts">
|
||||
import CheckboxField from './CheckboxField.svelte';
|
||||
import { apiCall } from '../utility/api';
|
||||
import _ from 'lodash';
|
||||
import { useSettings } from '../utility/metadataLoaders';
|
||||
|
||||
export let name;
|
||||
export let defaultValue;
|
||||
|
||||
const settings = useSettings();
|
||||
|
||||
function handleChange(e) {
|
||||
apiCall('config/update-settings', { [name]: e.target['checked'] });
|
||||
}
|
||||
</script>
|
||||
|
||||
<CheckboxField {...$$restProps} checked={($settings || {})[name] ?? defaultValue} on:change={handleChange} on:change />
|
42
packages/web/src/forms/SettingsFormProvider.svelte
Normal file
42
packages/web/src/forms/SettingsFormProvider.svelte
Normal file
@ -0,0 +1,42 @@
|
||||
<script lang="ts" context="module">
|
||||
import { getContext, setContext } from 'svelte';
|
||||
|
||||
const contextKey = 'formProviderContextKey';
|
||||
|
||||
export function getFormContext(): any {
|
||||
return getContext(contextKey);
|
||||
}
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
import FormFieldTemplateLarge from './FormFieldTemplateLarge.svelte';
|
||||
import createRef from '../utility/createRef';
|
||||
import { apiCall } from '../utility/api';
|
||||
import { useSettings } from '../utility/metadataLoaders';
|
||||
import { derived } from 'svelte/store';
|
||||
|
||||
export let template = FormFieldTemplateLarge;
|
||||
|
||||
const settings = useSettings();
|
||||
const values = derived(settings, $settings => {
|
||||
if (!$settings) {
|
||||
return {};
|
||||
}
|
||||
return $settings;
|
||||
});
|
||||
|
||||
const setFieldValue = (name, value) => {
|
||||
apiCall('config/update-settings', { [name]: value });
|
||||
};
|
||||
|
||||
const context = {
|
||||
values,
|
||||
template,
|
||||
setFieldValue,
|
||||
submitActionRef: createRef(null),
|
||||
};
|
||||
|
||||
setContext(contextKey, context);
|
||||
</script>
|
||||
|
||||
<slot />
|
15
packages/web/src/forms/SettingsTextField.svelte
Normal file
15
packages/web/src/forms/SettingsTextField.svelte
Normal file
@ -0,0 +1,15 @@
|
||||
<script lang="ts">
|
||||
import { getFormContext } from './FormProviderCore.svelte';
|
||||
import SettingsTextFieldRaw from './SettingsTextFieldRaw.svelte';
|
||||
|
||||
export let label;
|
||||
export let name;
|
||||
export let templateProps = {};
|
||||
export let focused = false;
|
||||
|
||||
const { template } = getFormContext();
|
||||
</script>
|
||||
|
||||
<svelte:component this={template} type="text" {label} {...templateProps}>
|
||||
<SettingsTextFieldRaw {name} {...$$restProps} {focused} />
|
||||
</svelte:component>
|
18
packages/web/src/forms/SettingsTextFieldRaw.svelte
Normal file
18
packages/web/src/forms/SettingsTextFieldRaw.svelte
Normal file
@ -0,0 +1,18 @@
|
||||
<script lang="ts">
|
||||
import { apiCall } from '../utility/api';
|
||||
|
||||
import { useSettings } from '../utility/metadataLoaders';
|
||||
|
||||
import TextField from './TextField.svelte';
|
||||
|
||||
export let name;
|
||||
export let defaultValue;
|
||||
|
||||
const settings = useSettings();
|
||||
|
||||
function handleChange(e) {
|
||||
apiCall('config/update-settings', { [name]: e.target['value'] });
|
||||
}
|
||||
</script>
|
||||
|
||||
<TextField {...$$restProps} value={($settings || {})[name] ?? defaultValue} on:input={handleChange} />
|
@ -1,5 +1,6 @@
|
||||
<script lang="ts">
|
||||
import _ from 'lodash';
|
||||
import FormStyledButton from '../buttons/FormStyledButton.svelte';
|
||||
|
||||
import FormButton from '../forms/FormButton.svelte';
|
||||
import FormCheckboxField from '../forms/FormCheckboxField.svelte';
|
||||
@ -10,6 +11,9 @@
|
||||
import FormSubmit from '../forms/FormSubmit.svelte';
|
||||
import FormTextField from '../forms/FormTextField.svelte';
|
||||
import FormValues from '../forms/FormValues.svelte';
|
||||
import SettingsCheckboxField from '../forms/SettingsCheckboxField.svelte';
|
||||
import SettingsFormProvider from '../forms/SettingsFormProvider.svelte';
|
||||
import SettingsTextField from '../forms/SettingsTextField.svelte';
|
||||
|
||||
import ModalBase from '../modals/ModalBase.svelte';
|
||||
import { closeCurrentModal } from '../modals/modalTools';
|
||||
@ -19,36 +23,34 @@
|
||||
import getElectron from '../utility/getElectron';
|
||||
import { showSnackbarInfo } from '../utility/snackbar';
|
||||
|
||||
function handleOk(e) {
|
||||
apiCall(
|
||||
'config/update-settings',
|
||||
_.omitBy(e.detail, (v, k) => k.startsWith(':'))
|
||||
);
|
||||
visibleToolbar.set(!!e.detail[':visibleToolbar']);
|
||||
if (electron && !getTitleBarVisibility() != !!e.detail[':useNativeMenu']) {
|
||||
electron.send('set-use-native-menu', !!e.detail[':useNativeMenu']);
|
||||
showSnackbarInfo('Native menu settings will be applied after app restart');
|
||||
}
|
||||
closeCurrentModal();
|
||||
}
|
||||
// function handleOk(e) {
|
||||
// apiCall(
|
||||
// 'config/update-settings',
|
||||
// _.omitBy(e.detail, (v, k) => k.startsWith(':'))
|
||||
// );
|
||||
// visibleToolbar.set(!!e.detail[':visibleToolbar']);
|
||||
// if (electron && !getTitleBarVisibility() != !!e.detail[':useNativeMenu']) {
|
||||
// electron.send('set-use-native-menu', !!e.detail[':useNativeMenu']);
|
||||
// showSnackbarInfo('Native menu settings will be applied after app restart');
|
||||
// }
|
||||
// closeCurrentModal();
|
||||
// }
|
||||
|
||||
const electron = getElectron();
|
||||
</script>
|
||||
|
||||
<FormProvider
|
||||
initialValues={{
|
||||
...getCurrentSettings(),
|
||||
':visibleToolbar': getVisibleToolbar(),
|
||||
':useNativeMenu': !getTitleBarVisibility(),
|
||||
}}
|
||||
>
|
||||
<SettingsFormProvider>
|
||||
<ModalBase {...$$restProps}>
|
||||
<div slot="header">Settings</div>
|
||||
|
||||
<FormValues let:values>
|
||||
{#if electron}
|
||||
<div class="heading">Appearance</div>
|
||||
<FormCheckboxField name=":useNativeMenu" label="Use system native menu" />
|
||||
<FormCheckboxField
|
||||
name="app.useNativeMenu"
|
||||
label="Use system native menu"
|
||||
on:change={() => showSnackbarInfo('Native menu settings will be applied after app restart')}
|
||||
/>
|
||||
{/if}
|
||||
|
||||
<div class="heading">Data grid</div>
|
||||
@ -58,6 +60,7 @@
|
||||
defaultValue="100"
|
||||
/>
|
||||
<FormCheckboxField name="dataGrid.showHintColumns" label="Show foreign key hints" defaultValue={true} />
|
||||
<!-- <FormCheckboxField name="dataGrid.showHintColumns" label="Show foreign key hints" defaultValue={true} /> -->
|
||||
|
||||
<FormCheckboxField name="dataGrid.thousandsSeparator" label="Use thousands separator for numbers" />
|
||||
|
||||
@ -76,11 +79,11 @@
|
||||
</FormValues>
|
||||
|
||||
<div slot="footer">
|
||||
<FormSubmit value="OK" on:click={handleOk} />
|
||||
<FormButton value="Cancel" on:click={closeCurrentModal} />
|
||||
<!-- <FormSubmit value="OK" on:click={handleOk} /> -->
|
||||
<FormStyledButton value="Close" on:click={closeCurrentModal} />
|
||||
</div>
|
||||
</ModalBase>
|
||||
</FormProvider>
|
||||
</SettingsFormProvider>
|
||||
|
||||
<style>
|
||||
.heading {
|
||||
|
@ -67,7 +67,7 @@
|
||||
const rect = domSettings.getBoundingClientRect();
|
||||
const left = rect.right;
|
||||
const top = rect.bottom;
|
||||
const items = [{ command: 'settings.commands' }, { command: 'theme.changeTheme' }, { command: 'settings.show' }];
|
||||
const items = [{ command: 'settings.show' }, { command: 'theme.changeTheme' }, { command: 'settings.commands' }];
|
||||
currentDropDownMenu.set({ left, top, items });
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user