linode · harsh-akamai · Jan 28, 2025 · Jan 13, 2025 · Jan 13, 2025 · Jan 13, 2025
@@ -42,7 +42,9 @@ export const createLinodeInterface = (
 ) =>
   Request<LinodeInterface>(
     setURL(
-      `${BETA_API_ROOT}/linode/instances/${encodeURIComponent(linodeId)}/interfaces`
+      `${BETA_API_ROOT}/linode/instances/${encodeURIComponent(
+        linodeId
+      )}/interfaces`
     ),
     setMethod('POST'),
     setData(data, CreateLinodeInterfaceSchema)
@@ -58,7 +60,9 @@ export const createLinodeInterface = (
 export const getLinodeInterfaces = (linodeId: number) =>
   Request<LinodeInterfaces>(
     setURL(
-      `${BETA_API_ROOT}/linode/instances/${encodeURIComponent(linodeId)}/interfaces`
+      `${BETA_API_ROOT}/linode/instances/${encodeURIComponent(
+        linodeId
+      )}/interfaces`
     ),
     setMethod('GET')
   );

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Tech Stories
+---
+
+Replace ramda's `pathOr` with custom utility  ([#11512](https://github.com/linode/manager/pull/11512))
@@ -51,7 +51,7 @@ describe('resize linode', () => {
 
       cy.wait('@linodeResize');
       cy.contains(
-        "Your linode will be warm resized and will automatically attempt to power off and restore to its previous state."
+        'Your linode will be warm resized and will automatically attempt to power off and restore to its previous state.'
       ).should('be.visible');
     });
   });

@@ -17,7 +17,11 @@ const deployNodeBalancer = () => {
   cy.get('[data-qa-deploy-nodebalancer]').click();
 };
 
-import { linodeFactory, nodeBalancerFactory, regionFactory } from 'src/factories';
+import {
+  linodeFactory,
+  nodeBalancerFactory,
+  regionFactory,
+} from 'src/factories';
 import { interceptCreateNodeBalancer } from 'support/intercepts/nodebalancers';
 import { mockGetRegions } from 'support/intercepts/regions';
 import { mockGetLinodes } from 'support/intercepts/linodes';
@@ -122,52 +126,48 @@ describe('create NodeBalancer', () => {
 
     mockGetRegions([region]);
     mockGetLinodes([linode]);
-    interceptCreateNodeBalancer().as('createNodeBalancer')
+    interceptCreateNodeBalancer().as('createNodeBalancer');
 
     cy.visitWithLogin('/nodebalancers/create');
 
     cy.findByLabelText('NodeBalancer Label')
       .should('be.visible')
       .type('my-nodebalancer-1');
 
-    ui.autocomplete.findByLabel('Region')
-      .should('be.visible')
-      .click();
+    ui.autocomplete.findByLabel('Region').should('be.visible').click();
 
-    ui.autocompletePopper.findByTitle(region.id, { exact: false })
+    ui.autocompletePopper
+      .findByTitle(region.id, { exact: false })
       .should('be.visible')
       .should('be.enabled')
       .click();
 
-    cy.findByLabelText('Label')
-      .type("my-node-1");
+    cy.findByLabelText('Label').type('my-node-1');
 
-    cy.findByLabelText('IP Address')
-      .click()
-      .type(linode.ipv4[0]);
+    cy.findByLabelText('IP Address').click().type(linode.ipv4[0]);
 
-    ui.autocompletePopper.findByTitle(linode.label)
-      .click();
+    ui.autocompletePopper.findByTitle(linode.label).click();
 
-    ui.button.findByTitle('Create NodeBalancer')
+    ui.button
+      .findByTitle('Create NodeBalancer')
       .scrollIntoView()
       .should('be.enabled')
       .should('be.visible')
       .click();
 
-    const expectedError = 'Address Restricted: IP must not be within 192.168.0.0/17';
+    const expectedError =
+      'Address Restricted: IP must not be within 192.168.0.0/17';
 
     cy.wait('@createNodeBalancer')
       .its('response.body')
       .should('deep.equal', {
         errors: [
           { field: 'region', reason: 'region is not valid' },
-          { field: 'configs[0].nodes[0].address', reason: expectedError }
+          { field: 'configs[0].nodes[0].address', reason: expectedError },
         ],
       });
 
-    cy.findByText(expectedError)
-      .should('be.visible');
+    cy.findByText(expectedError).should('be.visible');
   });
 
   /*

@@ -1,5 +1,5 @@
 import { DateTime } from 'luxon';
-import { equals, pathOr, sort } from 'ramda';
+import { equals, sort } from 'ramda';
 import * as React from 'react';
 import { useHistory, useLocation } from 'react-router-dom';
 import { debounce } from 'throttle-debounce';
@@ -9,6 +9,7 @@ import {
   useMutatePreferences,
   usePreferences,
 } from 'src/queries/profile/preferences';
+import { pathOr } from 'src/utilities/pathOr';
 import { getQueryParamsFromQueryString } from 'src/utilities/queryParams';
 import {
   sortByArrayLength,
@@ -138,8 +139,16 @@ export const sortData = <T,>(orderBy: string, order: Order) => {
     }
 
     /** basically, if orderByProp exists, do a pathOr with that instead */
-    const aValue = pathOr('', !!orderByProp ? orderByProp : [orderBy], a);
-    const bValue = pathOr('', !!orderByProp ? orderByProp : [orderBy], b);
+    const aValue = pathOr<any, T>(
+      '',
+      !!orderByProp ? orderByProp : [orderBy],
+      a
+    );
+    const bValue = pathOr<any, T>(
+      '',
+      !!orderByProp ? orderByProp : [orderBy],
+      b
+    );
 
     if (Array.isArray(aValue) && Array.isArray(bValue)) {
       return sortByArrayLength(aValue, bValue, order);

@@ -1,13 +1,14 @@
-import { path, pathOr } from 'ramda';
+import { path } from 'ramda';
 import { connect } from 'react-redux';
 
-import {
+import { getClientStats } from 'src/store/longviewStats/longviewStats.requests';
+
+import type {
   LongviewNotification,
   LongviewResponse,
 } from 'src/features/Longview/request.types';
-import { ApplicationState } from 'src/store';
-import { getClientStats } from 'src/store/longviewStats/longviewStats.requests';
-import { ThunkDispatch } from 'src/store/types';
+import type { ApplicationState } from 'src/store';
+import type { ThunkDispatch } from 'src/store/types';
 
 export interface LVClientData {
   longviewClientData: LongviewResponse['DATA'];
@@ -63,9 +64,9 @@ const connected = <OwnProps extends {}>(
       const foundClient = longviewStats[supplyClientID(ownProps)];
 
       return {
-        longviewClientData: pathOr({}, ['data'], foundClient),
+        longviewClientData: foundClient?.data ?? {},
         longviewClientDataError: path(['error'], foundClient),
-        longviewClientDataLoading: pathOr(true, ['loading'], foundClient),
+        longviewClientDataLoading: foundClient?.loading ?? true,
         longviewClientLastUpdated: path(['lastUpdated'], foundClient),
       };
     },

@@ -1,5 +1,4 @@
 import autoTable from 'jspdf-autotable';
-import { pathOr } from 'ramda';
 
 import { ADDRESSES } from 'src/constants';
 import { formatDate } from 'src/utilities/formatDate';
@@ -392,11 +391,9 @@ const formatDescription = (desc?: string) => {
 
   if (isVolume) {
     const [volLabel, volID] = descChunks[1].split(' ');
-    return `${descChunks[0]}\r\n${truncateLabel(volLabel)} ${pathOr(
-      '',
-      [2],
-      descChunks
-    )}\r\n${volID}`;
+    return `${descChunks[0]}\r\n${truncateLabel(volLabel)} ${
+      descChunks?.[2] ?? ''
+    }\r\n${volID}`;
   }
 
   if (isBackup) {

@@ -4,16 +4,7 @@ import {
 } from '@linode/api-v4/lib/domains';
 import { Autocomplete, Notice, TextField } from '@linode/ui';
 import produce from 'immer';
-import {
-  cond,
-  defaultTo,
-  equals,
-  lensPath,
-  path,
-  pathOr,
-  pick,
-  set,
-} from 'ramda';
+import { cond, defaultTo, equals, lensPath, path, pick, set } from 'ramda';
 import * as React from 'react';
 
 import { ActionsPanel } from 'src/components/ActionsPanel/ActionsPanel';
@@ -592,7 +583,7 @@ export class DomainRecordDrawer extends React.Component<
      * This should be done on the API side, but several breaking
      * configurations will currently succeed on their end.
      */
-    const _domain = pathOr('', ['name'], data);
+    const _domain = data?.name ?? '';
     const invalidCNAME =
       data.type === 'CNAME' && !isValidCNAME(_domain, records);
 

@@ -1,6 +1,5 @@
 import { Autocomplete, InputAdornment, Notice } from '@linode/ui';
 import Search from '@mui/icons-material/Search';
-import { pathOr } from 'ramda';
 import * as React from 'react';
 import { withRouter } from 'react-router-dom';
 import { debounce } from 'throttle-debounce';
@@ -66,7 +65,8 @@ const AlgoliaSearchBar = (props: AlgoliaSearchBarProps) => {
       return;
     }
 
-    const href = pathOr('', ['data', 'href'], selected);
+    const href =
+      selected?.data && 'href' in selected.data ? selected.data.href : '';
     if (href) {
       // If an href exists for the selected option, redirect directly to that link.
       window.open(href, '_blank', 'noopener');

@@ -1,5 +1,5 @@
+/* eslint-disable react-refresh/only-export-components */
 import Algolia from 'algoliasearch';
-import { pathOr } from 'ramda';
 import * as React from 'react';
 
 import {
@@ -118,23 +118,7 @@ export default (options: SearchOptions) => (
 ) => {
   const { highlight, hitsPerPage } = options;
   class WrappedComponent extends React.PureComponent<{}, AlgoliaState> {
-    componentDidMount() {
-      this.mounted = true;
-      this.initializeSearchIndices();
-    }
-    componentWillUnmount() {
-      this.mounted = false;
-    }
-
-    render() {
-      return React.createElement(Component, {
-        ...this.props,
-        ...this.state,
-      });
-    }
-
     client: SearchClient;
-
     initializeSearchIndices = () => {
       try {
         const client = Algolia(ALGOLIA_APPLICATION_ID, ALGOLIA_SEARCH_KEY);
@@ -210,8 +194,14 @@ export default (options: SearchOptions) => (
       }
 
       /* If err is undefined, the shape of content is guaranteed, but better to be safe: */
-      const docs = pathOr([], ['results', 0, 'hits'], content);
-      const community = pathOr([], ['results', 1, 'hits'], content);
+      const docs: SearchHit[] =
+        (Array.isArray(content.results) &&
+          (content.results?.[0] as { hits: SearchHit[] })?.hits) ||
+        [];
+      const community: SearchHit[] =
+        (Array.isArray(content.results) &&
+          (content.results?.[1] as { hits: SearchHit[] })?.hits) ||
+        [];
       const docsResults = convertDocsToItems(highlight, docs);
       const commResults = convertCommunityToItems(highlight, community);
       this.setState({
@@ -226,6 +216,22 @@ export default (options: SearchOptions) => (
       searchError: undefined,
       searchResults: [[], []],
     };
+
+    componentDidMount() {
+      this.mounted = true;
+      this.initializeSearchIndices();
+    }
+
+    componentWillUnmount() {
+      this.mounted = false;
+    }
+
+    render() {
+      return React.createElement(Component, {
+        ...this.props,
+        ...this.state,
+      });
+    }
   }
 
   return WrappedComponent;

@@ -3,7 +3,7 @@ import { Box, Notice, Paper, Typography } from '@linode/ui';
 import { useTheme } from '@mui/material/styles';
 import Grid from '@mui/material/Unstable_Grid2';
 import { castDraft } from 'immer';
-import { intersection, pathOr } from 'ramda';
+import { intersection } from 'ramda';
 import * as React from 'react';
 import {
   matchPath,
@@ -343,11 +343,7 @@ export const CloneLanding = () => {
                   // This disk has been individually selected ...
                   state.diskSelection[disk.id].isSelected && // ... AND it's associated configs are NOT selected
                   intersection(
-                    pathOr(
-                      [],
-                      [disk.id, 'associatedConfigIds'],
-                      state.diskSelection
-                    ),
+                    state.diskSelection?.[disk.id]?.associatedConfigIds ?? [],
                     selectedConfigIds
                   ).length === 0
                 );

@@ -1,6 +1,6 @@
 import { Checkbox } from '@linode/ui';
 import Grid from '@mui/material/Unstable_Grid2';
-import { intersection, pathOr } from 'ramda';
+import { intersection } from 'ramda';
 import * as React from 'react';
 
 import Paginate from 'src/components/Paginate';
@@ -59,11 +59,7 @@ export const Disks = (props: DisksProps) => {
                           // Is there anything in common between this disk's
                           // associatedConfigIds and the selectedConfigsIds?
                           intersection(
-                            pathOr(
-                              [],
-                              [disk.id, 'associatedConfigIds'],
-                              diskSelection
-                            ),
+                            diskSelection?.[disk.id]?.associatedConfigIds ?? [],
                             selectedConfigIds
                           ).length > 0;