import React from 'react';
import { Typography } from 'antd';
import DbConnections from './DbConnections';
import useTitle from '../../hooks/useTitle';
import SettingSwitch from './SettingSwitch';
import { LS_IS_DARK_THEME, LS_SHOW_DOWNLOAD_BUTTON } from '../../constants';

// Use `Typography` so can apply dark theme to text
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
const {
  Title
} = Typography;

/**
 * To save online db tables schema in the local db, then pages could load faster
 */
const Settings = () => {
  useTitle('Settings - db-man');
  return /*#__PURE__*/_jsxs("div", {
    children: [/*#__PURE__*/_jsx(Title, {
      level: 1,
      children: "Settings"
    }), /*#__PURE__*/_jsx(Title, {
      level: 2,
      children: "Configs"
    }), /*#__PURE__*/_jsx(SettingSwitch, {
      label: "Dark Theme",
      storageKey: LS_IS_DARK_THEME
    }), /*#__PURE__*/_jsx(SettingSwitch, {
      label: "Show Download Button",
      storageKey: LS_SHOW_DOWNLOAD_BUTTON
    }), /*#__PURE__*/_jsx(DbConnections, {
      storage: {
        set: (k, v) => window.localStorage.setItem(k, v),
        get: k => window.localStorage.getItem(k)
      }
    })]
  });
};
export default Settings;
//# sourceMappingURL=index.js.map