0
0 Comments

The idea is to fetch cards that user used in the database and compare with the all cards that are listen on screen. Basically user is not supposed to see cards which he already used.

const loadSaveInvestments = async (
    _req: express.Request,
    res: express.Response
  ) => {
    const findSaveInvestments = await prisma.investmentSave.findMany({
      select: {
        investment_id: true,
      },
    });
    if (!findSaveInvestments) throw new HttpException(400, SAVE_INVEST_MISSING);
    res.send(findSaveInvestments);
  };

So, I’m sending all of the saved investment cards. Now, in the React – I’m fetching the sent data from the service (all cards and saved cards)

const fetchUserSaveInvestments = async () => {
  const res = await axios.get(`${baseURL}/investments-save`);
  return res;
};

const [cards, setCards] = useState([]);
const [saveCards, setSaveCards] = useState([]);

useEffect(() => {
    setLoading(true);

    investService.fetchUserSaveInvestments().then((res) => {
      setSaveCards(res.data);
    });

    investService.fetchCards().then((res) => {
      setCards(res.data.investments);
      setLoading(false);
    });

Now – the main part. I want to map card only if it’s id is not in the save cards state, so I’ve tried something like that.. I’ve marked the point where I got kinda stuck, I mean, am I supposed to create something like double map or what? Idk if I’m going in the right direction.

      <div className={classes.CardsContainer}>
        <div className={classes.CardsSelector}>
          {loading && <p> its loading </p>}
          {!loading && (
            <>
              {cards
                .filter(
                  (card) => card.id !== saveCards.?????.investments_id
                )
                .map((card) => (
                  <Card
                    {...card}
                    handleClick={() => handleChooseCard(card)}
                  />
                ))}
            </>
          )}
        </div>

Thanks in advance.

Anonymous Asked question May 14, 2021