Bugfix: radio buttons, new badges, sort

app/components/cards/drink.card.tsx

@@ -17,7 +17,6 @@ function toDate(value: Date | string | null | undefined): Date | null {
 }
 
 function DrinkCard(arg:Arguments) {
-  var trimmedDescription = arg.drink.description.length > 120 ? arg.drink.description.substring(0, 120) + "..." : arg.drink.description;
   var link = "/inventory/";
 
   switch (arg.drink.type) {
@@ -61,10 +60,7 @@ function DrinkCard(arg:Arguments) {
   }
 
   const drinkAddedAt = toDate((arg.drink as { addedAt?: Date | string | null }).addedAt ?? null);
-  const latestTimestamp = drinkAddedAt && (!latestActivity || drinkAddedAt.getTime() > latestActivity.getTime())
-    ? drinkAddedAt
-    : latestActivity;
-  const isNewlyAdded = latestTimestamp ? (Date.now() - latestTimestamp.getTime()) <= 30 * 24 * 60 * 60 * 1000 : false;
+  const isNewlyAdded = drinkAddedAt ? (Date.now() - drinkAddedAt.getTime()) <= 30 * 24 * 60 * 60 * 1000 : false;
   const isRecentlyRestocked = latestActivity ? (Date.now() - latestActivity.getTime()) <= 14 * 24 * 60 * 60 * 1000 : false;
 
   return (
@@ -72,11 +68,11 @@ function DrinkCard(arg:Arguments) {
       <div style={{ position: 'relative', width: '100%', aspectRatio: '1 / 1', overflow: 'hidden' }}>
         { (isNewlyAdded || isRecentlyRestocked) ? (
           <Badge
-            bg={isRecentlyRestocked ? "success" : "primary"}
+            bg={isNewlyAdded ? "primary" : "success"}
             className='position-absolute top-0 start-0 m-2 text-wrap'
             style={{ zIndex: 2 }}
           >
-            {isNewlyAdded && isRecentlyRestocked ? "New · Restocked" : isNewlyAdded ? "New" : "Recently added"}
+            {isNewlyAdded ? "New" : (isRecentlyRestocked ? "Restocked" : "")}
           </Badge>
         ) : null }
         <Card.Img

app/components/filters/drink.filter.tsx

@@ -76,7 +76,7 @@ function DrinkFilter(arg : Arguments) {
     />
   ));
 
-  const sortKey = arg.searchParams.get("sort") || "name";
+  const sortKey = arg.searchParams.get("sort") || "new";
 
   return (
     <Form noValidate method="GET" ref={form} className='pe-2' onChange={handleFormChange}>
@@ -85,8 +85,8 @@ function DrinkFilter(arg : Arguments) {
             <Form.Group controlId="sort" className='bg-body-secondary rounded p-3'>
                 <Form.Label className='fw-bold'>Sort</Form.Label>
                 { [
-                  ["name", "Name"],
                   ["new", "New"],
+                  ["name", "Name"],
                   ["popular", "Popularity"],
                   ["abv-asc", "Alcohol (Low -> High)"],
                   ["abv-desc", "Alcohol (High -> Low)"],
@@ -213,6 +213,7 @@ function DrinkFilter(arg : Arguments) {
                 <Form.Check
                   type="radio"
                   label="Both"
+                  id="carbonated-both"
                   name="carbonated"
                   value={0}
                   defaultChecked={(arg.searchParams.get("carbonated") == "0" || !arg.searchParams.has("carbonated")) ? true : false}
@@ -220,6 +221,7 @@ function DrinkFilter(arg : Arguments) {
                 <Form.Check
                   type="radio"
                   label="Sparkling"
+                  id="carbonated-sparkling"
                   name="carbonated"
                   value={1}
                   defaultChecked={arg.searchParams.get("carbonated") == "1" ? true : false}
@@ -227,6 +229,7 @@ function DrinkFilter(arg : Arguments) {
                 <Form.Check
                   type="radio"
                   label="Non-sparkling"
+                  id="carbonated-flat"
                   name="carbonated"
                   value={2}
                   defaultChecked={arg.searchParams.get("carbonated") == "2" ? true : false}

app/models/drinks.sort.server.ts

@@ -97,7 +97,11 @@ function sortNewest(n1:DrinkComposite, n2:DrinkComposite) : number{
 
 export function sortDrinksFromSearch(searchParams: URLSearchParams, searchResult: DrinkComposite[]) : DrinkComposite[] {
     
-    var callback = sortName;
+    var callback = sortNewest;
+
+    if(searchParams.has("sort", "new")){
+        callback = sortNewest;
+    }
 
     if(searchParams.has("sort", "name")){
         callback = sortName;
@@ -123,10 +127,6 @@ export function sortDrinksFromSearch(searchParams: URLSearchParams, searchResult
         callback = sortPopularity;
     }
 
-    if(searchParams.has("sort", "new")){
-        callback = sortNewest;
-    }
-
     var sortedArray: DrinkComposite[] = searchResult.sort(callback);
 
     return sortedArray;

app/routes/inventory/route.tsx

@@ -78,11 +78,7 @@ export default function BeersRoute() {
       return;
     }
 
-    if (key === "sort" && value === "name") {
-      return;
-    }
-
-    if ((key === "min-abv" && value === "0") || (key === "max-abv" && value === "50") || (key === "min-ibu" && value === "0") || (key === "max-ibu" && value === "150")) {
+    if (key === "sort" && value === "new") {
       return;
     }