Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 | 72x 7x 1x 19x 19x 57x 57x 57x 19x | import React from "react";
import OurTable from "main/components/OurTable";
import { Link } from "react-router";
import { useBackend } from "main/utils/useBackend";
function MealsOfferedCell({ date, diningHall }) {
const {
data: meals,
error,
status,
} = useBackend(
// Stryker disable next-line all : don't test internal caching of React Query
[`/api/diningcommons/${date}/${diningHall}`],
{
url: `/api/diningcommons/${date}/${diningHall}`,
},
// Stryker disable next-line all : don't test default value of empty list
undefined,
true,
);
// Stryker disable OptionalChaining
if (error?.response?.status === 500) return <span>no meals offered</span>;
if (status === "loading") return <span>Loading...</span>;
if (meals) {
return (
<>
{meals.map((meal, index) => (
<React.Fragment key={meal.code}>
{index > 0 && " "}
<Link to={`/diningcommons/${date}/${diningHall}/${meal.code}`}>
{meal.name}
</Link>
</React.Fragment> // we have two siblings (" " and link) so a fragment is needed to wrap them together
))}
</> // this is also a fragment wrapper, but with no key since we're not inside of a list
); // https://react.dev/reference/react/Fragment#rendering-a-list-of-fragments
}
return <span>An error has occured.</span>;
}
export default function DiningCommonsTable({ commons, date }) {
const testid = "DiningCommonsTable";
const columns = [
{
Header: "Code",
accessor: "code", // accessor is the "key" in the data
Cell: ({ value }) => (
<Link to={`/diningcommons/${date}/${value}`}>{value}</Link>
),
},
{
Header: "Name",
accessor: "name",
},
{
Header: "Meals Offered Today",
accessor: "code",
id: "mealsOfferedToday", // by default the id is the accessor, but since our first column has the same accessor we need a different id here
Cell: ({ value }) => <MealsOfferedCell date={date} diningHall={value} />,
},
{
Header: "Has Dining Cam",
accessor: "hasDiningCam",
// Credits to Jayden for the code here!
// Renders a checkmark box.
Cell: ({ value }) => (value ? "✅" : "❌"),
},
{
Header: "Has Sack Meal",
accessor: "hasSackMeal",
Cell: ({ value }) => (value ? "✅" : "❌"),
},
{
Header: "Has Takeout Meal",
accessor: "hasTakeoutMeal",
Cell: ({ value }) => (value ? "✅" : "❌"),
},
];
const displayedColumns = columns;
return <OurTable data={commons} columns={displayedColumns} testid={testid} />;
}
|