Government Mail System
An Arabic back office for official letters between government bodies: register, route, reply and track every letter.
Blurred on purpose: client work under NDA
Slide 1 of 6
Frontend developer · correspondence and tracking
The Government Mail System replaces paper letters carried between government bodies in Iraq: an Arabic, right-to-left back office where registry staff register, route and answer official letters and follow each one from draft to reply. As a frontend developer at AL Muraba I built its correspondence filters and by-date list, document tracking, tags and the audit log, then led the port of the company’s HR module into it.
- Letters built from scans or templates and numbered by each organisation’s rules
- Routing to organisations and groups, with required, optional or disabled replies
- Subjects as threads, with replies nested under the letter they answer
- Ten filters kept in the URL, two list views and removable filter chips
- Document tracking with the time a letter spent at each step
- Read receipts, field-level change history and a system-wide audit log
- Vue 3
- TypeScript
- Vite
- Vuetify 3
- Vuexy
- Pinia
- vue-i18n
- CASL
- Keycloak
- ABP
- CKEditor 5
- pdf.js
How I built it
- CASL permissions built from ABP granted policies after a Keycloak sign-in, reloaded on every refresh
- Every filter mirrored into the URL and debounced, over infinite-scroll lists paged the ABP way
- .NET time spans and ISO dates turned into readable Arabic durations with dayjs
- An in-browser document pipeline: typed uploads with progress, pdf.js splitting, cropperjs and drag-and-drop pages
- Letter templates and document numbers defined as data, with tokens bound live to the form
- An Arabic-only, right-to-left Vuexy / Vuetify 3 UI with a CSP built from the environment