HAWLHAYE

Work. Organised.

CECIT · Institutional workflow platform

Every task.
Every team.
One clear direction.

HAWLHAYE brings institutional work into one organised workspace. Assign responsibilities, follow progress, manage approvals and build a clearer picture of the work that matters.

Explore the workspace Discover the project

✓ Structured workflows✓ Role-based access✓ Centralised reporting

Workspace overview

HAWLHAYE · Task management

Preview

Unassigned

In progress

In review

Workflow snapshot

Illustrative data

CECIT-2026-001

Prepare departmental work plan

Office coordination

In progress

CECIT-2026-002

Review submitted documentation

Academic administration

In review

CECIT-2026-003

Complete operational checklist

Assigned staff

Completed

One workspace. Clear ownership.HAWLHAYE

About the project

Work management built around accountability.

HAWLHAYE is designed to help teams organise institutional tasks, coordinate responsibilities and follow work from assignment through review and completion.

Its architecture separates the web interface, backend API, shared workflow rules and database. This creates a foundation for consistent permissions, controlled task transitions and maintainable development.

The project objective

Make institutional work easier to assign, follow, review, report and improve—with clear responsibilities at every stage.

What the platform covers

Everything connected to the work.

A modular experience designed around tasks, people, approvals, operational visibility and administration.

↗01

Task management

Create, assign, delegate and track institutional tasks from one organised workspace.

Task lifecycle

▤02

Workflow & approvals

Move tasks through defined stages with controlled transitions and a clear review process.

Six workflow stages

◷03

Reports & insights

Bring task progress, overdue work and office activity into a clearer reporting experience.

Institutional visibility

⌘04

Roles & permissions

Structure access around responsibilities, with permissions enforced by the backend.

Role-based access

◎05

Activity & accountability

Build a traceable history of task updates, decisions, assignments and reviews.

Audit trail

▦06

Administrative tools

Organise offices, users and categories through a unified management experience.

Centralised management

The workflow

From an open task to a clear outcome.

The application board is built from six shared workflow statuses. This overview illustrates the stages; actual transitions are governed by the application's workflow rules and permissions.

Unassigned

Ready for ownership

Assigned

Responsibility established

In progress

Work underway

In review

Submitted for review

Completed

Work finished

Blocked

Needs intervention

A consistent set of workflow rules

Shared definitions live in packages/shared, rather than being duplicated across the frontend and API.

View task board

Under the hood

A modular foundation.

HAWLHAYE separates interface, business logic and persistence into dedicated packages, making it easier for the team to develop and maintain each part.

Web application

apps/web/

Next.js · React · Tailwind CSS

Shared package

packages/shared/

Roles · statuses · workflow · schemas

Backend API

apps/api/

Express · TypeScript · API routes

Database

apps/api/prisma/

Prisma schema and database migrations

Request lifecycle

Browser UI

API client

Express API

Shared rules

Prisma / PostgreSQL

Beginner's guide

Install HAWLHAYE and get started.

Follow these steps to prepare your computer, start the frontend, and open the project in your browser.

Install the tools

Install Node.js (LTS) and Visual Studio Code. Download or clone the HAWLHAYE repository, then open the repository's root folder in VS Code.

Get Node.js

Install dependencies

Open the terminal in VS Code at the repository root (the folder containing the main package.json), then run:

npm ci

Start the frontend

From the same repository root, start the Next.js web application:

npm run dev:web

Then open http://localhost:3000 in your browser.

Check that it is running

Keep the terminal open while developing. Next.js normally refreshes the page after you save changes. Press Ctrl+C in the terminal to stop the development server.

If installation does not work

• Check Node.js and npm with node -v and npm -v.
• Make sure you are running commands from the repository root.
• If the dev command is not recognised, check the scripts in the root package.json.
• If port 3000 is already in use, use the alternative local address printed in the terminal.

Build step by step

Add a page in a few simple steps.

HAWLHAYE uses the Next.js App Router. A folder containing a page.tsx file creates a route. For example, a help page can live inside the existing application route group.

Step 1 — Create the file

In VS Code, create this folder and file under apps/web:

app/
  (app)/
    help/
      page.tsx

The (app) folder is a route group, so it does not appear in the URL. This page's route is /help.

Step 2 — Add a simple page

Put this starter component inside the new page.tsx file:

export default function HelpPage() {
  return (
    <main className="p-8">
      <h1 className="text-3xl font-bold">
        HAWLHAYE Help Center
      </h1>
      <p className="mt-4 text-slate-300">
        Guidance for tasks, reviews, and reports.
      </p>
    </main>
  );
}

Step 3 — Open and test it

Save the file and visit http://localhost:3000/help. If the page is inside app/(app)/, check the existing application layout, authentication rules, and navigation menu. A new page creates the screen and URL; it does not automatically connect the screen to the API or database.

Before you begin

What to expect as you build.

The website interface, API, shared rules, and database are separate parts of the project. A visible page does not necessarily mean every feature behind it is complete.

Frontend pages

Pages and components define what users see. Some routes may still be starter screens or planned files, so check the file status guide below before assuming a screen is complete.

API and database

Saving tasks, signing in, enforcing permissions, and producing live reports require working backend endpoints and database configuration. Installing frontend packages does not set these up automatically.

Build and test gradually

Add one page or feature at a time. Test the route, check the browser and terminal for errors, and verify API and database behavior before relying on the feature.

A useful rule

Keep existing code and styling when adding a feature. Reuse shared components where possible, keep workflow rules in the shared package when appropriate, and enforce important permissions on the backend rather than relying only on hiding frontend buttons.

Developer guide

Know where every frontend file belongs.

A practical map of the web application: pages, reusable components, API helpers and static assets.

Open application

Frontend file reference

Root: apps/web/

Next.js App Router

app/page.tsx

Landing page

Public introduction to HAWLHAYE

Current file

app/layout.tsx

Root layout

Global page structure, metadata and viewport

Existing

app/login/page.tsx

Authentication interface

Scaffold

app/(app)/layout.tsx

Application shell

Navigation and authenticated page layout

Planned

app/(app)/board/page.tsx

Task board

Six workflow columns and task organisation

Existing

app/(app)/my-tasks/page.tsx

My tasks

Tasks relevant to the current user

Planned

app/(app)/review/page.tsx

Review queue

Tasks awaiting review and decisions

Planned

app/(app)/tasks/[code]/page.tsx

Task details

Task history, comments and status actions

Planned

app/(app)/dashboard/page.tsx

Dashboard

Progress summaries and operational indicators

Planned

app/(app)/reports/data/page.tsx

Data reports

Institutional reports, filters and exports

Planned

app/(app)/reports/system/page.tsx

System reports

System reporting and audit information

Planned

app/(app)/admin/users/page.tsx

User administration

Users, roles and invitations

Planned

app/(app)/admin/offices/page.tsx

Office administration

Institutional office management

Planned

app/(app)/help/page.tsx

Help & guidance

Quick-start instructions and frequently asked questions

Planned

components/ui/

Shared UI components

Reusable buttons, chips, modals and tables

Folder to create

components/layout/

Layout components

Navigation, bottom bar and page headers

Folder to create

components/board/

Board components

Task cards, columns and drag-and-drop

Folder to create

components/tasks/

Task components

Task forms, details, comments and history

Folder to create

components/reports/

Reporting components

Charts, filters and export controls

Folder to create

components/admin/

Administration components

User lists and invitation forms

Folder to create

lib/api.ts

API client

Shared helper for communicating with the backend

Existing

public/

Static assets

Application icons, manifest and images

Existing

app/globals.css

Global styles

Tailwind directives and application-wide styles

Existing

File statuses reflect the supplied project guide. Planned entries and folders to create are part of the target structure and should not be interpreted as already implemented files.

Get started

Bring clarity to the work that matters.

Explore the HAWLHAYE workspace and its task-management interface.

Enter HAWLHAYE

Every task.Every team.One clear direction.

Work management built around accountability.

Everything connected to the work.

Task management

Workflow & approvals

Reports & insights

Roles & permissions

Activity & accountability

Administrative tools

From an open task to a clear outcome.

Unassigned

Assigned

In progress

In review

Completed

Blocked

A modular foundation.

Web application

Shared package

Backend API

Database

Install HAWLHAYE and get started.

Install the tools

Install dependencies

Start the frontend

Check that it is running

If installation does not work

Add a page in a few simple steps.

Step 1 — Create the file

Step 2 — Add a simple page

Step 3 — Open and test it

What to expect as you build.

Frontend pages

API and database

Build and test gradually

Know where every frontend file belongs.

Bring clarity to the work that matters.

Every task.
Every team.
One clear direction.