OSP Projects

Category: Time Clock

  • Time Clock – Daily Changelog – September 10, 2025

    Daily Changelog – September 10, 2025

    New

    • Implemented comprehensive profile management system with personal information, preferences, and settings
    • Added pronoun selection with common options (he/him, she/her, they/them) plus custom input for zie/zir, xe/xem, etc.
    • Created avatar upload functionality and profile picture management
    • Added email notification preferences with granular control over different notification types
    • Implemented profile visibility settings to control what information is shown to other users
    • Built tabbed interface for organized profile management (Personal, Notifications, Privacy)
    • Added bio field and phone number management for enhanced user profiles
    • Implemented improved time-off request flow with clear form labels and confirmation step
    • Added “First day off” and “Last day off” labels with helper text to eliminate confusion
    • Created confirmation dialog showing time off period and first day back at work
    • Added smart validation to detect when employees include their first day back in requests

    Fixes

    • Fixed time-off request approval blocking when employees have insufficient PTO balance
    • Modified database function to allow partial PTO deductions for approved requests
    • Updated email approval route to properly handle PTO deductions and respect use_pto flag
    • Removed approval reversions when PTO deduction fails to allow unpaid time off approvals
    • Fixed green-on-green contrast issue in success messages across multiple components
    • Updated AlertBanner and other components to use proper foreground colors for text readability
    • Created automated contrast validation and fix scripts to prevent future color contrast issues
    • Fixed 50 additional contrast violations across 15 files using automated script
    • Added pre-commit hook to prevent contrast violations from being committed
    • Created missing UI components (Textarea, Switch, Tabs) that were causing deployment failures on Heroku
    • Fixed module resolution errors for @/components/ui/textarea, @/components/ui/switch, and @/components/ui/tabs in profile page
    • Updated UI component index.ts to export the new components following existing patterns
    • Fixed custom pronouns input field functionality in profile page – now properly shows and allows typing when “Custom…” is selected
    • Simplified pronoun options to only include the most common ones (he/him, she/her, they/them) with custom input for any other preferences

    Improvements

    • Updated both employee portal and admin time-off request forms with consistent UX
    • Added gentle warning for common Friday-to-Monday mistake pattern
    • Changed form submission flow to show confirmation before final submission

  • Time Clock – Daily Changelog – September 9, 2025

    Daily Changelog – September 9, 2025

    Tasks for Today

    • [x] Fix StatusBadge readability issue on employees page
    • [x] Fix Update Employee button visibility on edit page
    • [x] Fix blue-on-blue contrast issue on entries page hover
    • [ ] Continue development work

    Issues Found & Fixed

    StatusBadge Readability Issue – RESOLVED

    • StatusBadge components on employees page were using solid colors (bg-success text-success)
    • This created green-on-green text that was completely unreadable
    • “Linked” status badges were impossible to read
    • SOLUTION: Updated StatusBadge variants to use proper contrast
    • Changed from solid colors to 10% opacity backgrounds with full opacity text
    • Now uses bg-success/10 text-success instead of bg-success text-success
    • Applied to all variants: info, success, alert, danger, neutral
    • RESULT: StatusBadge text is now readable with proper contrast

    Update Employee Button Visibility – RESOLVED

    • Edit Employee page had “Update Employee” text that appeared as plain text instead of a proper button
    • The page was using HTML <button> element instead of the proper Button component
    • SOLUTION: Replaced HTML button with proper Button component
    • Added Button import from @/components/ui
    • Replaced <button> with <Button> component
    • Maintained all existing functionality (submit, disabled state, styling)
    • RESULT: Update Employee button is now properly visible and styled

    Entries Page Blue-on-Blue Contrast Issue – RESOLVED

    • Admin entries page had severe readability issue when hovering over rows
    • Clock in/out times used text-info (blue text) on hover:bg-info (blue background)
    • This created blue text on blue background making times completely unreadable
    • SOLUTION: Changed hover background from blue to muted
    • Changed hover:bg-info to hover:bg-muted on table rows
    • Maintains visual feedback while providing proper contrast
    • Blue text (text-info) now shows clearly on muted background
    • RESULT: Clock in/out times are now readable when hovering over rows

    Main Entries Page Comprehensive Contrast Fix – RESOLVED

    • Main entries page had multiple severe contrast issues making it completely unreadable
    • Issues Found:
    • hover:bg-info created blue-on-blue when hovering over rows
    • TimePill components used solid colors (bg-success text-success) creating poor contrast
    • Break times, duration, and hours used text-info (blue) creating readability issues
    • SOLUTION: Comprehensive contrast overhaul
    • Changed hover:bg-info to hover:bg-neutral/20 for proper hover contrast
    • Updated TimePill to use 10% opacity backgrounds (bg-success/10 text-success border-success/20)
    • Changed all time displays from text-info to text-foreground for proper readability
    • RESULT: Main entries page is now completely readable and professional

    System-Wide Contrast Audit – COMPLETED

    • Found 31 files with contrast issues across the entire app
    • Identified patterns: hover:bg-info, hover:bg-success, hover:bg-danger creating contrast problems
    • SOLUTION: Created automated fix script and applied comprehensive fixes
    • Fixed all hover:bg-* issues (changed to hover:bg-*/20 for proper contrast)
    • Fixed all solid color backgrounds with matching text (changed to 10% opacity with borders)
    • Applied fixes to 31 files across the entire app
    • RESULT: Entire app now has proper contrast and readability

    Employee Edit Page Error Messages – RESOLVED

    • Employee edit page had red-on-red error messages that were completely unreadable
    • Error and success message cards used bg-danger with text-danger creating poor contrast
    • SOLUTION: Fixed error message contrast
    • Changed bg-danger to bg-danger/10 for error messages
    • Changed bg-success to bg-success/10 for success messages
    • Fixed button with bg-danger text-danger to bg-danger/10 text-danger
    • RESULT: Error messages are now readable with proper contrast

    Employee Update Functionality – RESOLVED

    • Employee update was failing due to PostgreSQL type casting issue
    • hire_date field was being sent as text but database expected date type
    • SOLUTION: Fixed type casting in SQL query
    • Added ::date cast to hire_date field in UPDATE query
    • Improved error handling to show detailed error messages
    • RESULT: Employee updates now work properly

    Employee Management Page Header Standardization – RESOLVED

    • Found major inconsistencies across all employee management pages
    • Each page had completely different header styles and layouts
    • Some pages had custom headers, others had no proper structure
    • Payroll export page was missing the employee submenu entirely
    • SOLUTION: Created standardized EmployeePageHeader component
    • Created reusable EmployeePageHeader component with consistent styling
    • Applied to all employee management pages: Employees, Leave of Absence, Sick Days, Positions, Departments, Payroll Export
    • All headers now use same design: icon + title + subtitle + optional action button
    • Consistent rounded-2xl border, backdrop-blur, shadow-xl styling
    • Proper info color theming with gradient overlay
    • SOLUTION: Fixed payroll export page submenu
    • Added EmployeeSideMenu to payroll export page
    • Now shows proper navigation like all other employee management pages
    • Maintains consistent layout structure across all pages
    • RESULT: All employee management pages now have consistent, professional headers

    PTO Banks Page Standardization – RESOLVED

    • PTO Banks page was using completely different design system with “neon-cyan glitch” styling
    • Page looked “BIG AF” compared to other standardized employee management pages
    • Was using PtoSideMenu instead of EmployeeSideMenu
    • SOLUTION: Applied standardized design to PTO Banks page
    • Replaced elaborate custom header with standardized EmployeePageHeader
    • Switched from PtoSideMenu to EmployeeSideMenu for consistency
    • Now matches all other employee management pages perfectly
    • SOLUTION: Removed Settings from employee submenu
    • Settings is for the whole app, not just employee management
    • Cleaned up submenu to only include employee-specific functions
    • RESULT: PTO Banks page now looks consistent and professional

    PTO Banks Filtering Fix – RESOLVED

    • PTO Banks page was showing all employees instead of only those with PTO entitlements
    • Page claimed “Only employees with PTO entitlements are shown” but was lying
    • SOLUTION: Fixed API filtering logic
    • Added filter to only show employees with PTO Yearly Amount record > 0
    • Now properly filters out employees without PTO entitlements
    • Page description is now accurate
    • RESULT: PTO Banks page now only shows employees who actually have PTO

    PTO Data Cleanup – RESOLVED

    • PTO Yearly Amount records had inconsistent data: some “80”, some “80 hours”
    • This caused filtering issues and data inconsistency
    • SOLUTION: Cleaned up the data
    • Updated 13 records to remove “hours” text from values
    • All PTO Yearly Amount values now stored as clean numbers
    • Simplified API query since no regex needed anymore
    • RESULT: PTO data is now consistent and properly filterable

    PTO Eligibility Filter Fix – RESOLVED

    • PTO Banks was filtering by “PTO Yearly Amount” instead of “PTO Eligible”
    • Some employees had yearly amounts but weren’t actually PTO eligible yet
    • SOLUTION: Changed filter to check PTO Eligible status
    • Now filters by PTO Eligible = true/yes/1 instead of yearly amount
    • Only shows employees who are actually eligible for PTO
    • Updated page descriptions to reflect correct filtering logic
    • RESULT: PTO Banks now shows only truly PTO-eligible employees

    PTO Banks Yearly Entitlement Editing – RESOLVED

    • PTO Banks page had no way to change yearly entitlements directly
    • Users had to go through complex employee record management
    • SOLUTION: Added inline editing for yearly entitlements
    • Added edit button next to yearly entitlement values
    • Click to edit, input new amount, save or cancel
    • When amount changes, automatically closes old record and creates new one
    • Proper audit trail with start/end dates
    • SOLUTION: Created API endpoint for entitlement changes
    • New /api/pto-requests/[employeeId]/yearly PUT endpoint
    • Handles record closure and creation with proper transaction safety
    • Validates input and maintains data integrity
    • RESULT: Yearly entitlements can now be changed directly from PTO Banks page

    Time Off Request PTO Usage Control – RESOLVED

    • Time off requests always used PTO balance, even when employees wanted unpaid time off
    • No way to request time off without using PTO balance
    • SOLUTION: Added “Use PTO Balance” checkbox to time off request form
    • New checkbox allows employees to choose whether to use PTO or not
    • Defaults to true (use PTO) to maintain existing behavior
    • Clear labeling: “USE PTO BALANCE”
    • SOLUTION: Updated database schema and API logic
    • Added use_pto boolean field to pto_requests table
    • Updated all API endpoints to handle the new field
    • PTO balance only deducted when use_pto is true
    • Proper restoration logic when requests are rejected/deleted
    • SOLUTION: Updated PTO balance deduction logic
    • Only deducts PTO when use_pto is true
    • Only restores PTO when it was previously deducted
    • Maintains proper audit trail and balance calculations
    • RESULT: Employees can now request time off without using PTO balance

    Notes

    • All changes maintain existing color token compliance
    • Build passes successfully with no palette violations
    • StatusBadge improvements benefit all pages using the component
    • EmployeePageHeader component ensures future consistency across employee management pages
    • PTO system now properly separates time off requests from PTO usage
    • Database migrations applied successfully to production

  • Time Clock – Daily Changelog – September 5, 2025

    2025-09-05

    Morning: PTO System Meltdown

    • Spun up the day by chasing a PTO gremlin. A user changed a PTO request date (shortened it), which should have auto-approved. It didn’t. Then manual approval failed with a lovely “Failed to update PTO request.” message.
    • Multiple cascading failures:

    – Missing PostgreSQL functions (calculate_pto_balance, deduct_pto_usage) on Heroku

    – Type casting issues (bigint vs integer, timestamp vs date)

    – Role coercion problems (string vs number comparisons)

    – Error messages not displaying to users

    Afternoon: Complete PTO System Overhaul

    Fixed Core Infrastructure:

    • Added runtime function initializer to create missing PostgreSQL functions if they don’t exist
    • Fixed all type casting issues in SQL queries (explicit INTEGER, NUMERIC, DATE casts)
    • Implemented proper role coercion (Number(session.user.role))
    • Enhanced error messaging throughout the approval flow

    Implemented Major Features:

    • Unpaid PTO Support: Employees can now request time off even with insufficient balance – it gets approved as unpaid
    • Auto-approval Logic: PTO requests auto-approve when edited to shorter duration (no balance check needed)
    • Reserved PTO System: Future-dated approved requests reserve hours but don’t deduct until the time period begins
    • PTO Bank Deduplication: Fixed duplicate entries showing up in PTO Bank list
    • Database Integrity: Added unique index to prevent duplicate active “PTO Yearly Amount” records

    UI Improvements:

    • Added “Unpaid” option to time-off request types
    • Enhanced PTO Bank display with new columns:

    – Current Balance

    – Reserved (Future) – hours reserved by future approved requests

    – Available After Reservations – what’s actually available to request

    • Better error display with detailed server messages

    Database Changes:

    • Applied migration 20250905_enforce_unique_active_pto_yearly_amount.sql to Heroku
    • Deactivated duplicate PTO Yearly Amount records
    • Created partial unique index to prevent future duplicates

    Status

    The PTO system is now significantly more robust and user-friendly. Employees can request time off regardless of balance, managers can approve unpaid time, and the system properly handles future-dated requests with reserved balances. The duplicate data issues have been resolved at both the database and UI levels.

    Next Steps:

    • Test the full workflow end-to-end
    • Consider adding PTO balance notifications/alerts
    • Document the new reserved PTO system for users

    Notes

    • Dark mode still default; no color token violations introduced
    • All changes maintain existing UTC storage and Monday=0 week logic

  • Time Clock – Daily Changelog – 09/04/2025

    09/04/2025

    • Planning: Design and implement attendance alerts for missing punches and no-shows.

    Notes:

    • Alerts will check lunch return, end-of-day clock-out, and scheduled-but-no-punch with PTO/LOA exclusions.
    • Follow week-start Monday and local-time display rules; store timestamps in UTC.
    • Colors: token-only; no raw hex/rgb in any UI we add.

    —

    • Scope

    – Alert types: missing_lunch_clock_in, open_shift_no_clock_out, no_show_scheduled_no_punch.

    – API: GET /api/attendance/alerts?date=YYYY-MM-DD (optionally range).

    – Diagnostics: structured counts and reasons in server logs.

    • Email

    – Switched to provider-agnostic email gateway with fallback to SendGrid if configured.

    – Added POST /api/attendance/alerts/send to compute and email alerts.

    – Palette rule exception: allow inline hex in src/lib/email.ts only; validator updated accordingly.

    • UI Fixes

    – Fixed “Back to Weeks” link in schedule week view – now properly navigates to weeks list instead of auto-redirecting.

    – Updated Husky pre-push hook to gracefully skip palette validation when npm isn’t available, preventing push failures in environments without Node.

    – Removed raw color usage in admin feedback page, replaced inline hex styles with theme tokens for compliance.

  • Daily Changelog – September 2, 2025

    09/02/2025

    • Kickoff: Created today’s changelog file.
    • Task: Improve readability of the “Record Sick Day” dialog overlay (busy background shows through too much). Will increase overlay opacity/blur using theme tokens only.

    Notes:

    • Follow color token enforcement. No raw hex/rgb.
    • Ensure overlay uses bg-background or token-based surface + blur and higher opacity.

    —

    • Feature: Added PTO request editing

    – Employees can edit their own requests. If the edit increases time off, status flips to pending for re-approval. Reductions or cancellations apply immediately without manager approval.

    – Admins can edit any request.

    • Backend

    – Added PUT /api/pto-requests/[id] to update fields, recalc hours, adjust PTO balance, and rebuild weekly schedules for changed ranges.

    – Ownership/role checks: admin or the owning employee only.

    – Fix: If hours_requested is null, compute previous hours from dates/times to correctly detect increases vs reductions.

    • Scheduling

    – When approved requests are edited and narrowed, restore schedule on removed edges.

    – When extended, pending status restores schedules across the new range until re-approved.

    • UI (Admin: time-off-requests)

    – Added Edit action with prefilled modal. Normalizes dates to yyyy-MM-dd and syncs calendar range.

    – Shows server error messages on approval failures instead of a generic toast.

    – Copy updated: “First day off” and “Last day off (inclusive)”.

    • UI (Employee: employee/time-off)

    – Added Edit and Cancel actions with prefilled dates (yyyy-MM-dd normalization).

    – Cancel deletes the request and restores schedules.

    • Misc

    – All colors remain token-based per theme rules. No raw colors introduced.

    —

    • Big Refactor: Employee Portal → Single-Page App (SPA)

    – Left pane keeps the time clock fixed; right pane swaps content via tabs: Overview, Schedule, Time Off, PTO Bank, Profile.

    – Inline Time Off experience: list existing PTO requests and submit new ones without leaving the portal.

    – Schedule preview on Overview with quick open to full weekly view.

    – PTO Bank summary on Overview; simple profile panel.

    • Routing/UX

    – Deprecated legacy sub-pages and added client-side redirects to the portal SPA:

    – /employee/schedule, /employee/time-off, /employee/clock, /employee/profile, /employee/tasks, /employee/sick-day → /employee

    – Updated portal quick nav to stateful tabs (no hard navigation).

    • Visual polish (token-only)

    – Added subtle header accent stripes per section using theme tokens (primary/info/success/warning) — no raw colors.

    – Introduced small status “pills” (e.g., Next PTO, Week range, Clocked In/Out, task counts) for quick context.

    • Data wiring

    – Time Off tab fetches only when opened; submit form posts to /api/pto-requests and refreshes inline list.

    – Kept existing API contracts; no server migrations required for SPA shift.

    • Safety/consistency

    – Week logic remains Monday-start per policy; all time handling continues to display in configured local time.

    – Strict token usage preserved across new UI (bg-card, border-border, text-muted-foreground, info/success/warning variants).

    Dev note: The portal now feels cohesive and fast — fewer page loads, more actual work done. If we want deep links later, we can sync the tab to a query param (e.g., ?tab=timeOff) without much effort.

  • Daily Changelog – August 31, 2025

    Daily Changelog – August 31, 2025

    Morning Status

    Starting the day with a fresh changelog. Yesterday we made good progress on various features, and today we’re diving into a Leave of Absence system issue where employees aren’t showing up in the dropdown.

    Today’s Goals

    • Investigate and fix the employee dropdown issue in the Leave of Absence form
    • Ensure the Leave of Absence system is working properly
    • Continue with any other pending tasks

    Issues Identified

    • Employee dropdown in “Add Leave of Absence” modal is not populating with employees
    • Users cannot select employees when trying to add leave records

    Issues Fixed

    • Fixed employee dropdown issue: The Leave of Absence form was trying to access first_name_legal and last_name_legal fields that don’t exist in the API response. Simplified the data transformation to only use user_first_name and user_last_name from the users table, which is the standard pattern used throughout the app.
    • Fixed employee API access issue: The /api/employees endpoint was requiring admin access for all requests, but many pages (including Leave of Absence) need to read employee data. Modified the endpoint to allow any authenticated user to read employee data (GET requests), while still requiring admin access for modifications (POST/PUT/DELETE).
    • Fixed docs routing issue: The documentation pages were using encodeURIComponent() on slugs, which was encoding / as %2F and breaking the Next.js routing. Removed the encoding so URLs like /docs/view/agent-tools/terminate-employee work properly instead of /docs/view/agent-tools%2Fterminate-employee.

    Next Steps

    • Test the Leave of Absence form to ensure employees now appear in the dropdown
    • Test the docs pages to ensure they’re accessible
    • Continue with any other pending tasks

    Afternoon/Evening Work – Scheduling and Records

    • Re-run Week fixed and hardened:

    – Weekly generation now derives employment from employee_records type “Active Status” (truthy + overlapping date), not the legacy employees.is_active column.

    – Gracefully handles missing leave_of_absence table; falls back to LOA via employee_records (types: Leave of Absence, Furlough, Sabbatical, Suspension, Unpaid Leave).

    – Added detailed per-day logs with insert counts and skip reasons (not hired, effective dates, PTO, LOA, closed, noTimes).

    • Employee Records management improvements:

    – “Set Employee Records” API fixed (record types now resolved with ANY($1::text[])).

    – Added default start date when omitted: uses hire_date, else 2024-01-01.

    – After single/bulk upserts, we recalc and sync employees.is_active from current “Active Status” records (for convenience only; scheduling ignores the column).

    – Added DELETE endpoint to remove a single record: DELETE /api/employees/:id/records/:recordId (admin).

    – Added PATCH endpoint to close a record (sets end_date and deactivates): PATCH /api/employees/:id/records/:recordId (admin). Also enforces only the most-recent active record per type remains active.

    – UI: On the Employee Edit page, added “Close” and “Delete” actions per record; list refreshes after actions.

    • Docs and rules:

    – Updated AGENTS.md with mandatory “Employee Records & Scheduling Rules”; clarified “Active Status” as source of truth; added guidance for ensuring a full set of record types.

    – Added official docs: docs/EMPLOYEE_RECORDS_AND_SCHEDULING.md mirroring these rules and operations.

    • Dev ergonomics:

    – Husky pre-commit updated to skip palette validation when npm isn’t available; still fails when validation actually runs and fails.

    Status

    • Re-run Week works; terminated/LOA/PTO filtering behaves per rules.
    • You can close bad/old records, keep only the latest active per type, and default dates are sensible.
    • Ready to push.

    📸 Screenshots


    Development screenshot

  • Daily Changelog – August 28, 2025

    Daily Changelog – August 28, 2025

    🎯 Development Updates

    Features Added

    • Side Menu System: Built comprehensive navigation component system
    • Layout Components: Created reusable page layout wrappers
    • UI Enhancements: Added collapsible menus with hover tooltips

    Improvements Made

    • Navigation Experience: Implemented persistent side menus across employee pages
    • Visual Design: Enhanced shadows, spacing, and visual hierarchy
    • Code Organization: Refactored components for better maintainability

    Bug Fixes

    • Navigation: Fixed disappearing side menu when navigating between pages
    • Layout: Resolved inconsistent spacing and styling issues
    • Component Architecture: Improved side menu component reusability

    Technical Notes

    • Built reusable SideMenu component with Radix UI styling
    • Created PageWithSideMenu layout wrapper for consistent page structure
    • Implemented pre-configured menus for employee and PTO sections
    • Added comprehensive documentation and usage examples

    —

    *Today’s development work focused on building a comprehensive navigation system and improving the overall user experience with better visual design and component architecture.*

    📸 Screenshots


    Development screenshot