From cd972409b2f0f9f8a97b90e0baf2a67fabb73cb5 Mon Sep 17 00:00:00 2001 From: Carter Date: Mon, 10 Mar 2025 12:51:40 -0600 Subject: [PATCH] bins page now has the add bin button --- src/bin/AddBinFab.tsx | 59 + src/bin/BinSelector.tsx | 154 + src/bin/BinSettings.tsx | 2366 + .../BinCables/BinCableImporter.tsx | 67 + .../BinCables/bin_cable_data_with_count.json | 131243 +++++++++++++++ .../DataImports/BinCables/bracketData.json | 17 + src/common/OutlinedBox.tsx | 47 + src/common/TrigFunctions.tsx | 47 + src/pages/Bins.tsx | 12 +- src/pbHelpers/Bin.ts | 203 + src/providers/index.ts | 2 +- src/providers/pond/binYardAPI.tsx | 113 + src/providers/pond/pond.tsx | 6 +- tsconfig.app.json | 1 + tsconfig.json | 1 + 15 files changed, 134331 insertions(+), 7 deletions(-) create mode 100644 src/bin/AddBinFab.tsx create mode 100644 src/bin/BinSelector.tsx create mode 100644 src/bin/BinSettings.tsx create mode 100644 src/common/DataImports/BinCables/BinCableImporter.tsx create mode 100644 src/common/DataImports/BinCables/bin_cable_data_with_count.json create mode 100644 src/common/DataImports/BinCables/bracketData.json create mode 100644 src/common/OutlinedBox.tsx create mode 100644 src/common/TrigFunctions.tsx create mode 100644 src/pbHelpers/Bin.ts create mode 100644 src/providers/pond/binYardAPI.tsx diff --git a/src/bin/AddBinFab.tsx b/src/bin/AddBinFab.tsx new file mode 100644 index 0000000..387bc20 --- /dev/null +++ b/src/bin/AddBinFab.tsx @@ -0,0 +1,59 @@ +import { Fab, Theme } from "@mui/material"; +import { makeStyles } from "@mui/styles"; +import AddBinIcon from "assets/products/bindapt/addBin.png"; +import { ImgIcon } from "common/ImgIcon"; +import { useMobile } from "hooks"; + +interface Props { + onClick: () => void; + pulse: boolean; +} + +const useStyles = makeStyles((theme: Theme) => { + const yellow = "#ffea00"; + return ({ + "@keyframes pulsate": { + to: { + boxShadow: "0 0 0 16px" + yellow + "00" + } + }, + fab: { + background: yellow, + "&:hover": { + background: yellow + }, + "&:focus": { + background: yellow + }, + position: "fixed", + bottom: theme.spacing(8), //for mobile navigator + right: theme.spacing(2), + [theme.breakpoints.up("sm")]: { + bottom: theme.spacing(2) + } + }, + pulse: { + boxShadow: "0 0 0 0 " + yellow + "75", + animation: "$pulsate 1.75s infinite cubic-bezier(0.66, 0.33, 0, 1)" + } + }); +}); + +export default function AddBinFab(props: Props) { + const { onClick, pulse } = props; + const classes = useStyles(); + const isMobile = useMobile(); + + const pulseString = pulse ? classes.pulse : ""; + const classString = classes.fab + " " + pulseString; + + return ( + + + + ); +} diff --git a/src/bin/BinSelector.tsx b/src/bin/BinSelector.tsx new file mode 100644 index 0000000..3f330f7 --- /dev/null +++ b/src/bin/BinSelector.tsx @@ -0,0 +1,154 @@ +import { Grid2 as Grid, TextField } from "@mui/material"; +import { ImportBins, jsonBin } from "common/DataImports/BinCables/BinCableImporter"; +import SearchSelect, { Option } from "common/SearchSelect"; +import { useMobile } from "hooks"; +import { pond } from "protobuf-ts/pond"; +import React, { useEffect, useState } from "react"; +import { getDistanceUnit } from "utils"; + +interface Props { + optionsChanged: (binOptions: jsonBin[]) => void; + vertical?: boolean; +} + +export default function BinSelector(props: Props) { + const { optionsChanged, vertical } = props; + const isMobile = useMobile(); + const [manufacturerOptions, SetManufacturerOptions] = useState([]); + const [manufacturer, SetManufacturer] = useState