can't find variable name when its inside an if statement

after running a graphql query, I extract some values from the result into an object and use it in my flat list.

const DATA = data.users.nodes[0].userRelations.map(      (item: { relatedUser: { firstName: string; id: number } }) => ({        id: item.relatedUser.id,        imageUrl: defaultUrl,        name: item.relatedUser.firstName,      }),    );

This works. However, when I change it to something like this:

  const { error, data, refetch } = useUsersQuery({    variables: {      where: { id: 1 },    },  });  if (data) {    const DATA = data.users.nodes[0].userRelations.map(      (item: { relatedUser: { firstName: string; id: number } }) => ({        id: item.relatedUser.id,        imageUrl: defaultUrl,        name: item.relatedUser.firstName,      }),    );  } else {    const DATA = [      {        id: 'bd7acbea-c1b1-46c2-aed5-3ad53abb28ba',        imageUrl: defaultUrl,        name: 'Johann',      },      {        id: '3ac68afc-c605-48d3-a4f8-fbd91aa97f63',        imageUrl: defaultUrl,        name: 'Lars',      },      {        id: '58694a0f-3da1-471f-bd96-145571e29d72',        imageUrl: defaultUrl,        name: 'Sarah',      },    ];  }...<FlatList          data={DATA}          horizontal={true}          scrollEnabled          renderItem={({ item }) => (<WhitelistItem title={item.name} face={item.imageUrl} />          )}          keyExtractor={(item) => item.id}        />

I start getting an error here data={DATA} that Cannot find name 'DATA'. Did you mean 'data'?. Why is this so? Even if the query fails, I am still creating a DATA variable in the else statement. So why is not being detected here? How can I fix this?