Chief Snack Officer

Office snack requests, like never before!

I built this in order to learn (the basics) of how to use Solid.js
And because for work, my job is to order in office snacks, and sending out surveys is boring.

Contents

• About
• Deployment
• Config Options
• Data Structures
• Development
• Contributing
• License

About

A platform for real-time requesting and voting on snacks for the office. So that the fridge is always well stocked with food people actually love.

Features

• View current, upcoming and past snack orders
• Request snacks
• Vote (up/down) on snacks
• View stats, like most loved, hated, controversial snacks
• SSO login, with access restricted by email domain
• Admin portal, where snack inventory can be managed

Screenshots

DEMO_Snack-Champion.mp4

Screenshot

Info

Tech Stack

Built using Solid.js ^[1] on the frontend (along with TS ^[2] and SCSS ^[3]), tested with Jest ^[4], bundled with Vite ^[5]. The data is stored using a Postgress ^[6] DB via Supabase ^[7], with the frontend deployed to Netlify ^[8] and the code hosted on GitHub ^[9] and CI/CD workflows managed with GH Actions^[10].

Standards

Configurable: Set your companies name, branding and terminology

International: No hard-coded copy, for easy language translations

Tested: Fully unit tested with Jest, joined together with E2E

Documented: In-code and MD docs, as well as strict typings for devs

Accessible: Meets AA accessibility standards, so no one is left out

Performant: Reactive, SSR, Caching

Responsive: Mobile-first UI, optimized for a variety of devices

Secure: Data is encrypted

Open Source: All source code and docs are freely available on GitHub

Easy: Super quick and simple to deploy your own instance on a range of architectures

Observable: Easy monitoring, with errors tracked via GlitchTip and basic analytics via Plausible

Automated: New releases are automatically tested and deployed by the CI/CD pipeline

SEO SSR, meta

Compatible: Consistent across all modern browser and devices, with fallback polyfills to support legacy environments

Privacy Respecting: No invasive tracking, and the user can export or delete their data at any time

Neat: Consistent coding standards are implemented with Prettier and ESLint

Future plans

I think it would be pretty fun to extend this, to automate as much of the process as possible. Based on snack ratings and user requests, use AI to generate a varied list of snacks that's within budget. Hook up to Slack to get approval from HR, use a supermarket API to make the order, generate the invoice and submit that to our companies expenses API, insert the arrival time into my calendar with Google API, and then collect employee snack feedback, and iterate for the next week.

That would basically be my whole job, automated.

---

Deployment

To deploy the app, follow the development instructions to get the code + dependencies, then run yarn build to build the production app, and use a web server of your choice to serve up the /dist directory. You'll also need to deploy a Postgres DB, it's recommended to use Supabase. For setup instructions, see the Data section below.

The frontend can also be deployed to a static hosting provider of your choice. You can use the 1-click deploys below for Netlify or Vercel.

Docker image coming soon...

Config Options

Data Structures

Snacks

create table
  public."Snacks" (
    snack_id uuid not null default gen_random_uuid (),
    snack_name character varying not null,
    user_id uuid null,
    created_at timestamp with time zone not null default now(),
    snack_category public.snack_category null,
    snack_meta json null,
    constraint Snacks2_pkey primary key (snack_id),
    constraint Snacks2_snack_name_key unique (snack_name),
    constraint Snacks_user_id_fkey foreign key (user_id) references auth.users (id) on update cascade on delete set null
  ) tablespace pg_default;

Votes

create table
  public."Votes" (
    vote_id bigint generated by default as identity,
    created_at timestamp with time zone not null default now(),
    snack_id uuid null,
    user_id uuid null,
    vote public.vote_type not null,
    constraint Votes_pkey primary key (vote_id),
    constraint Votes_snack_id_fkey foreign key (snack_id) references "Snacks" (snack_id),
    constraint Votes_user_id_fkey foreign key (user_id) references auth.users (id)
  ) tablespace pg_default;

Enums

snack_category: sweet, savory, healthy, drink	
vote_type: up, down

Development

• git clone git@github.com:Lissy93/cso.git && cd cso - Grab the code
• yarn install - Install dependencies
• cp .env.sample .env - Then paste your Supabase URL and anon key
• yarn dev - Start the dev server. Then pop open localhost:5173

You'll also need to create a Supabase project, and run the import script listed in above.

Contributing

Contributions of any kind are very welcome, and would be much appreciated. For Code of Conduct, see Contributor Convent.

To get started, fork the repo, follow the development steps above, add, commit and push the code, then come back here to open a pull request. If you're new to GitHub or open source, I have some guides in Lissy93/git-into-open-source which might help - but feel free to ask if you need any help.

License

Lissy93/CSO is licensed under MIT © Alicia Sykes 2023.
^{For information, see TLDR Legal > MIT}

Expand License

The MIT License (MIT)
Copyright (c) Alicia Sykes <alicia@omg.com> 

Permission is hereby granted, free of charge, to any person obtaining a copy 
of this software and associated documentation files (the "Software"), to deal 
in the Software without restriction, including without limitation the rights 
to use, copy, modify, merge, publish, distribute, sub-license, and/or sell 
copies of the Software, and to permit persons to whom the Software is furnished 
to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included install 
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANT ABILITY, FITNESS FOR A
PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

© Alicia Sykes 2023
Licensed under MIT

^{Thanks for visiting :)}