From 35521e044f2a160d1c967b2c3f75637c05beb55c Mon Sep 17 00:00:00 2001 From: Banks Nussman <115251059+bnussman-akamai@users.noreply.github.com> Date: Mon, 12 Feb 2024 12:56:26 -0500 Subject: [PATCH] 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 --- .../pr-10163-tech-stories-1707409590058.md | 5 +++++ packages/manager/package.json | 5 ++--- .../src/components/LineGraph/LineGraph.tsx | 1 - .../BillingActivityPanel.test.tsx | 13 ++++++++---- .../BillingActivityPanel.tsx | 8 +++---- .../Linodes/CloneLanding/utilities.ts | 2 +- .../Managed/Monitors/IssueCalendar.tsx | 12 +++++++---- .../Managed/Monitors/IssueDay.test.tsx | 2 +- .../manager/src/utilities/isRecent.test.ts | 14 ++++++++----- yarn.lock | 21 +++++++------------ 10 files changed, 47 insertions(+), 36 deletions(-) create mode 100644 packages/manager/.changeset/pr-10163-tech-stories-1707409590058.md diff --git a/packages/manager/.changeset/pr-10163-tech-stories-1707409590058.md b/packages/manager/.changeset/pr-10163-tech-stories-1707409590058.md new file mode 100644 index 00000000000..8dade7c29a7 --- /dev/null +++ b/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)) diff --git a/packages/manager/package.json b/packages/manager/package.json index c9f281dafb1..9e890915e19 100644 --- a/packages/manager/package.json +++ b/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", diff --git a/packages/manager/src/components/LineGraph/LineGraph.tsx b/packages/manager/src/components/LineGraph/LineGraph.tsx index b47640b5f97..e28951180a3 100644 --- a/packages/manager/src/components/LineGraph/LineGraph.tsx +++ b/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'; diff --git a/packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.test.tsx b/packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.test.tsx index 2e64b102bf2..8f17374c8b2 100644 --- a/packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.test.tsx +++ b/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', }); diff --git a/packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.tsx b/packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.tsx index bed0151fc80..b25268aed13 100644 --- a/packages/manager/src/features/Billing/BillingPanels/BillingActivityPanel/BillingActivityPanel.tsx +++ b/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', diff --git a/packages/manager/src/features/Linodes/CloneLanding/utilities.ts b/packages/manager/src/features/Linodes/CloneLanding/utilities.ts index af015bfedc3..8d1c5c700d1 100644 --- a/packages/manager/src/features/Linodes/CloneLanding/utilities.ts +++ b/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); diff --git a/packages/manager/src/features/Managed/Monitors/IssueCalendar.tsx b/packages/manager/src/features/Managed/Monitors/IssueCalendar.tsx index 03fb145d657..0ea39a8aed1 100644 --- a/packages/manager/src/features/Managed/Monitors/IssueCalendar.tsx +++ b/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; diff --git a/packages/manager/src/features/Managed/Monitors/IssueDay.test.tsx b/packages/manager/src/features/Managed/Monitors/IssueDay.test.tsx index 0050214b3e4..4d2232326d8 100644 --- a/packages/manager/src/features/Managed/Monitors/IssueDay.test.tsx +++ b/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(); diff --git a/packages/manager/src/utilities/isRecent.test.ts b/packages/manager/src/utilities/isRecent.test.ts index 4b20504c2af..d891ca1cc66 100644 --- a/packages/manager/src/utilities/isRecent.test.ts +++ b/packages/manager/src/utilities/isRecent.test.ts @@ -6,14 +6,18 @@ 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', () => { @@ -21,16 +25,16 @@ describe('isRecent', () => { .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); }); }); diff --git a/yarn.lock b/yarn.lock index 556a67e9095..35cee6d6553 100644 --- a/yarn.lock +++ b/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"