import { SwitchItem } from '@vizality/components/settings';
import React, { memo, useEffect } from 'react';
import { getModule } from '@vizality/webpack';
import { useFilter } from '@vizality/hooks';
import { Messages } from '@vizality/i18n';

export default memo(({ builtin, search = '' }) => {
  const [ experimentalWebPlatform, setExperimentalWebPlatform ] = vizality.api.settings.useSetting('experimentalWebPlatform', false);
  const [ discordExperiments, setDiscordExperiments ] = vizality.api.settings.useSetting('discordExperiments', false);
  const [ smoothScrolling, setSmoothScrolling ] = vizality.api.settings.useSetting('smoothScrolling', true);
  const [ debugLogs, setDebugLogs ] = vizality.api.settings.useSetting('debugLogs', false);
  const [ hideToken, setHideToken ] = vizality.api.settings.useSetting('hideToken', true);

  const items = [
    {
      search: [
        Messages.VIZALITY_SETTINGS_SMOOTH_SCROLLING,
        Messages.VIZALITY_SETTINGS_SMOOTH_SCROLLING_DESC,
        'pie'
      ],
      render: query =>
        <SwitchItem
          description={Messages.VIZALITY_SETTINGS_SMOOTH_SCROLLING_DESC}
          value={smoothScrolling}
          onChange={() => {
            try {
              setSmoothScrolling(!smoothScrolling);
            } catch (err) {
              builtin.error(err);
            }
          }}
          help={Messages.VIZALITY_SETTINGS_SMOOTH_SCROLLING_HELP}
          requiresRestart
        >
          {Messages.VIZALITY_SETTINGS_SMOOTH_SCROLLING}
        </SwitchItem>
    },
    {
      search: [
        Messages.VIZALITY_SETTINGS_DEBUG_LOGS_DESC,
        Messages.VIZALITY_SETTINGS_DEBUG_LOGS,
        'pie'
      ],
      render: query =>
        <SwitchItem
          description={Messages.VIZALITY_SETTINGS_DEBUG_LOGS_DESC}
          value={debugLogs}
          onChange={() => {
            try {
              setDebugLogs(!debugLogs);
            } catch (err) {
              builtin.error(err);
            }
          }}
          requiresRestart
        >
          {Messages.VIZALITY_SETTINGS_DEBUG_LOGS}
        </SwitchItem>
    },
    {
      search: [
        Messages.VIZALITY_SETTINGS_KEEP_TOKEN_DESC,
        Messages.VIZALITY_SETTINGS_KEEP_TOKEN,
        'pie'
      ],
      render: query =>
        <SwitchItem
          description={Messages.VIZALITY_SETTINGS_KEEP_TOKEN_DESC}
          value={hideToken}
          onChange={() => {
            try {
              setHideToken(!hideToken);
            } catch (err) {
              builtin.error(err);
            }
          }}
        >
          {Messages.VIZALITY_SETTINGS_KEEP_TOKEN}
        </SwitchItem>
    },
    {
      search: [
        Messages.VIZALITY_SETTINGS_EXP_WEB_PLATFORM_DESC,
        Messages.VIZALITY_SETTINGS_EXP_WEB_PLATFORM,
        'pie'
      ],
      render: query =>
        <SwitchItem
          description={Messages.VIZALITY_SETTINGS_EXP_WEB_PLATFORM_DESC}
          value={experimentalWebPlatform}
          onChange={() => {
            try {
              setExperimentalWebPlatform(!experimentalWebPlatform);
            } catch (err) {
              builtin.error(err);
            }
          }}
          requiresRestart
        >
          {Messages.VIZALITY_SETTINGS_EXP_WEB_PLATFORM}
        </SwitchItem>
    },
    {
      search: [
        Messages.VIZALITY_SETTINGS_DISCORD_EXPERIMENTS,
        Messages.VIZALITY_SETTINGS_DISCORD_EXPERIMENTS_DESC.format()
      ],
      render: query =>
        <SwitchItem
          description={Messages.VIZALITY_SETTINGS_DISCORD_EXPERIMENTS_DESC.format()}
          value={discordExperiments}
          onChange={() => {
            try {
              setDiscordExperiments(!discordExperiments);
              const experimentsModule = getModule(r => r.isDeveloper !== void 0);
              Object.defineProperty(experimentsModule, 'isDeveloper', {
                get: () => !discordExperiments,
                configurable: true
              });
            } catch (err) {
              builtin.error(err);
            }
          }}
        >
          {Messages.VIZALITY_SETTINGS_DISCORD_EXPERIMENTS}
        </SwitchItem>
    }
  ];

  const [ query, setQuery, filteredResults ] = useFilter({
    keys: [ 'search' ],
    data: items
  });

  useEffect(() => {
    setQuery(search);
  }, [ search ]);

  return filteredResults.map(result => result.render(query));
});
