refactor: integrate current user data across components

- Replaced instances of `authStore` with `currentUser` to streamline user authentication handling.
- Updated permission checks and user-related data retrieval to utilize the new `useQuery` for better performance and clarity.
- Cleaned up component structures and improved formatting for consistency and readability.
- Enhanced error handling and user feedback mechanisms in various components to improve user experience.
This commit is contained in:
2025-11-08 10:52:33 -03:00
parent 01138b3e1c
commit 9a5f2b294d
28 changed files with 2312 additions and 1235 deletions

View File

@@ -14,16 +14,21 @@
let { conversaId, onClose }: Props = $props();
const client = useConvexClient();
const mensagensAgendadas = useQuery(api.chat.obterMensagensAgendadas, { conversaId });
const mensagensAgendadas = useQuery(api.chat.obterMensagensAgendadas, {
conversaId,
});
let mensagem = $state("");
let data = $state("");
let hora = $state("");
let loading = $state(false);
// Rastrear mudanças nas mensagens agendadas
$effect(() => {
console.log("📅 [ScheduleModal] Mensagens agendadas atualizadas:", mensagensAgendadas?.data);
console.log(
"📅 [ScheduleModal] Mensagens agendadas atualizadas:",
mensagensAgendadas?.data,
);
});
// Definir data/hora mínima (agora)
@@ -33,7 +38,7 @@
function getPreviewText(): string {
if (!data || !hora) return "";
try {
const dataHora = new Date(`${data}T${hora}`);
return `Será enviada em ${format(dataHora, "dd/MM/yyyy 'às' HH:mm", { locale: ptBR })}`;
@@ -51,7 +56,7 @@
try {
loading = true;
const dataHora = new Date(`${data}T${hora}`);
// Validar data futura
if (dataHora.getTime() <= Date.now()) {
alert("A data e hora devem ser futuras");
@@ -67,7 +72,7 @@
mensagem = "";
data = "";
hora = "";
// Dar tempo para o Convex processar e recarregar a lista
setTimeout(() => {
alert("Mensagem agendada com sucesso!");
@@ -84,7 +89,9 @@
if (!confirm("Deseja cancelar esta mensagem agendada?")) return;
try {
await client.mutation(api.chat.cancelarMensagemAgendada, { mensagemId: mensagemId as any });
await client.mutation(api.chat.cancelarMensagemAgendada, {
mensagemId: mensagemId as any,
});
} catch (error) {
console.error("Erro ao cancelar mensagem:", error);
alert("Erro ao cancelar mensagem");
@@ -93,17 +100,27 @@
function formatarDataHora(timestamp: number): string {
try {
return format(new Date(timestamp), "dd/MM/yyyy 'às' HH:mm", { locale: ptBR });
return format(new Date(timestamp), "dd/MM/yyyy 'às' HH:mm", {
locale: ptBR,
});
} catch {
return "Data inválida";
}
}
</script>
<dialog class="modal modal-open" onclick={(e) => e.target === e.currentTarget && onClose()}>
<div class="modal-box max-w-2xl max-h-[90vh] flex flex-col p-0" onclick={(e) => e.stopPropagation()}>
<dialog
class="modal modal-open"
onclick={(e) => e.target === e.currentTarget && onClose()}
>
<div
class="modal-box max-w-2xl max-h-[90vh] flex flex-col p-0"
onclick={(e) => e.stopPropagation()}
>
<!-- Header -->
<div class="flex items-center justify-between px-6 py-4 border-b border-base-300">
<div
class="flex items-center justify-between px-6 py-4 border-b border-base-300"
>
<h2 id="modal-title" class="text-xl font-bold flex items-center gap-2">
<Clock class="w-5 h-5 text-primary" />
Agendar Mensagem
@@ -124,7 +141,7 @@
<div class="card bg-base-200">
<div class="card-body">
<h3 class="card-title text-lg">Nova Mensagem Agendada</h3>
<div class="form-control">
<label class="label" for="mensagem-input">
<span class="label-text">Mensagem</span>
@@ -138,7 +155,9 @@
aria-describedby="char-count"
></textarea>
<div class="label">
<span id="char-count" class="label-text-alt">{mensagem.length}/500</span>
<span id="char-count" class="label-text-alt"
>{mensagem.length}/500</span
>
</div>
</div>
@@ -187,15 +206,21 @@
disabled={loading || !mensagem.trim() || !data || !hora}
>
<!-- Efeito de brilho no hover -->
<div class="absolute inset-0 bg-white/0 group-hover:bg-white/10 transition-colors duration-300"></div>
<div
class="absolute inset-0 bg-white/0 group-hover:bg-white/10 transition-colors duration-300"
></div>
<div class="relative z-10 flex items-center gap-2">
{#if loading}
<span class="loading loading-spinner loading-sm"></span>
<span>Agendando...</span>
{:else}
<Clock class="w-5 h-5 group-hover:scale-110 transition-transform" />
<span class="group-hover:scale-105 transition-transform">Agendar</span>
<Clock
class="w-5 h-5 group-hover:scale-110 transition-transform"
/>
<span class="group-hover:scale-105 transition-transform"
>Agendar</span
>
{/if}
</div>
</button>
@@ -207,15 +232,15 @@
<div class="card bg-base-200">
<div class="card-body">
<h3 class="card-title text-lg">Mensagens Agendadas</h3>
{#if mensagensAgendadas?.data && mensagensAgendadas.data.length > 0}
<div class="space-y-3">
{#each mensagensAgendadas.data as msg (msg._id)}
<div class="flex items-start gap-3 p-3 bg-base-100 rounded-lg">
<div class="flex-shrink-0 mt-1">
<div class="shrink-0 mt-1">
<Clock class="w-5 h-5 text-primary" />
</div>
<div class="flex-1 min-w-0">
<p class="text-sm font-medium text-base-content/80">
{formatarDataHora(msg.agendadaPara || 0)}
@@ -233,8 +258,12 @@
onclick={() => handleCancelar(msg._id)}
aria-label="Cancelar"
>
<div class="absolute inset-0 bg-error/0 group-hover:bg-error/20 transition-colors duration-300"></div>
<Trash2 class="w-5 h-5 text-error relative z-10 group-hover:scale-110 transition-transform" />
<div
class="absolute inset-0 bg-error/0 group-hover:bg-error/20 transition-colors duration-300"
></div>
<Trash2
class="w-5 h-5 text-error relative z-10 group-hover:scale-110 transition-transform"
/>
</button>
</div>
{/each}