How to use the @polkadot/ui-settings.uiTheme function in @polkadot/ui-settings

console.log('WS endpoint=', wsEndpoint);

try {
  const types = store.get('types') || {};
  const names = Object.keys(types);

  if (names.length) {
    registry.register(types);
    console.log('Type registration:', names.join(', '));
  }
} catch (error) {
  console.error('Type registration failed', error);
}

const theme = {
  theme: settings.uiTheme
};

if (!rootElement) {
  throw new Error(`Unable to find element with id '${rootId}'`);
}

ReactDOM.render(
  
    
      
        {({ queuePayload, queueSetTxStatus }): React.ReactNode => (

import BN from 'bn.js';
import React from 'react';
import styled from 'styled-components';
import { ActionItem, Chart, Static, Voting } from '@polkadot/react-components';
import { formatBalance, formatNumber } from '@polkadot/util';
import settings from '@polkadot/ui-settings';
import VoteThreshold from '@polkadot/react-params/Param/VoteThreshold';
import { withCalls, withMulti } from '@polkadot/react-api';

import translate from '../translate';

const COLORS_AYE = settings.uiTheme === 'substrate'
  ? ['#4d4', '#4e4']
  : ['#64bebe', '#5badad'];
const COLORS_NAY = settings.uiTheme === 'substrate'
  ? ['#d44', '#e44']
  : ['#d75ea1', '#e189ba'];

interface Props extends ApiProps, I18nProps {
  idNumber: BN;
  chain_bestNumber?: BN;
  democracy_referendumVotesFor?: DerivedReferendumVote[];
  democracy_enactmentPeriod: BN;
  value: ReferendumInfoExtended;
}

interface State {
  voteCount: number;
  voteCountAye: number;
  voteCountNay: number;
  votedAye: BN;

import { ApiProps } from '@polkadot/react-api/types';
import { I18nProps } from '@polkadot/react-components/types';
import { ReferendumInfoExtended } from '@polkadot/api-derive/type';

import BN from 'bn.js';
import React from 'react';
import styled from 'styled-components';
import { ActionItem, Chart, Static, Voting } from '@polkadot/react-components';
import { formatBalance, formatNumber } from '@polkadot/util';
import settings from '@polkadot/ui-settings';
import VoteThreshold from '@polkadot/react-params/Param/VoteThreshold';
import { withCalls, withMulti } from '@polkadot/react-api';

import translate from '../translate';

const COLORS_AYE = settings.uiTheme === 'substrate'
  ? ['#4d4', '#4e4']
  : ['#64bebe', '#5badad'];
const COLORS_NAY = settings.uiTheme === 'substrate'
  ? ['#d44', '#e44']
  : ['#d75ea1', '#e189ba'];

interface Props extends ApiProps, I18nProps {
  idNumber: BN;
  chain_bestNumber?: BN;
  democracy_referendumVotesFor?: DerivedReferendumVote[];
  democracy_enactmentPeriod: BN;
  value: ReferendumInfoExtended;
}

interface State {
  voteCount: number;