TestingLibraryElementError: Unable to find an element Conditional based data-testid in #testing-library/react - unit-testing

Question

I have written many test cases in the react testing library, I got stuck in the accessing condition based DOM element. I have tried many ways using import { renderHook } from '#testing-library/react-hooks'. But didn't work from me. Here is the code. Great appreciate
import axios from "axios";
import { withTranslation } from "react-i18next";
function MDStaticContent({ t }) {
const [promoArrayIsValid, setPromoArrayIsValid] = useState(false);
const loadRecent = async () => {
API Calls Here
const recents = await onRecentMedia(accounts[0], instance);
if (Some condition) {
if (Here Some condition) {
setPromoArrayIsValid(true);
}
dispatch(Here Will discpatch data);
}
};
return (
<>
{ promoArrayIsValid && (
<div data-testid="mdStaticContent">
Hello
</div>
</>
)}
}
import React from "react";
import { render, cleanup } from "#testing-library/react";
import { useEffect, useState } from "react";
import { Provider } from 'react-redux';
import "#testing-library/jest-dom/extend-expect";
import { MemoryRouter } from 'react-router-dom';
import configureMockStore from 'redux-mock-store';
import { ThemeProvider } from 'styled-components';
import thunk from 'redux-thunk';
import MDStaticContent from "./MDStaticContent";
import { act } from 'react-dom/test-utils';
import MockAPIData from '../resources/locales/en/MockAPIData.json';
import { renderHook } from '#testing-library/react-hooks'
const mockStore = configureMockStore([thunk]);
let data = {
mediaArrayIsValid: true,
promoArrayIsValid: true
}
const store = mockStore(data);
it("should take a snapshot and match of MDStaticContent Page", () => {
const { asFragment, getAllByTestId, getByTestId
} = render(
<ThemeProvider theme={theme}>
<Provider store={store}>
<MemoryRouter>
<MDStaticContent/>
</MemoryRouter>
</Provider>
</ThemeProvider>
);
expect(asFragment()).toMatchSnapshot();
expect(getAllByTestId("mdStaticContent")).toHaveLength(1);
expect(getByTestId("mdStaticContent")).toBeVisible();
});