feat: lighter build by rewriting lodash imports (#1772)

Incorrect lodash imports are causing MFEs to import the entire lodash
library. This change shaves off a few kB of the compressed build.
This commit is contained in:
Régis Behmo
2025-04-16 02:07:16 +02:00
committed by GitHub
parent f531d5471d
commit 4bd2c3b29a
20 changed files with 126 additions and 118 deletions

View File

@@ -20,7 +20,7 @@ import {
Cached, CheckCircle, Launch, Loop,
} from '@openedx/paragon/icons';
import _ from 'lodash';
import sumBy from 'lodash/sumBy';
import { useSearchParams } from 'react-router-dom';
import getPageHeadTitle from '../generic/utils';
import { useModel } from '../generic/model-store';
@@ -109,7 +109,7 @@ export const CourseLibraries: React.FC<Props> = ({ courseId }) => {
);
const [showReviewAlert, setShowReviewAlert] = useState(false);
const { data: libraries, isLoading } = useEntityLinksSummaryByDownstreamContext(courseId);
const outOfSyncCount = useMemo(() => _.sumBy(libraries, (lib) => lib.readyToSyncCount), [libraries]);
const outOfSyncCount = useMemo(() => sumBy(libraries, (lib) => lib.readyToSyncCount), [libraries]);
const {
isLoadingPage: isLoadingStudioHome,
isFailedLoadingPage: isFailedLoadingStudioHome,

View File

@@ -14,7 +14,9 @@ import {
useToggle,
} from '@openedx/paragon';
import _ from 'lodash';
import {
tail, keyBy, orderBy, merge, omitBy,
} from 'lodash';
import { useQueryClient } from '@tanstack/react-query';
import { Loop, Warning } from '@openedx/paragon/icons';
import messages from './messages';
@@ -49,7 +51,7 @@ interface BlockCardProps {
const BlockCard: React.FC<BlockCardProps> = ({ info, actions }) => {
const intl = useIntl();
const componentIcon = getItemIcon(info.blockType);
const breadcrumbs = _.tail(info.breadcrumbs) as Array<{ displayName: string, usageKey: string }>;
const breadcrumbs = tail(info.breadcrumbs) as Array<{ displayName: string, usageKey: string }>;
const getBlockLink = useCallback(() => {
let key = info.usageKey;
@@ -138,11 +140,11 @@ const ComponentReviewList = ({
);
const outOfSyncComponentsByKey = useMemo(
() => _.keyBy(outOfSyncComponents, 'downstreamUsageKey'),
() => keyBy(outOfSyncComponents, 'downstreamUsageKey'),
[outOfSyncComponents],
);
const downstreamInfoByKey = useMemo(
() => _.keyBy(downstreamInfo, 'usageKey'),
() => keyBy(downstreamInfo, 'usageKey'),
[downstreamInfo],
);
const queryClient = useQueryClient();
@@ -241,9 +243,9 @@ const ComponentReviewList = ({
if (isIndexDataLoading) {
return [];
}
let merged = _.merge(downstreamInfoByKey, outOfSyncComponentsByKey);
merged = _.omitBy(merged, (o) => !o.displayName);
const ordered = _.orderBy(Object.values(merged), 'updated', 'desc');
let merged = merge(downstreamInfoByKey, outOfSyncComponentsByKey);
merged = omitBy(merged, (o) => !o.displayName);
const ordered = orderBy(Object.values(merged), 'updated', 'desc');
return ordered;
}, [downstreamInfoByKey, outOfSyncComponentsByKey]);