Skip to content

Commit

Permalink
feat(Block): Add key prop to force child component re-renders (#1238)
Browse files Browse the repository at this point in the history
- Add 'key' property to BlockState interface
- Implement key increment in updateState function
- Ensure child components re-render on state changes

This change addresses an issue where child components weren't
re-rendering properly when the state was updated multiple times
with similar data.
  • Loading branch information
drikusroor authored Aug 27, 2024
1 parent b18afdc commit 307fc51
Showing 1 changed file with 6 additions and 1 deletion.
7 changes: 6 additions & 1 deletion frontend/src/components/Block/Block.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,9 @@ import Social from "@/types/Social";
type BlockView = PlaybackView | "TRIAL_VIEW" | "EXPLAINER" | "SCORE" | "FINAL" | "PLAYLIST" | "LOADING" | "CONSENT" | "INFO" | "REDIRECT";

interface BlockState {
// Unique key to force re-render
key: number;

view: BlockView;
title?: string;
url?: string;
Expand Down Expand Up @@ -122,7 +125,9 @@ const Block = () => {
const updateState = useCallback((state: BlockState) => {
if (!state) return;

setState({ ...state });
const key = state.key ? state.key + 1 : 1;

setState({ ...state, key });
}, []);

const updateActions = useCallback((currentActions) => {
Expand Down

0 comments on commit 307fc51

Please sign in to comment.