rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: format with prettier

Browse source
This commit is contained in:
swve 2024-02-09 21:22:15 +01:00
parent 03fb09c3d6
commit a147ad6610
164 changed files with 11257 additions and 8154 deletions
Download patch file Download diff file Expand all files Collapse all files

176
apps/web/components/Objects/Modals/Feedback/Feedback.tsx
View file

@ -1,87 +1,111 @@
import FormLayout, { ButtonBlack, Flex, FormField, FormLabel, FormMessage, Textarea } from "@components/StyledElements/Form/Form"
import { BarLoader } from "react-spinners"
import FormLayout, {
ButtonBlack,
Flex,
FormField,
FormLabel,
FormMessage,
Textarea,
} from '@components/StyledElements/Form/Form'
import { BarLoader } from 'react-spinners'
import * as Form from '@radix-ui/react-form'
import React, { useState } from "react";
import * as Sentry from '@sentry/browser';
import { CheckCircleIcon } from "lucide-react";
import { useSession } from "@components/Contexts/SessionContext";
import React, { useState } from 'react'
import * as Sentry from '@sentry/browser'
import { CheckCircleIcon } from 'lucide-react'
import { useSession } from '@components/Contexts/SessionContext'
export const FeedbackModal = (user: any) => {
const session = useSession() as any;
const session = useSession() as any
const [isSubmitting, setIsSubmitting] = useState(false);
const [view, setView] = useState<"feedbackForm" | "success">("feedbackForm")
const [feedbackMessage, setFeedbackMessage] = useState("");
const [isSubmitting, setIsSubmitting] = useState(false)
const [view, setView] = useState<'feedbackForm' | 'success'>('feedbackForm')
const [feedbackMessage, setFeedbackMessage] = useState('')
const handleSubmit = async (e: any) => {
e.preventDefault()
setIsSubmitting(true)
const handleSubmit = async (e: any) => {
e.preventDefault();
setIsSubmitting(true);
const user = session.user ? session.user : null
const eventId = Sentry.captureMessage(
`Feedback from ${user ? user.email : 'Anonymous'} - ${feedbackMessage}`
)
const user = session.user ? session.user : null;
const eventId = Sentry.captureMessage(`Feedback from ${user ? user.email : 'Anonymous'} - ${feedbackMessage}`);
const userFeedback = {
event_id: eventId,
name: user ? user.full_name : 'Anonymous',
email: user ? user.email : 'Anonymous',
comments: feedbackMessage,
}
Sentry.captureUserFeedback(userFeedback);
setIsSubmitting(false);
setView("success");
};
const handleFeedbackMessage = (event: React.ChangeEvent<any>) => {
setFeedbackMessage(event.target.value)
};
if (view == "feedbackForm") {
return (
<FormLayout onSubmit={handleSubmit}>
<FormField name="feedback-message">
<Flex css={{ alignItems: 'baseline', justifyContent: 'space-between' }}>
<FormLabel>Feedback message</FormLabel>
<FormMessage match="valueMissing">Please provide learning elements, separated by comma (,)</FormMessage>
</Flex>
<Form.Control asChild>
<Textarea style={{ height: 150, }} onChange={handleFeedbackMessage} required />
</Form.Control>
</FormField>
<Flex css={{ marginTop: 25, justifyContent: 'flex-end' }}>
<Form.Submit asChild>
<ButtonBlack type="submit" css={{ marginTop: 10 }}>
{isSubmitting ? <BarLoader cssOverride={{ borderRadius: 60, }} width={60} color="#ffffff" />
: "Submit Feedback"}
</ButtonBlack>
</Form.Submit>
</Flex>
</FormLayout>
)
} else {
return (
<div className="flex flex-col items-center space-y-5">
<div className="flex flex-col items-center space-y-5 pt-10">
<div className="flex items-center space-x-2">
<div className="text-9xl text-green-500">
<CheckCircleIcon></CheckCircleIcon>
</div>
<div className="text-3xl text-green-500">
<div>Thank you for your feedback!</div>
</div>
</div>
<div className="text-xl text-gray-500">
<div>We will take it into account.</div>
</div>
</div>
<div className="flex items-center space-x-2">
<ButtonBlack onClick={() => setView("feedbackForm")}>Send another feedback</ButtonBlack>
</div>
</div>
)
const userFeedback = {
event_id: eventId,
name: user ? user.full_name : 'Anonymous',
email: user ? user.email : 'Anonymous',
comments: feedbackMessage,
}
Sentry.captureUserFeedback(userFeedback)
setIsSubmitting(false)
setView('success')
}
const handleFeedbackMessage = (event: React.ChangeEvent<any>) => {
setFeedbackMessage(event.target.value)
}
if (view == 'feedbackForm') {
return (
<FormLayout onSubmit={handleSubmit}>
<FormField name="feedback-message">
<Flex
css={{ alignItems: 'baseline', justifyContent: 'space-between' }}
>
<FormLabel>Feedback message</FormLabel>
<FormMessage match="valueMissing">
Please provide learning elements, separated by comma (,)
</FormMessage>
</Flex>
<Form.Control asChild>
<Textarea
style={{ height: 150 }}
onChange={handleFeedbackMessage}
required
/>
</Form.Control>
</FormField>
<Flex css={{ marginTop: 25, justifyContent: 'flex-end' }}>
<Form.Submit asChild>
<ButtonBlack type="submit" css={{ marginTop: 10 }}>
{isSubmitting ? (
<BarLoader
cssOverride={{ borderRadius: 60 }}
width={60}
color="#ffffff"
/>
) : (
'Submit Feedback'
)}
</ButtonBlack>
</Form.Submit>
</Flex>
</FormLayout>
)
} else {
return (
<div className="flex flex-col items-center space-y-5">
<div className="flex flex-col items-center space-y-5 pt-10">
<div className="flex items-center space-x-2">
<div className="text-9xl text-green-500">
<CheckCircleIcon></CheckCircleIcon>
</div>
<div className="text-3xl text-green-500">
<div>Thank you for your feedback!</div>
</div>
</div>
<div className="text-xl text-gray-500">
<div>We will take it into account.</div>
</div>
</div>
<div className="flex items-center space-x-2">
<ButtonBlack onClick={() => setView('feedbackForm')}>
Send another feedback
</ButtonBlack>
</div>
</div>
)
}
}
export default FeedbackModal
export default FeedbackModal