AR Restaurant Order Dashboard

The Brief Overview

An project extension to the AR restaurant menu connecting the orders sent through that app to an order's management platform. The primary view is made for the kitchen to view incoming orders and to check them off once finished. Being an engineer I need to add in analytics that is updated in real time to provide a snapshot of the business key metrics.

The Features

• Order stream from user menu web app
• Management orders for kitchen usage
• Add, edit, update and delete orders
• Analytics showing revenue, favourite dishes, et al
• Checkout system

The Tech

The dashboard is built with Sapper (SSR) and Hasura postgres database with graphql. The dashboard is also connected to Sanity CMS. It may have been a better idea to also have the menu items as part of the postgres DB but I just didn't want to design/build another few pages for menu items CRUD.

Tailwind CSS was used since I preferred a utility class approach to styling which also makes it more readable for styling in the HTML code.

Chart.js was used for all analytics and charting on the home page. It started to become a pain to do type checking with working with charts since I was using plain javascript. I should have opted for typescript.

The Challenges

Trying out some new tech such as graphql Hasura and building auth from scratch using JWT caused a bit of grief but managed to get over it. There are errors such as NaN which I have not fixed due to time limitations but yes I do know there's bugs.

Demo Link

The site is live here https://ar-menu-dashboard.herokuapp.com/

If you wish to test it out, you will need to contact me due to account needed to login.