20411409289

Committed 21 Dec 2025 02:42PM UTC coverage: 1.46% (-1.8%) from 3.249%

Build # 20411409289

Build Type

push

github

Committed by

Betree

Commit Message

iterate

Run Details

26 of 1952 branches covered (1.33%)

Branch coverage included in aggregate %.

1 of 8 new or added lines in 4 files covered. (12.5%)

528 existing lines in 32 files now uncovered.

39 of 2500 relevant lines covered (1.56%)

0.07 hits per line

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

0.0

/app/components/Users/DeleteUserModal.jsx

import { useFormik } from 'formik'
import { AlertTriangle } from 'lucide-react'
import React, { useState } from 'react'
import { Trans, useTranslation } from 'react-i18next'

import { deleteUserAccount } from '../../API/http_api/current_user'
import { useLoggedInUser } from '../LoggedInUser/UserProvider'
import { Button } from '../ui/button'
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
} from '../ui/dialog'
import { Input } from '../ui/input'
import { Label } from '../ui/label'
import { Separator } from '../ui/separator'

const DeleteUserModal = ({ open, onOpenChange, onSuccess }) => {
  const { t } = useTranslation('user')
  const { loggedInUser } = useLoggedInUser()
  const [isSubmitting, setIsSubmitting] = useState(false)

  const formik = useFormik({
    initialValues: {
      usernameConfirm: '',
    },
    validate: (values) => {
      const errors = {}
      if (values.usernameConfirm !== loggedInUser.username) {
        errors.usernameConfirm = t('user:errors.usernameDoesNotMatch')
      }
      return errors
    },
    onSubmit: async () => {
      setIsSubmitting(true)
      try {
        await deleteUserAccount()
        onOpenChange(false)
        onSuccess?.()
      } catch {
        // Error is handled by the API layer
      } finally {
        setIsSubmitting(false)
      }
    },
  })

  const handleClose = () => {
    if (!isSubmitting) {
      onOpenChange(false)
      formik.resetForm()
    }
  }

  return (
    <Dialog open={open} onOpenChange={handleClose}>
      <DialogContent className="sm:max-w-[500px]">
        <DialogHeader>
          <DialogTitle>{t('deleteAccount')}</DialogTitle>
          <DialogDescription>
            <Trans i18nKey="user:deletingAccountDescription">
              Deleting your account will permanently remove all your data
            </Trans>
          </DialogDescription>
        </DialogHeader>

        <div className="space-y-4">
          <h4 className="text-lg font-semibold">
            <Trans i18nKey="user:deletingAccountWill">Deleting your account will...</Trans>
          </h4>
          <ul className="list-disc pl-6 space-y-2">
            <li>
              <Trans i18nKey="user:deleteAllVotes">Delete all your votes</Trans>
            </li>
            <li>
              <Trans i18nKey="user:deleteAllFlags">Delete all your flags</Trans>
            </li>
            <li>
              <Trans i18nKey="user:deleteAllPersonalData">
                Delete all your personal data (email, username...etc)
              </Trans>
            </li>
            <li>
              <Trans i18nKey="user:anonymizeAllComments">Anonymize all your comments</Trans>
            </li>
            <li>
              <Trans i18nKey="user:anonymizeActionsHistory">Anonymize your actions history</Trans>
            </li>
          </ul>
        </div>

        <form onSubmit={formik.handleSubmit} className="space-y-4">
          <div className="space-y-4 mt-4">
            <Label htmlFor="usernameConfirm" className="text-lg">
              <Trans i18nKey="user:typeUsernameToConfirm">
                Type your username below to confirm the deletion:
              </Trans>
            </Label>
            <Input
              id="usernameConfirm"
              name="usernameConfirm"
              value={formik.values.usernameConfirm}
              onChange={formik.handleChange}
              onBlur={formik.handleBlur}
              className="w-full"
              placeholder={t('user:username')}
            />
            {formik.touched.usernameConfirm && formik.errors.usernameConfirm && (
              <p className="text-sm text-destructive">{formik.errors.usernameConfirm}</p>
            )}
          </div>

          <Separator />

          <div className="flex flex-col items-center">
            <AlertTriangle size={24} className="text-destructive" />
            <h2 className="text-2xl font-bold mt-2">
              <Trans i18nKey="user:thisActionIsIrreversible">This action is irreversible</Trans>
            </h2>
          </div>

          <Separator />
        </form>

        <DialogFooter>
          <Button type="button" variant="outline" onClick={handleClose} disabled={isSubmitting}>
            {t('main:actions.cancel')}
          </Button>
          <Button
            type="submit"
            variant="destructive"
            onClick={formik.handleSubmit}
            disabled={!formik.isValid || isSubmitting}
            loading={isSubmitting}
          >
            {t('main:actions.delete')}
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  )
}

export default DeleteUserModal

1	import { useFormik } from 'formik'
2	import { AlertTriangle } from 'lucide-react'
3	import React, { useState } from 'react'
4	import { Trans, useTranslation } from 'react-i18next'
5
6	import { deleteUserAccount } from '../../API/http_api/current_user'
7	import { useLoggedInUser } from '../LoggedInUser/UserProvider'
8	import { Button } from '../ui/button'
9	import {
10	Dialog,
11	DialogContent,
12	DialogDescription,
13	DialogFooter,
14	DialogHeader,
15	DialogTitle,
16	} from '../ui/dialog'
17	import { Input } from '../ui/input'
18	import { Label } from '../ui/label'
19	import { Separator } from '../ui/separator'
20
UNCOV 21	const DeleteUserModal = ({ open, onOpenChange, onSuccess }) => {	×
UNCOV 22	const { t } = useTranslation('user')	×
UNCOV 23	const { loggedInUser } = useLoggedInUser()	×
UNCOV 24	const [isSubmitting, setIsSubmitting] = useState(false)	×
25
UNCOV 26	const formik = useFormik({	×
27	initialValues: {
28	usernameConfirm: '',
29	},
30	validate: (values) => {
UNCOV 31	const errors = {}	×
UNCOV 32	if (values.usernameConfirm !== loggedInUser.username) {	×
UNCOV 33	errors.usernameConfirm = t('user:errors.usernameDoesNotMatch')	×
34	}
UNCOV 35	return errors	×
36	},
37	onSubmit: async () => {
UNCOV 38	setIsSubmitting(true)	×
UNCOV 39	try {	×
UNCOV 40	await deleteUserAccount()	×
UNCOV 41	onOpenChange(false)	×
UNCOV 42	onSuccess?.()	×
43	} catch {
44	// Error is handled by the API layer
45	} finally {
UNCOV 46	setIsSubmitting(false)	×
47	}
48	},
49	})
50
UNCOV 51	const handleClose = () => {	×
UNCOV 52	if (!isSubmitting) {	×
UNCOV 53	onOpenChange(false)	×
UNCOV 54	formik.resetForm()	×
55	}
56	}
57
UNCOV 58	return (	×
59	<Dialog open={open} onOpenChange={handleClose}>
60	<DialogContent className="sm:max-w-[500px]">
61	<DialogHeader>
62	<DialogTitle>{t('deleteAccount')}</DialogTitle>
63	<DialogDescription>
64	<Trans i18nKey="user:deletingAccountDescription">
65	Deleting your account will permanently remove all your data
66	</Trans>
67	</DialogDescription>
68	</DialogHeader>
69
70	<div className="space-y-4">
71	<h4 className="text-lg font-semibold">
72	<Trans i18nKey="user:deletingAccountWill">Deleting your account will...</Trans>
73	</h4>
74	<ul className="list-disc pl-6 space-y-2">
75	<li>
76	<Trans i18nKey="user:deleteAllVotes">Delete all your votes</Trans>
77	</li>
78	<li>
79	<Trans i18nKey="user:deleteAllFlags">Delete all your flags</Trans>
80	</li>
81	<li>
82	<Trans i18nKey="user:deleteAllPersonalData">
83	Delete all your personal data (email, username...etc)
84	</Trans>
85	</li>
86	<li>
87	<Trans i18nKey="user:anonymizeAllComments">Anonymize all your comments</Trans>
88	</li>
89	<li>
90	<Trans i18nKey="user:anonymizeActionsHistory">Anonymize your actions history</Trans>
91	</li>
92	</ul>
93	</div>
94
95	<form onSubmit={formik.handleSubmit} className="space-y-4">
96	<div className="space-y-4 mt-4">
97	<Label htmlFor="usernameConfirm" className="text-lg">
98	<Trans i18nKey="user:typeUsernameToConfirm">
99	Type your username below to confirm the deletion:
100	</Trans>
101	</Label>
102	<Input
103	id="usernameConfirm"
104	name="usernameConfirm"
105	value={formik.values.usernameConfirm}
106	onChange={formik.handleChange}
107	onBlur={formik.handleBlur}
108	className="w-full"
109	placeholder={t('user:username')}
110	/>
111	{formik.touched.usernameConfirm && formik.errors.usernameConfirm && (	×
112	<p className="text-sm text-destructive">{formik.errors.usernameConfirm}</p>
113	)}
114	</div>
115
116	<Separator />
117
118	<div className="flex flex-col items-center">
119	<AlertTriangle size={24} className="text-destructive" />
120	<h2 className="text-2xl font-bold mt-2">
121	<Trans i18nKey="user:thisActionIsIrreversible">This action is irreversible</Trans>
122	</h2>
123	</div>
124
125	<Separator />
126	</form>
127
128	<DialogFooter>
129	<Button type="button" variant="outline" onClick={handleClose} disabled={isSubmitting}>
130	{t('main:actions.cancel')}
131	</Button>
132	<Button
133	type="submit"
134	variant="destructive"
135	onClick={formik.handleSubmit}
136	disabled={!formik.isValid \|\| isSubmitting}	×
137	loading={isSubmitting}
138	>
139	{t('main:actions.delete')}
140	</Button>
141	</DialogFooter>
142	</DialogContent>
143	</Dialog>
144	)
145	}
146
147	export default DeleteUserModal

CaptainFact / captain-fact-frontend / 20411409289

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