Fix import errors

Author: hotinglok

src/app/components-webcore/SportDataHeader/head-to-head-v2/components/action-grid.tsx

@@ -1,12 +1,12 @@
 import type { ReactNode } from 'react';
-import styles, { GRID_AREAS } from '../index.styles';
-
-export { GRID_AREAS };
+import styles from '../index.styles';
 
 interface ActionGridProps {
   children: ReactNode;
 }
 
-export const ActionGrid = ({ children }: ActionGridProps) => (
+const ActionGrid = ({ children }: ActionGridProps) => (
   <div css={styles.actionGrid}>{children}</div>
 );
+
+export default ActionGrid;

src/app/components-webcore/SportDataHeader/head-to-head-v2/components/grouped-events.tsx

@@ -1,4 +1,4 @@
-import { ActionGrid } from './action-grid';
+import ActionGrid from './action-grid';
 import VisuallyHiddenText from '../../../../components/VisuallyHiddenText';
 import styles from '../index.styles';
 import type { GroupedActions as GroupedActionsType } from '../types';

src/app/components-webcore/SportDataHeader/head-to-head-v2/components/index.ts

@@ -1,7 +1,7 @@
 // TypeScript component re-exports
 // This ensures TypeScript imports resolve to .tsx files
 
-export { ActionGrid, GRID_AREAS } from './action-grid';
+export { default as ActionGrid } from './action-grid';
 export { default as Action } from './action';
 export { default as ActionsTime } from './actions-time';
 export { Actions } from './actions';
@@ -10,7 +10,7 @@ export { default as Centre, shouldShowScores } from './centre';
 export { default as ConditionalOnwardJourneyLink } from './conditional-onward-journey-link';
 export { default as FixtureTime } from './fixture-time';
 export { default as Footer } from './footer';
-export { GroupedEvents } from './grouped-events';
+export { default as GroupedEvents } from './grouped-events';
 export { HeadToHeadBanner } from './head-to-head-banner';
 export { default as HeadToHeadHeader } from './head-to-head-header';
 export { KeyEvents } from './key-events';