12937903925

Committed 23 Jan 2025 08:56PM UTC coverage: 5.504% (-1.4%) from 6.953%

Build # 12937903925

Build Type

push

github

Committed by

web-flow

Commit Message

chore: Migrate to tailwind (#1355)

Run Details

43 of 1647 branches covered (2.61%)

Branch coverage included in aggregate %.

6 of 306 new or added lines in 94 files covered. (1.96%)

94 existing lines in 39 files now uncovered.

192 of 2623 relevant lines covered (7.32%)

0.17 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/app/components/Users/DeleteUserModal.jsx

import { AlertTriangle } from 'lucide-react'
import React from 'react'
import { Trans, withTranslation } from 'react-i18next'
import { connect } from 'react-redux'
import { Field, formValueSelector, reduxForm } from 'redux-form'

import { withLoggedInUser } from '../LoggedInUser/UserProvider'
import { ModalFormContainer } from '../Modal/ModalFormContainer'
import { Input } from '../ui/input'
import { Separator } from '../ui/separator'

const DELETE_FORM = 'deleteAccount'

@reduxForm({ form: DELETE_FORM })
class DeleteForm extends React.PureComponent {
  render() {
    return (
      <div>
        <div className="space-y-4">
          <h4 className="text-lg font-semibold">
            <Trans>Deleting your account will...</Trans>
          </h4>
          <ul className="list-disc pl-6 space-y-2">
            <li>
              <Trans>Delete all your votes</Trans>
            </li>
            <li>
              <Trans>Delete all your flags</Trans>
            </li>
            <li>
              <Trans>Delete all your personal data (email, username...etc)</Trans>
            </li>
            <li>
              <Trans>Anonymize all your comments</Trans>
            </li>
            <li>
              <Trans>Anonymize your actions history</Trans>
            </li>
          </ul>
        </div>

        <div className="space-y-4 mt-4">
          <p className="text-lg">
            <Trans>Type your username below to confirm the deletion:</Trans>
          </p>
          <Field
            component={({ input }) => <Input {...input} className="w-full" />}
            name="usernameConfirm"
          />
        </div>

        <Separator className="my-5" />
        <div className="flex flex-col items-center">
          <AlertTriangle size={24} className="text-destructive" />
          <h2 className="text-2xl font-bold mt-2">
            <Trans>This action is irreversible</Trans>
          </h2>
        </div>
        <Separator className="mt-5" />
      </div>
    )
  }
}

const valueSelector = formValueSelector(DELETE_FORM)

@connect((state) => ({ usernameConfirm: valueSelector(state, 'usernameConfirm') }))
@withTranslation('main')
@withLoggedInUser
export default class DeleteUserModal extends React.PureComponent {
  render() {
    const { t, ...otherProps } = this.props
    const isValid = this.props.usernameConfirm === this.props.loggedInUser.username
    return (
      <ModalFormContainer
        title={t('user:deleteAccount')}
        FormComponent={DeleteForm}
        confirmIcon="trash-o"
        confirmType="danger"
        confirmDisabled={!isValid}
        confirmText={t('actions.delete')}
        {...otherProps}
      />
    )
  }
}

1	import { AlertTriangle } from 'lucide-react'
2	import React from 'react'
3	import { Trans, withTranslation } from 'react-i18next'
4	import { connect } from 'react-redux'
5	import { Field, formValueSelector, reduxForm } from 'redux-form'
6
7	import { withLoggedInUser } from '../LoggedInUser/UserProvider'
8	import { ModalFormContainer } from '../Modal/ModalFormContainer'
9	import { Input } from '../ui/input'
10	import { Separator } from '../ui/separator'
11
12	const DELETE_FORM = 'deleteAccount'	×
13
14	@reduxForm({ form: DELETE_FORM })
15	class DeleteForm extends React.PureComponent {
16	render() {
17	return (	×
18	<div>
19	<div className="space-y-4">
20	<h4 className="text-lg font-semibold">
21	<Trans>Deleting your account will...</Trans>
22	</h4>
23	<ul className="list-disc pl-6 space-y-2">
24	<li>
25	<Trans>Delete all your votes</Trans>
26	</li>
27	<li>
28	<Trans>Delete all your flags</Trans>
29	</li>
30	<li>
31	<Trans>Delete all your personal data (email, username...etc)</Trans>
32	</li>
33	<li>
34	<Trans>Anonymize all your comments</Trans>
35	</li>
36	<li>
37	<Trans>Anonymize your actions history</Trans>
38	</li>
39	</ul>
40	</div>
41
42	<div className="space-y-4 mt-4">
43	<p className="text-lg">
44	<Trans>Type your username below to confirm the deletion:</Trans>
45	</p>
46	<Field
NEW 47	component={({ input }) => <Input {...input} className="w-full" />}	×
48	name="usernameConfirm"
49	/>
50	</div>
51
52	<Separator className="my-5" />
53	<div className="flex flex-col items-center">
54	<AlertTriangle size={24} className="text-destructive" />
55	<h2 className="text-2xl font-bold mt-2">
56	<Trans>This action is irreversible</Trans>
57	</h2>
58	</div>
59	<Separator className="mt-5" />
60	</div>
61	)
62	}
63	}
64
65	const valueSelector = formValueSelector(DELETE_FORM)	×
66
67	@connect((state) => ({ usernameConfirm: valueSelector(state, 'usernameConfirm') }))	×
68	@withTranslation('main')
69	@withLoggedInUser
70	export default class DeleteUserModal extends React.PureComponent {
71	render() {
72	const { t, ...otherProps } = this.props	×
73	const isValid = this.props.usernameConfirm === this.props.loggedInUser.username	×
74	return (	×
75	<ModalFormContainer
76	title={t('user:deleteAccount')}
77	FormComponent={DeleteForm}
78	confirmIcon="trash-o"
79	confirmType="danger"
80	confirmDisabled={!isValid}
81	confirmText={t('actions.delete')}
82	{...otherProps}
83	/>
84	)
85	}
86	}

CaptainFact / captain-fact-frontend / 12937903925

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous