NC ABC Whiskey Inventory Management Front End

React based website backed by Firebase database to manage the clients and their inventory monitoring settings.

The server side is located at: https://github.com/droneshire/whiskey_inventory_alert_upwork

Useful References

• security rules
• firestore web reference
• mui icons
• fort awesome icons
• react documentation

Dashboard

The dashboard contains several views, one of which is an admin only view:

• Admin - manage all clients' inventory preferences, manage payment status, and monitor the backend health
• Inventory - add inventory to track and manage alert inventory change threshold
• Preferences - manage contact info and alert preferences

Models

Client

export enum ItemAction {
  TRACKING = "TRACKING",
  UNTRACKED = "UNTRACKED",
}

export enum ClientAction {
  NONE = "NONE",
  DELETE = "DELETE",
  ADD = "ADD",
  PAID = "PAID",
  UNPAID = "UNPAID",
}

export interface Inventory {
  items: {
    [id: string]: {
      action: ItemAction;
      name: string;
      available: number;
    };
  };
  inventoryChange: number;
  minHoursSinceOutOfStock: number;
}

export interface AlertTimeZone {
  abbrev: string;
  altName: string;
  label: string;
  offset: number;
  value: string;
}

export interface Preferences {
  updateOnNewData: boolean;
  notifications: {
    sms: {
      phoneNumbers: {
        [id: string]: {
          phoneNumber: string;
        };
      }
      updatesEnabled: boolean;
      alertTimeRange: number[];
      alertTimeZone: AlertTimeZone;
      alertWindowEnabled: boolean;
    };
    email: {
      email: string;
      updatesEnabled: boolean;
    };
  };
}

export interface Accounting {
  plan: string;
  nextBillingDate: string;
  nextBillingAmount: number;
  hasPaid: boolean;
}

export interface ClientConfig {
  inventory: Inventory;
  preferences: Preferences;
  accounting: Accounting;
}

Future Work

• Billing framework, either monthly/yearly or by notification?