From 00e8810bc8b80de1820f054a81ed0f2aaba30943 Mon Sep 17 00:00:00 2001 From: patrickwebsdev Date: Fri, 8 Nov 2024 08:50:38 -0300 Subject: [PATCH 1/3] feature: admin can change urgency --- src/components/ChangeUrgencyHelpRequest.tsx | 101 ++++++++++++++++++++ src/components/OfferCard.tsx | 10 +- src/components/PhoneInfo.tsx | 9 +- src/components/SolicitudCard.jsx | 23 +++-- 4 files changed, 124 insertions(+), 19 deletions(-) create mode 100644 src/components/ChangeUrgencyHelpRequest.tsx diff --git a/src/components/ChangeUrgencyHelpRequest.tsx b/src/components/ChangeUrgencyHelpRequest.tsx new file mode 100644 index 00000000..147cfd37 --- /dev/null +++ b/src/components/ChangeUrgencyHelpRequest.tsx @@ -0,0 +1,101 @@ +'use client'; + +import { supabase } from '@/lib/supabase/client'; +import { ChangeEvent, MouseEvent, useState } from 'react'; +import { Spinner } from '@/components/Spinner'; +import Modal from '@/components/Modal'; +import { useModal } from '@/context/ModalProvider'; + +type ChangeStatusRequestButtonProps = { + helpRequestId: number; + onUpdate: (urgency: string) => void; + currentUrgency: string; +}; + +export default function ChangeUrgencyHelpRequest({ + helpRequestId, + onUpdate, + currentUrgency, +}: ChangeStatusRequestButtonProps) { + const { toggleModal } = useModal(); + const [isLoading, setLoading] = useState(false); + const [error, setError] = useState({}); + const [data, setData] = useState({}); + const [status, setStatus] = useState(currentUrgency); + + const MODAL_NAME = `Actualizar-Solicitud-${helpRequestId}`; + + const updateHelpRequest = async () => { + const { data, error } = await supabase + .from('help_requests') + .update({ urgency: status }) + .eq('id', helpRequestId) + .select(); + + return { data, error }; + }; + + async function handleUpdateSubmit(e: MouseEvent) { + e.preventDefault(); + const { data, error } = await updateHelpRequest(); + if (error) { + setError(error); + return; + } + if (data) { + setData(data); + onUpdate(status); + } + toggleModal(MODAL_NAME, false); + } + async function handleSubmit(e: ChangeEvent) { + e.preventDefault(); + toggleModal(MODAL_NAME, true); + } + + if (isLoading) return ; + if (error === undefined) return <>; + + return ( + <> + + + +
+

Cambiar estado

+

¿Estas seguro que deseas cambiar el estado de solicitud a {status}?

+
+ + +
+
+ + + ); +} diff --git a/src/components/OfferCard.tsx b/src/components/OfferCard.tsx index 8aea9f25..4f4ab612 100644 --- a/src/components/OfferCard.tsx +++ b/src/components/OfferCard.tsx @@ -15,15 +15,7 @@ export default function OfferCard({ caso, showLink = true }: OfferCardProps) {
- +
{caso.name} #{caso.id} diff --git a/src/components/PhoneInfo.tsx b/src/components/PhoneInfo.tsx index 7d37b487..83d05ed4 100644 --- a/src/components/PhoneInfo.tsx +++ b/src/components/PhoneInfo.tsx @@ -5,8 +5,9 @@ import { HelpRequestData } from '@/types/Requests'; type PhoneInfoProps = { caseInfo: HelpRequestData; + isAdmin: boolean; }; -export default function PhoneInfo({ caseInfo }: PhoneInfoProps) { +export default function PhoneInfo({ caseInfo, isAdmin }: PhoneInfoProps) { const session = useSession(); const { @@ -26,9 +27,11 @@ export default function PhoneInfo({ caseInfo }: PhoneInfoProps) { Contacto:{' '} {session && session.user - ? !!userAssignment + ? isAdmin ? caseInfo.contact_info - : 'Dale al botón "Quiero ayudar" para ver sus datos de contacto.' + : !!userAssignment + ? caseInfo.contact_info + : 'Dale al botón "Quiero ayudar" para ver sus datos de contacto.' : 'Inicia sesion para ver este dato'} ); diff --git a/src/components/SolicitudCard.jsx b/src/components/SolicitudCard.jsx index 576be9ec..edbc4afb 100644 --- a/src/components/SolicitudCard.jsx +++ b/src/components/SolicitudCard.jsx @@ -9,7 +9,8 @@ import PhoneInfo from '@/components/PhoneInfo'; import DeleteHelpRequest from './DeleteHelpRequest'; import { useTowns } from '@/context/TownProvider'; import { useRole } from '@/context/RoleProvider'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; +import ChangeUrgencyHelpRequest from './ChangeUrgencyHelpRequest'; // type SolicitudCardProps = { // caso: HelpRequestData; @@ -26,6 +27,7 @@ export default function SolicitudCard({ caso, showLink = true, showEdit = false const isAdmin = role === 'admin'; const [deleted, setDeleted] = useState(false); const isMyRequest = session.user?.id && session.user.id === caso.user_id; + const [updateUrgency, setUpdateUrgency] = useState(caso.urgency); return ( !deleted && ( @@ -35,9 +37,9 @@ export default function SolicitudCard({ caso, showLink = true, showEdit = false
- Urgencia: {caso.urgency === 'alta' ? 'Alta' : caso.urgency === 'media' ? 'Media' : 'Baja'} + Urgencia: {updateUrgency === 'alta' ? 'Alta' : updateUrgency === 'media' ? 'Media' : 'Baja'} #{caso.id}
@@ -99,7 +101,7 @@ export default function SolicitudCard({ caso, showLink = true, showEdit = false {caso.contact_info && (
- +
)} {caso.help_type && ( @@ -182,6 +184,13 @@ export default function SolicitudCard({ caso, showLink = true, showEdit = false )} + {isAdmin && ( + + )} {isAdmin && setDeleted(true)} />}
From 24f5d105a865a82ad80e7c9e92946eccaf9f9613 Mon Sep 17 00:00:00 2001 From: patrickwebsdev Date: Fri, 8 Nov 2024 08:58:31 -0300 Subject: [PATCH 2/3] resolve conflicts --- .../{SolicitudCard.jsx => SolicitudCard.tsx} | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) rename src/components/{SolicitudCard.jsx => SolicitudCard.tsx} (96%) diff --git a/src/components/SolicitudCard.jsx b/src/components/SolicitudCard.tsx similarity index 96% rename from src/components/SolicitudCard.jsx rename to src/components/SolicitudCard.tsx index edbc4afb..b8253637 100644 --- a/src/components/SolicitudCard.jsx +++ b/src/components/SolicitudCard.tsx @@ -9,20 +9,20 @@ import PhoneInfo from '@/components/PhoneInfo'; import DeleteHelpRequest from './DeleteHelpRequest'; import { useTowns } from '@/context/TownProvider'; import { useRole } from '@/context/RoleProvider'; -import { useEffect, useState } from 'react'; +import { useState } from 'react'; import ChangeUrgencyHelpRequest from './ChangeUrgencyHelpRequest'; -// type SolicitudCardProps = { -// caso: HelpRequestData; -// showLink?: boolean; -// showEdit?: boolean; -// }; +type SolicitudCardProps = { + caso: HelpRequestData; + showLink?: boolean; + showEdit?: boolean; +}; -export default function SolicitudCard({ caso, showLink = true, showEdit = false }) { +export default function SolicitudCard({ caso, showLink = true, showEdit = false }: SolicitudCardProps) { const session = useSession(); const role = useRole(); const { getTownById } = useTowns(); - const additionalInfo = caso.additional_info; + const additionalInfo = caso.additional_info as HelpRequestAdditionalInfo; const special_situations = 'special_situations' in additionalInfo ? additionalInfo.special_situations : undefined; const isAdmin = role === 'admin'; const [deleted, setDeleted] = useState(false); @@ -187,7 +187,7 @@ export default function SolicitudCard({ caso, showLink = true, showEdit = false {isAdmin && ( )} From 0536e0e5292222642608f28914e4c9749ef8829b Mon Sep 17 00:00:00 2001 From: patrickwebsdev Date: Fri, 8 Nov 2024 09:17:25 -0300 Subject: [PATCH 3/3] fix: unused usestate --- src/components/ChangeUrgencyHelpRequest.tsx | 2 -- src/components/DeleteHelpRequest.tsx | 6 +++--- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/components/ChangeUrgencyHelpRequest.tsx b/src/components/ChangeUrgencyHelpRequest.tsx index 147cfd37..c674d36b 100644 --- a/src/components/ChangeUrgencyHelpRequest.tsx +++ b/src/components/ChangeUrgencyHelpRequest.tsx @@ -20,7 +20,6 @@ export default function ChangeUrgencyHelpRequest({ const { toggleModal } = useModal(); const [isLoading, setLoading] = useState(false); const [error, setError] = useState({}); - const [data, setData] = useState({}); const [status, setStatus] = useState(currentUrgency); const MODAL_NAME = `Actualizar-Solicitud-${helpRequestId}`; @@ -43,7 +42,6 @@ export default function ChangeUrgencyHelpRequest({ return; } if (data) { - setData(data); onUpdate(status); } toggleModal(MODAL_NAME, false); diff --git a/src/components/DeleteHelpRequest.tsx b/src/components/DeleteHelpRequest.tsx index ffe05287..2446bea0 100644 --- a/src/components/DeleteHelpRequest.tsx +++ b/src/components/DeleteHelpRequest.tsx @@ -15,7 +15,6 @@ export default function DeleteHelpRequest({ helpRequestId, onDelete }: DeleteReq const { toggleModal } = useModal(); const [isLoading, setLoading] = useState(false); const [error, setError] = useState({}); - const [data, setData] = useState({}); const MODAL_NAME = `Eliminar-Solicitud-${helpRequestId}`; @@ -31,8 +30,9 @@ export default function DeleteHelpRequest({ helpRequestId, onDelete }: DeleteReq setError(error); return; } - if (data) setData(data); - onDelete(); + if (data) { + onDelete(); + } toggleModal(MODAL_NAME, false); } async function handleSubmit(e: MouseEvent) {