All files / components/LastWill LastWill.tsx

100% Statements 19/19
100% Branches 4/4
100% Functions 6/6
100% Lines 18/18

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84                      22x 8x 6x 6x   6x 3x 3x 3x 2x 2x   3x     6x 3x     3x 2x     1x                                       5x         11x                                                
'use client'
import { notFound } from 'next/navigation'
import { useEffect, useState } from 'react'
import { getLastWillFulltext } from '../../services/api/lastwill/lastWillFulltext'
import { useAppSelector } from '../../store/hooks'
import { GeneratedLastWill } from '../../types/lastWill'
import { Headline } from '../Headline/Headline'
 
/**
 * Display Last Will.
 */
export const LastWill = () => {
	const _id = useAppSelector((state) => state.lastWill.data._id)
	const [isLoading, setIsLoading] = useState<boolean>(true)
	const [lastWill, setLastWill] = useState<GeneratedLastWill | null>(null)
 
	useEffect(() => {
		const getGeneratedLastWill = async () => {
			setIsLoading(true)
			const response = await getLastWillFulltext(_id)
			setLastWill(response)
			setIsLoading(false)
		}
		getGeneratedLastWill()
	}, [_id])
 
	if (isLoading) {
		return <div>Loading...</div>
	}
 
	if (!lastWill) {
		return notFound()
	}
 
	return (
		<main className="w-100 bg-red-0 my-2 flex-1 rounded-xl border-2 border-gray-200 px-4 py-3 md:px-8 md:py-6 xl:w-5/6 2xl:w-4/6">
			<section className="bg-red-0 mb-8 flex justify-between">
				<aside>
					<p>{lastWill.testatorHeader.fullName}</p>
					<p>{lastWill.testatorHeader.AddressStreet}</p>
					<p>{lastWill.testatorHeader.AddressCity}</p>
				</aside>
				<aside className="bg-red-0">
					<p>{lastWill.locationHeader}</p>
				</aside>
			</section>
			<section className="bg-green-0 mb-8 text-center">
				<Headline level={3} hasMargin>
					{lastWill.title}
				</Headline>
			</section>
			<p className="mb-4">{lastWill.initialText}</p>
			<section className="bg-yellow-0 mb-8">
				{lastWill.paragraphs.map((paragraph, index) => (
					<div key={index} className="mb-6">
						<Headline level={4} hasMargin>
							{paragraph.title}
						</Headline>
						{paragraph.contents.map((content, index) => (
							<p className="mb-4" key={index}>
								{content}
							</p>
						))}
					</div>
				))}
			</section>
			<section className="mb-8 flex">
				<div>
					<p className="mb-4">[Ihre Unterschrift]</p>
					<hr className="border-t-1 mb-4 border-black" />
					<p>{lastWill.testatorHeader.fullName}</p>
				</div>
			</section>
			<footer>
				<p className="mb-4 text-gray-600">
					Hinweis: Das Testament muss mit der Hand geschrieben werden. Dieser Text stellt keinen Ersatz für
					professionelle rechtliche Beratung dar. Wenn Sie Fragen oder Bedenken haben, sollten Sie einen Anwalt
					konsultieren.
				</p>
			</footer>
		</main>
	)
}