<commit_before>import React, { ReactNode } from "react";

import {
    Dialog,
    Grid,
    makeStyles,
    DialogContent,
    Button,
    DialogActions,
    Typography,
    useTheme,
} from "@material-ui/core";

import FingerTouchIcon from "../../../components/FingerTouchIcon";
import PieChartIcon from "../../../components/PieChartIcon";
import PushNotificationIcon from "../../../components/PushNotificationIcon";
import { SecondFactorMethod } from "../../../models/Methods";

export interface Props {
    open: boolean;
    methods: Set<SecondFactorMethod>;
    u2fSupported: boolean;

    onClose: () => void;
    onClick: (method: SecondFactorMethod) => void;
}

const MethodSelectionDialog = function (props: Props) {
    const style = useStyles();
    const theme = useTheme();

    const pieChartIcon = (
        <PieChartIcon
            width={24}
            height={24}
            maxProgress={1000}
            progress={150}
            color={theme.palette.primary.main}
            backgroundColor={"white"}
        />
    );

    return (
        <Dialog open={props.open} className={style.root} onClose={props.onClose}>
            <DialogContent>
                <Grid container justify="center" spacing={1} id="methods-dialog">
                    {props.methods.has(SecondFactorMethod.TOTP) ? (
                        <MethodItem
                            id="one-time-password-option"
                            method="One-Time Password"
                            icon={pieChartIcon}
                            onClick={() => props.onClick(SecondFactorMethod.TOTP)}
                        />
                    ) : null}
                    {props.methods.has(SecondFactorMethod.U2F) && props.u2fSupported ? (
                        <MethodItem
                            id="security-key-option"<commit_msg>[MISC] Fix OTP countdown circle (#1604)<commit_after>import React, { ReactNode } from "react";

import {
    Dialog,
    Grid,
    makeStyles,
    DialogContent,
    Button,
    DialogActions,
    Typography,
    useTheme,
} from "@material-ui/core";

import FingerTouchIcon from "../../../components/FingerTouchIcon";
import PushNotificationIcon from "../../../components/PushNotificationIcon";
import TimerIcon from "../../../components/TimerIcon";
import { SecondFactorMethod } from "../../../models/Methods";

export interface Props {
    open: boolean;
    methods: Set<SecondFactorMethod>;
    u2fSupported: boolean;

    onClose: () => void;
    onClick: (method: SecondFactorMethod) => void;
}

const MethodSelectionDialog = function (props: Props) {
    const style = useStyles();
    const theme = useTheme();

    const pieChartIcon = (
        <TimerIcon width={24} height={24} period={15} color={theme.palette.primary.main} backgroundColor={"white"} />
    );

    return (
        <Dialog open={props.open} className={style.root} onClose={props.onClose}>
            <DialogContent>
                <Grid container justify="center" spacing={1} id="methods-dialog">
                    {props.methods.has(SecondFactorMethod.TOTP) ? (
                        <MethodItem
                            id="one-time-password-option"
                            method="One-Time Password"
                            icon={pieChartIcon}
                            onClick={() => props.onClick(SecondFactorMethod.TOTP)}
                        />
                    ) : null}
                    {props.methods.has(SecondFactorMethod.U2F) && props.u2fSupported ? (
                        <MethodItem
                            id="security-key-option"
{'fraction_non_alphanumeric': 0.1275298031605212, 'fraction_numerical': 0.008039922373163293, 'mean_word_length': 1.897991967871486, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 21, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5011877', 'n_tokens_mistral': 960, 'n_tokens_neox': 933, 'n_words': 185}