refactor: [M3-7749] - Update luxon to latest (#10163)

* update luxon and fix breaking changes

* update luxon and fix breaking changes

* remove `chartjs-adapter-luxon`

* Added changeset: Update Luxon

* use exact versions

---------

Co-authored-by: Banks Nussman <banks@nussman.us>

packages/manager/.changeset/pr-10163-tech-stories-1707409590058.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Tech Stories
+---
+
+Update Luxon ([#10163](https://github.com/linode/manager/pull/10163))

packages/manager/package.json

@@ -27,7 +27,6 @@
     "axios": "~1.6.5",
     "braintree-web": "^3.92.2",
     "chart.js": "~2.9.4",
-    "chartjs-adapter-luxon": "^0.2.1",
     "copy-to-clipboard": "^3.0.8",
     "country-region-data": "^1.4.5",
     "flag-icons": "^6.6.5",
@@ -43,7 +42,7 @@
     "libphonenumber-js": "^1.10.6",
     "lodash": "^4.17.21",
     "logic-query-parser": "^0.0.5",
-    "luxon": "^3.2.1",
+    "luxon": "3.4.4",
     "markdown-it": "^12.3.2",
     "md5": "^2.2.1",
     "notistack": "^2.0.5",
@@ -134,7 +133,7 @@
     "@types/jest-axe": "^3.5.7",
     "@types/jsdom": "^21.1.4",
     "@types/jspdf": "^1.3.3",
-    "@types/luxon": "^3.2.0",
+    "@types/luxon": "3.4.2",
     "@types/markdown-it": "^10.0.2",
     "@types/md5": "^2.1.32",
     "@types/mocha": "^10.0.2",

packages/manager/src/components/LineGraph/LineGraph.tsx

@@ -8,7 +8,6 @@ import {
   ChartTooltipItem,
   ChartXAxe,
 } from 'chart.js';
-import 'chartjs-adapter-luxon';
 import { curry } from 'ramda';
 import * as React from 'react';
 

packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.test.tsx

@@ -168,6 +168,11 @@ describe('paymentToActivityFeedItem', () => {
         { zone: 'utc' }
       );
       const testDateISO = testDate.toISO();
+
+      if (!testDateISO) {
+        throw new Error('Invalid test date');
+      }
+
       expect(getCutoffFromDateRange('30 Days', testDateISO)).toBe(
         testDate.minus({ days: 30 }).toISO()
       );
@@ -183,21 +188,21 @@ describe('paymentToActivityFeedItem', () => {
       expect(getCutoffFromDateRange('12 Months', testDateISO)).toBe(
         testDate.minus({ months: 12 }).toISO()
       );
-      expect(getCutoffFromDateRange('All Time', testDateISO)).toBeUndefined();
+      expect(getCutoffFromDateRange('All Time', testDateISO)).toBeNull();
     });
   });
 
   describe('makeFilter', () => {
     const endDate = '2020-01-01T00:00:00';
     it('always includes conditions to order by date desc', () => {
-      expect(makeFilter()).toHaveProperty('+order_by', 'date');
-      expect(makeFilter()).toHaveProperty('+order', 'desc');
+      expect(makeFilter(null)).toHaveProperty('+order_by', 'date');
+      expect(makeFilter(null)).toHaveProperty('+order', 'desc');
       expect(makeFilter(endDate)).toHaveProperty('+order_by', 'date');
       expect(makeFilter(endDate)).toHaveProperty('+order', 'desc');
     });
 
     it('includes a date filter only if given an endDate', () => {
-      expect(makeFilter()).not.toHaveProperty('date');
+      expect(makeFilter(null)).not.toHaveProperty('date');
       expect(makeFilter(endDate)).toHaveProperty('date', {
         '+gte': '2020-01-01T00:00:00',
       });

packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.tsx

@@ -40,12 +40,12 @@ import {
   useAllAccountPayments,
 } from 'src/queries/accountBilling';
 import { useProfile } from 'src/queries/profile';
+import { useRegionsQuery } from 'src/queries/regions';
 import { parseAPIDate } from 'src/utilities/date';
 import { formatDate } from 'src/utilities/formatDate';
 import { getAll } from 'src/utilities/getAll';
 
 import { getTaxID } from '../../billingUtils';
-import { useRegionsQuery } from 'src/queries/regions';
 
 const useStyles = makeStyles()((theme: Theme) => ({
   activeSince: {
@@ -595,9 +595,9 @@ export const paymentToActivityFeedItem = (
 export const getCutoffFromDateRange = (
   range: DateRange,
   currentDatetime?: string
-): string | undefined => {
+): null | string => {
   if (range === 'All Time') {
-    return undefined;
+    return null;
   }
 
   const date = currentDatetime ? parseAPIDate(currentDatetime) : DateTime.utc();
@@ -629,7 +629,7 @@ export const getCutoffFromDateRange = (
 /**
  * @param endDate in ISO format
  */
-export const makeFilter = (endDate?: string): any => {
+export const makeFilter = (endDate: null | string) => {
   const filter: any = {
     '+order': 'desc',
     '+order_by': 'date',

packages/manager/src/features/Linodes/CloneLanding/utilities.ts

@@ -304,7 +304,7 @@ export const getEstimatedCloneTime = (
     minutes: estimatedTimeInMinutes,
     seconds: estimatedTimeInMinutes > 0 ? 1 : 0, // in case less than 1 min
   });
-  let humanizedEstimate = then.toRelative(now.toObject());
+  let humanizedEstimate = then.toRelative({ base: now });
   const prefixHumanized = 'in ';
   if (humanizedEstimate?.startsWith(prefixHumanized)) {
     humanizedEstimate = humanizedEstimate?.substring(prefixHumanized.length);

packages/manager/src/features/Managed/Monitors/IssueCalendar.tsx

@@ -51,10 +51,14 @@ export const generateCalendar = (timezone: string, issues: ManagedIssue[]) => {
       createdOnTargetDay(timezone, thisIssue, day)
     );
 
-    days.push({
-      day: day.toISO(),
-      issues: relevantIssues,
-    });
+    const isoDate = day.toISO();
+
+    if (isoDate) {
+      days.push({
+        day: isoDate,
+        issues: relevantIssues,
+      });
+    }
   }
 
   return days;

packages/manager/src/features/Managed/Monitors/IssueDay.test.tsx

@@ -9,7 +9,7 @@ describe('IssueDay', () => {
   it('should include basic Monitor actions', () => {
     const date = DateTime.fromISO('2020-10-01');
     const props: IssueDayProps = {
-      day: date.toISO(),
+      day: date.toISO()!,
       issues: [],
     };
     const { getByText } = renderWithTheme(<IssueDay {...props} />);

packages/manager/src/utilities/isRecent.test.ts

@@ -6,31 +6,35 @@ describe('isRecent', () => {
   const baseDate = DateTime.fromObject({ day: 1, month: 1, year: 2019 });
   const m = baseDate.toISO();
 
+  if (!m) {
+    throw new Error('Invalid test date');
+  }
+
   it('should return false if time is in the future', () => {
     const t = baseDate.plus({ minutes: 1 }).toISO();
-    expect(isRecent(t, m)).toBe(false);
+    expect(isRecent(t!, m)).toBe(false);
   });
 
   it('should return true if 1 min in the past', () => {
     const t1 = DateTime.fromISO(m).minus({ minutes: 1 }).toISO();
-    expect(isRecent(t1, m)).toBe(true);
+    expect(isRecent(t1!, m)).toBe(true);
   });
 
   it('should return true if time 23:59:58 in the past', () => {
     const t2 = DateTime.fromISO(m)
       .minus({ hours: 23, minutes: 59, seconds: 58 })
       .toISO();
 
-    expect(isRecent(t2, m)).toBe(true);
+    expect(isRecent(t2!, m)).toBe(true);
   });
 
   it('should return false if time is 1 day in the past', () => {
     const t1 = baseDate.minus({ days: 1 }).toISO();
-    expect(isRecent(t1, m)).toBe(false);
+    expect(isRecent(t1!, m)).toBe(false);
   });
 
   it('should return false if 24:01 in the past', () => {
     const t2 = baseDate.minus({ hours: 24, seconds: 1 }).toISO();
-    expect(isRecent(t2, m)).toBe(false);
+    expect(isRecent(t2!, m)).toBe(false);
   });
 });

yarn.lock

@@ -4659,10 +4659,10 @@
   resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.191.tgz#09511e7f7cba275acd8b419ddac8da9a6a79e2fa"
   integrity sha512-BdZ5BCCvho3EIXw6wUCXHe7rS53AIDPLE+JzwgT+OsJk53oBfbSmZZ7CX4VaRoN78N+TJpFi9QPlfIVNmJYWxQ==
 
-"@types/luxon@^3.2.0":
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/@types/luxon/-/luxon-3.2.0.tgz#99901b4ab29a5fdffc88fff59b3b47fbfbe0557b"
-  integrity sha512-lGmaGFoaXHuOLXFvuju2bfvZRqxAqkHPx9Y9IQdQABrinJJshJwfNCKV+u7rR3kJbiqfTF/NhOkcxxAFrObyaA==
+"@types/luxon@3.4.2":
+  version "3.4.2"
+  resolved "https://registry.yarnpkg.com/@types/luxon/-/luxon-3.4.2.tgz#e4fc7214a420173cea47739c33cdf10874694db7"
+  integrity sha512-TifLZlFudklWlMBfhubvgqTXRzLDI5pCbGa4P8a3wPyUQSW+1xQ5eDsreP9DWHX3tjq1ke96uYG/nwundroWcA==
 
 "@types/markdown-it@^10.0.2":
   version "10.0.3"
@@ -6387,11 +6387,6 @@ chart.js@~2.9.4:
     chartjs-color "^2.1.0"
     moment "^2.10.2"
 
-chartjs-adapter-luxon@^0.2.1:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/chartjs-adapter-luxon/-/chartjs-adapter-luxon-0.2.2.tgz#09c9a99a819802d51c28fd4cfc545c26fab61bec"
-  integrity sha512-LIZnrTj4FewFWnuyqbkdU8JjsZc0KrstFOIcNwDDpnMlVofCOkV9w4WMaa8A9fgpTsFMmqKAroFYa8NN5uCKWQ==
-
 chartjs-color-string@^0.6.0:
   version "0.6.0"
   resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
@@ -10500,10 +10495,10 @@ lru-cache@^7.5.1:
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-10.0.0.tgz#b9e2a6a72a129d81ab317202d93c7691df727e61"
   integrity sha512-svTf/fzsKHffP42sujkO/Rjs37BCIsQVRCeNYIm9WN8rgT7ffoUnRtZCqU+6BqcSBdv8gwJeTz8knJpgACeQMw==
 
-luxon@^3.2.1:
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/luxon/-/luxon-3.2.1.tgz#14f1af209188ad61212578ea7e3d518d18cee45f"
-  integrity sha512-QrwPArQCNLAKGO/C+ZIilgIuDnEnKx5QYODdDtbFaxzsbZcc/a7WFq7MhsVYgRlwawLtvOUESTlfJ+hc/USqPg==
+luxon@3.4.4:
+  version "3.4.4"
+  resolved "https://registry.yarnpkg.com/luxon/-/luxon-3.4.4.tgz#cf20dc27dc532ba41a169c43fdcc0063601577af"
+  integrity sha512-zobTr7akeGHnv7eBOXcRgMeCP6+uyYsczwmeRCauvpvaAltgNyTbLH/+VaEAPUeWBT+1GuNmz4wC/6jtQzbbVA==
 
 lz-string@^1.4.4:
   version "1.4.4"