enhance(bcd): add "removed" support type

mdn · Oct 30, 2024 · d9df733 · d9df733
1 parent 2560d79
commit d9df733
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 7 deletions.
diff --git a/client/src/document/ingredients/browser-compatibility-table/feature-row.tsx b/client/src/document/ingredients/browser-compatibility-table/feature-row.tsx
@@ -35,19 +35,22 @@ export function getCurrentSupportType(
 function getSupportType(
   support: SimpleSupportStatementExtended,
   browser: BCD.BrowserStatement
-) {
+): SupportType {
   let { flags, version_added, version_removed, partial_implementation } =
     support;
 
-  let className;
+  let className: SupportType;
   if (version_added === null) {
     className = "unknown";
   } else if (versionIsPreview(version_added, browser)) {
     className = "preview";
   } else if (version_added) {
-    className = "yes";
-    if (version_removed || (flags && flags.length)) {
+    if (version_removed) {
+      className = "removed";
+    } else if (flags && flags.length) {
       className = "no";
+    } else {
+      className = "yes";
     }
   } else {
     className = "no";
@@ -59,6 +62,14 @@ function getSupportType(
   return className;
 }
 
+function getSupportClassName(supportType: SupportType): string {
+  if (supportType === "removed") {
+    return "no";
+  }
+
+  return supportType;
+}
+
 function getSupportBrowserReleaseDate(
   support: SupportStatementExtended | undefined
 ): string | undefined {
@@ -193,6 +204,7 @@ const CellText = React.memo(
   }) => {
     const browserReleaseDate = getSupportBrowserReleaseDate(support);
     const supportType = getCurrentSupportType(support, browser);
+    const supportClassName = getSupportClassName(supportType);
     const status = getCurrentStatus(support, supportType, browser);
 
     let label: string | React.ReactNode;
@@ -219,6 +231,7 @@ const CellText = React.memo(
         break;
 
       case "no":
+      case "removed":
         title = "No support";
         label = status.label || "No";
         break;
@@ -244,9 +257,9 @@ const CellText = React.memo(
           <span className="icon-wrap">
             <abbr
               className={`
-              bc-level-${supportType}
+              bc-level-${supportClassName}
               icon
-              icon-${supportType}`}
+              icon-${supportClassName}`}
               title={title}
             >
               <span className="bc-support-level">{title}</span>
@@ -508,7 +521,8 @@ function CompatCell({
   onToggle: () => void;
   locale: string;
 }) {
-  const supportClassName = getCurrentSupportType(support, browserInfo);
+  const supportType = getCurrentSupportType(support, browserInfo);
+  const supportClassName = getSupportClassName(supportType);
   // NOTE: 1-5-21, I've forced hasNotes to return true, in order to
   // make the details view open all the time.
   // Whenever the support statement is complex (array with more than one entry)

diff --git a/client/src/document/ingredients/browser-compatibility-table/utils.ts b/client/src/document/ingredients/browser-compatibility-table/utils.ts
@@ -17,6 +17,7 @@ export type SupportType =
   | "yes"
   | "partial"
   | "preview"
+  | "removed"
   | "removed-partial"
   | "unknown";