From 992c7a3a6a35be5e496cb5936853714f59c562ac Mon Sep 17 00:00:00 2001 From: Developer Date: Wed, 11 Mar 2026 14:13:25 +0800 Subject: [PATCH] docs: fix chunk 3 plan issues (unused import, step ordering, styles.row) --- docs/superpowers/plans/2026-03-11-big-video-card.md | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/docs/superpowers/plans/2026-03-11-big-video-card.md b/docs/superpowers/plans/2026-03-11-big-video-card.md index 205f4c1..75da8f4 100644 --- a/docs/superpowers/plans/2026-03-11-big-video-card.md +++ b/docs/superpowers/plans/2026-03-11-big-video-card.md @@ -356,7 +356,13 @@ const onViewableItemsChangedRef = useRef( ).current; ``` -- [ ] **Step 4: Replace `renderItem` with a row-aware version** +- [ ] **Step 4: Replace `renderItem` with a row-aware version and remove stale import** + +After replacing `renderItem`, `VideoItem` is no longer directly referenced in `app/index.tsx`. Remove the now-unused import: +```ts +// Remove this line: +import type { VideoItem } from "../services/types"; +``` Replace the existing `renderItem` function: ```ts @@ -403,6 +409,8 @@ row: { flexDirection: 'row', paddingHorizontal: 1, justifyContent: "flex-start" - [ ] **Step 6: Update the FlatList props** +**Important:** Apply Step 4 (new `renderItem`) before or simultaneously with this step. Removing `numColumns` while the old `renderItem` (which relies on `numColumns` to pair items via `index % 2`) is still in place will break layout mid-edit. + In the `Animated.FlatList`, make these changes: 1. Change `data={videos}` → `data={rows}`