Add outdated logic

api/converters.py

@@ -540,6 +540,7 @@ def feature_entry_to_json_basic(fe: FeatureEntry,
     },
     'created': {'by': fe.creator_email, 'when': _date_to_str(fe.created)},
     'updated': {'by': fe.updater_email, 'when': _date_to_str(fe.updated)},
+    'accurate_as_of': _date_to_str(fe.accurate_as_of),
     'standards': {
       'spec': fe.spec_link,
       'maturity': {

api/converters_test.py

@@ -121,6 +121,7 @@ def test_feature_entry_to_json_basic__normal(self):
         'by': '[email protected]',
         'when': expected_date
       },
+      'accurate_as_of': expected_date,
       'standards': {
         'spec': 'https://example.com/spec',
         'maturity': {
@@ -206,6 +207,7 @@ def test_feature_entry_to_json_basic__feature_release(self):
         'by': '[email protected]',
         'when': expected_date
       },
+      'accurate_as_of': expected_date,
       'standards': {
         'spec': 'https://example.com/spec',
         'maturity': {

client-src/elements/chromedash-roadmap-milestone-card.ts

@@ -37,6 +37,8 @@ class ChromedashRoadmapMilestoneCard extends LitElement {
   showDates = false;
   @property({type: Boolean})
   signedIn = false;
+  @property({attribute: false})
+  stableMilestone!: number;
 
   /**
    *  Returns the number of days between a and b.
@@ -234,6 +236,34 @@ class ChromedashRoadmapMilestoneCard extends LitElement {
     `;
   }
 
+  // A feature is outdated if it is scheduled to ship in the next 2 milestones,
+  // and its accurate_as_of date is at least 4 weeks ago.
+  _isFeatureOutdated(accurateAsOf) {
+    if (this.stableMilestone === 0) {
+      return false;
+    }
+    // If this feature is not shipping within two upcoming milestones, return false.
+    if (
+      !(
+        this.stableMilestone + 1 === this.channel?.version ||
+        this.stableMilestone + 2 === this.channel?.version
+      )
+    ) {
+      return false;
+    }
+    if (!accurateAsOf) {
+      return true;
+    }
+    const accuateDate = Date.parse(accurateAsOf);
+    // 4-week period.
+    const gracePeriod = 4 * 7 * 24 * 60 * 60 * 1000;
+    if (accuateDate + gracePeriod < Date.now()) {
+      return true;
+    }
+
+    return false;
+  }
+
   _cardFeatureItemTemplate(f, shippingType) {
     return html`
       <li
@@ -249,6 +279,17 @@ class ChromedashRoadmapMilestoneCard extends LitElement {
           ${f.name}
         </a>
         <span class="icon_row">
+          ${this._isFeatureOutdated(f.accurate_as_of)
+            ? html`
+                <span class="tooltip" title="Feature Outdated">
+                  <iron-icon
+                    icon="chromestatus:warning"
+                    class="deprecated"
+                    data-tooltip
+                  ></iron-icon>
+                </span>
+              `
+            : nothing}
           ${ORIGIN_TRIAL.includes(shippingType)
             ? html`
                 <span class="tooltip" title="Origin Trial">

client-src/elements/chromedash-roadmap.ts

@@ -335,6 +335,7 @@ export class ChromedashRoadmap extends LitElement {
             .starredFeatures=${this.starredFeatures}
             .highlightFeature=${this.highlightFeature}
             ?signedin=${this.signedIn}
+            .stableMilestone=${this.channels?.['stable'].mstone}
             @star-toggle-event=${this.handleStarToggle}
             @highlight-feature-event=${this.handleHighlightEvent}
           >