@polkadot/util#isBoolean TypeScript Examples

function getInitial <T extends Flags> (storageKey: string, initial: T): T {
  const saved = store.get(`flags:${storageKey}`, {}) as T;

  return Object.keys(initial).reduce((result, key: keyof T): T => {
    if (isBoolean(saved[key])) {
      result[key] = saved[key];
    }

    return result;
  }, { ...initial });
}

function getInitial<T extends Flags>(storageKey: string, initial: T): T {
  const saved = store.get(`flags:${storageKey}`, {}) as T;

  return Object.keys(initial).reduce(
    (result, key: keyof T): T => {
      if (isBoolean(saved[key])) {
        result[key] = saved[key];
      }

      return result;
    },
    { ...initial }
  );
}

function BoolParam ({ className = '', defaultValue: { value }, isDisabled, isError, label, onChange, withLabel }: Props): React.ReactElement<Props> {
  const { t } = useTranslation();
  const [defaultValue] = useState(
    value instanceof Boolean
      ? value.valueOf()
      : isBoolean(value)
        ? value
        : false
  );

  const options = useRef([
    { text: t<string>('No'), value: false },
    { text: t<string>('Yes'), value: true }
  ]);

  const _onChange = useCallback(
    (value: boolean) =>
      onChange && onChange({
        isValid: true,
        value
      }),
    [onChange]
  );

  return (
    <Bare className={className}>
      <Dropdown
        className='full'
        defaultValue={defaultValue}
        isDisabled={isDisabled}
        isError={isError}
        label={label}
        onChange={_onChange}
        options={options.current}
        withEllipsis
        withLabel={withLabel}
      />
    </Bare>
  );
}

function BoolParam({
  className = '',
  defaultValue: { value },
  isDisabled,
  isError,
  label,
  onChange,
  withLabel,
}: Props): React.ReactElement<Props> {
  const { t } = useTranslation();
  const [defaultValue] = useState(value instanceof Boolean ? value.valueOf() : isBoolean(value) ? value : false);

  const options = useRef([
    { text: t<string>('No'), value: false },
    { text: t<string>('Yes'), value: true },
  ]);

  const _onChange = useCallback(
    (val: boolean) =>
      onChange &&
      onChange({
        isValid: true,
        value: val,
      }),
    [onChange]
  );

  return (
    <Bare className={className}>
      <Dropdown
        className="full"
        defaultValue={defaultValue}
        isDisabled={isDisabled}
        isError={isError}
        label={label}
        onChange={_onChange}
        options={options.current}
        withEllipsis
        withLabel={withLabel}
      />
    </Bare>
  );
}

function Referendum ({ className = '', value: { allAye, allNay, image, imageHash, index, isPassing, status, voteCountAye, voteCountNay, votedAye, votedNay, votedTotal } }: Props): React.ReactElement<Props> | null {
  const { t } = useTranslation();
  const { api } = useApi();
  const { allAccounts } = useAccounts();
  const bestNumber = useBestNumber();
  const totalIssuance = useCall<Balance>(api.query.balances.totalIssuance);
  const { changeAye, changeNay } = useChangeCalc(status.threshold, votedAye, votedNay, votedTotal);
  const threshold = useMemo(
    () => status.threshold.type.toString().replace('majority', ' majority '),
    [status]
  );

  const [percentages, { hasVoted, hasVotedAye }] = useMemo(
    (): [Percentages | null, VoteType] => {
      if (totalIssuance) {
        const aye = allAye.reduce((total: BN, { balance }) => total.add(balance), new BN(0));
        const nay = allNay.reduce((total: BN, { balance }) => total.add(balance), new BN(0));
        const hasVotedAye = allAye.some(({ accountId }) => allAccounts.includes(accountId.toString()));

        return [
          {
            aye: votedTotal.isZero()
              ? ''
              : `${(aye.muln(10000).div(votedTotal).toNumber() / 100).toFixed(2)}%`,
            nay: votedTotal.isZero()
              ? ''
              : `${(nay.muln(10000).div(votedTotal).toNumber() / 100).toFixed(2)}%`,
            turnout: `${((votedTotal.muln(10000).div(totalIssuance).toNumber()) / 100).toFixed(2)}%`
          },
          {
            hasVoted: hasVotedAye || allNay.some(({ accountId }) => allAccounts.includes(accountId.toString())),
            hasVotedAye
          }
        ];
      } else {
        return [null, { hasVoted: false, hasVotedAye: false }];
      }
    },
    [allAccounts, allAye, allNay, totalIssuance, votedTotal]
  );

  if (!bestNumber || status.end.sub(bestNumber).lten(0)) {
    return null;
  }

  const enactBlock = status.end.add(status.delay);
  const remainBlock = status.end.sub(bestNumber).isub(BN_ONE);

  return (
    <tr className={className}>
      <td className='number'><h1>{formatNumber(index)}</h1></td>
      <ProposalCell
        imageHash={imageHash}
        proposal={image?.proposal}
      />
      <td className='number together media--1200'>
        <BlockToTime value={remainBlock} />
        {t<string>('{{blocks}} blocks', { replace: { blocks: formatNumber(remainBlock) } })}
      </td>
      <td className='number together media--1400'>
        <BlockToTime value={enactBlock.sub(bestNumber)} />
        #{formatNumber(enactBlock)}
      </td>
      <td className='number together media--1400'>
        {percentages && (
          <>
            <div>{percentages.turnout}</div>
            {percentages.aye && (
              <div>{t<string>('{{percentage}} aye', { replace: { percentage: percentages.aye } })}</div>
            )}
          </>
        )}
      </td>
      <td className='badge'>
        {isBoolean(isPassing) && (
          <Badge
            color={isPassing ? 'green' : 'red'}
            hover={
              isPassing
                ? t<string>('{{threshold}}, passing', { replace: { threshold } })
                : t<string>('{{threshold}}, not passing', { replace: { threshold } })
            }
            icon={isPassing ? 'check' : 'times'}
          />
        )}
      </td>
      <td className='expand'>
        <ReferendumVotes
          change={changeAye}
          count={voteCountAye}
          isAye
          isWinning={isPassing}
          total={votedAye}
          votes={allAye}
        />
        <ReferendumVotes
          change={changeNay}
          count={voteCountNay}
          isAye={false}
          isWinning={!isPassing}
          total={votedNay}
          votes={allNay}
        />
      </td>
      <td className='button'>
        <Button.Group>
          {!image?.proposal && (
            <PreImageButton imageHash={imageHash} />
          )}
          <Voting
            proposal={image?.proposal}
            referendumId={index}
          />
        </Button.Group>
      </td>
      <td className='badge'>
        <Icon
          color={hasVoted ? (hasVotedAye ? 'green' : 'red') : 'gray'}
          icon='asterisk'
        />
      </td>
      <td className='links media--1000'>
        <LinkExternal
          data={index}
          isLogo
          type='referendum'
        />
      </td>
    </tr>
  );
}