I have no idea how but the date bug came back. Should be fixed

This commit is contained in:
Gabriel Brown 2024-07-21 18:39:15 -05:00
parent 1259d19fde
commit 87c7169b3c
5 changed files with 62 additions and 9 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

View File

@ -8,7 +8,22 @@ import { type Metadata } from "next";
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Tech Tracker", title: "Tech Tracker",
description: "App used by COG IT employees to update their status throughout the day.", description: "App used by COG IT employees to update their status throughout the day.",
icons: [{ rel: "icon", url: "/favicon.ico" }], icons: [
{
rel: 'icon',
url: '/favicon.ico',
},
{
rel: 'icon',
type: 'image/png',
sizes: '32x32',
url: '/images/tech_tracker_favicon.png',
},
{
rel: 'apple-touch-icon',
url: '/favicon.ico',
},
],
}; };
const fontSans = FontSans({ const fontSans = FontSans({

View File

@ -1,6 +1,6 @@
'use client'; 'use client';
import { useState, useEffect, useCallback } from 'react'; import { useState, useEffect, useCallback } from 'react';
import { useSession } from "next-auth/react";
// Define the Employee interface to match data fetched on the server // Define the Employee interface to match data fetched on the server
interface Employee { interface Employee {
@ -11,11 +11,20 @@ interface Employee {
} }
export default function Table({ employees }: { employees: Employee[] }) { export default function Table({ employees }: { employees: Employee[] }) {
const { data: session, status } = useSession();
const [loading, setLoading] = useState(true);
const [selectedIds, setSelectedIds] = useState<number[]>([]); const [selectedIds, setSelectedIds] = useState<number[]>([]);
const [selectAll, setSelectAll] = useState(false); const [selectAll, setSelectAll] = useState(false);
const [status, setStatus] = useState(''); const [employeeStatus, setStatus] = useState('');
const [employeeData, setEmployeeData] = useState(employees); const [employeeData, setEmployeeData] = useState(employees);
useEffect(() => {
if (status !== "loading") {
setLoading(false);
}
}, [status]);
useEffect(() => { useEffect(() => {
// Refresh employee data if needed after state updates // Refresh employee data if needed after state updates
setEmployeeData(employees); setEmployeeData(employees);
@ -85,20 +94,45 @@ export default function Table({ employees }: { employees: Employee[] }) {
}; };
const handleSubmit = async () => { const handleSubmit = async () => {
if (selectedIds.length > 0 && status.trim() !== '') { if (selectedIds.length > 0 && employeeStatus.trim() !== '') {
await fetch('/api/v2/update_status', { await fetch('/api/v2/update_status', {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': `Bearer ${process.env.API_KEY}` 'Authorization': `Bearer ${process.env.API_KEY}`
}, },
body: JSON.stringify({ employeeIds: selectedIds, newStatus: status }), body: JSON.stringify({ employeeIds: selectedIds, newStatus: employeeStatus }),
}); });
// Optionally refresh data on the client-side after update // Optionally refresh data on the client-side after update
const updatedEmployees = await fetchEmployees(); const updatedEmployees = await fetchEmployees();
setEmployeeData(updatedEmployees); setEmployeeData(updatedEmployees);
setSelectedIds([]); setSelectedIds([]);
setStatus(''); setStatus('');
} else {
if (!session) {
alert("You must be signed in to update status.");
} else {
const usersName = session?.user?.name;
const employee = employees.find(employee => employee.name === usersName);
if (employee) {
setSelectedIds([employee.id]);
if (selectedIds.length > 0 && employeeStatus.trim() !== '') {
await fetch('/api/v2/update_status', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer ${process.env.API_KEY}`
},
body: JSON.stringify({ employeeIds: selectedIds, newStatus: employeeStatus }),
});
// Optionally refresh data on the client-side after update
const updatedEmployees = await fetchEmployees();
setEmployeeData(updatedEmployees);
setSelectedIds([]);
setStatus('');
}
}
}
} }
}; };
@ -118,7 +152,7 @@ export default function Table({ employees }: { employees: Employee[] }) {
const month = date.toLocaleString('default', { month: 'long' }); const month = date.toLocaleString('default', { month: 'long' });
return `${time} - ${month} ${day}`; return `${time} - ${month} ${day}`;
}; };
if (loading) return <div>Loading...</div>;
return ( return (
<div> <div>
<table className="techtable rounded-2xl w-5/6 m-auto text-center text-[42px]"> <table className="techtable rounded-2xl w-5/6 m-auto text-center text-[42px]">
@ -161,7 +195,7 @@ export default function Table({ employees }: { employees: Employee[] }) {
type="text" type="text"
placeholder="New Status" placeholder="New Status"
className="min-w-[120px] lg:min-w-[400px] bg-[#F9F6EE] py-2 px-3 border-none rounded-xl text-[#111111] lg:text-2xl" className="min-w-[120px] lg:min-w-[400px] bg-[#F9F6EE] py-2 px-3 border-none rounded-xl text-[#111111] lg:text-2xl"
value={status} value={employeeStatus}
onChange={handleStatusChange} onChange={handleStatusChange}
onKeyDown={handleKeyPress} onKeyDown={handleKeyPress}
/> />

View File

@ -9,12 +9,16 @@ export const getEmployees = async () => {
}); });
}; };
const convertToUTC = (date: Date) => {
return new Date(date.setHours(date.getUTCHours())+ 5);
};
// Function to Update Employee Status using Raw SQL // Function to Update Employee Status using Raw SQL
export const updateEmployeeStatus = async (employeeIds: string[], newStatus: string) => { export const updateEmployeeStatus = async (employeeIds: string[], newStatus: string) => {
try { try {
// Convert array of ids to a format suitable for SQL query (comma-separated string) // Convert array of ids to a format suitable for SQL query (comma-separated string)
const idList = employeeIds.map(id => parseInt(id, 10)); const idList = employeeIds.map(id => parseInt(id, 10));
const updatedAt = new Date(); const updatedAt = convertToUTC(new Date());
// Prepare the query using drizzle-orm's template-like syntax for escaping variables // Prepare the query using drizzle-orm's template-like syntax for escaping variables
const query = sql` const query = sql`