tippi-fifestarr / dd

third times the charm
https://dadeuce.vercel.app/
1 stars 1 forks source link

fix to server side page #1

Closed Erriccc closed 1 year ago

Erriccc commented 1 year ago

'use client';

// import { useState } from "react"; import Person from "./person"; import Image from "next/image"; import React, {useState, useEffect} from 'react';

export default function Cards() { const [someData,setSomeData] = useState(undefined); const [moreData,setMoreData] = useState(undefined);

const defineAsyncFunctionsHere = async () => { return }

useEffect(() => {

  const performOtherAsyncCalls = async () => {
    const imagePath = "http://image.tmdb.org/t/p/original";
          const data = await fetch(
      `https://api.themoviedb.org/3/person/popular?api_key=${process.env.TMDB_API_KEY}`
    );
    const res = await data.json();
    newRes = res.results.sort((a, b) => 0.5 - Math.random());
    //   console.log(res);
    setMoreData(newRes[0])

    setSomeData(newRes)

    return
  }

  someData !== undefined && performOtherAsyncCalls()
      return

},[someData,moreData]);

// const config = await fetch( // https://api.themoviedb.org/3/configuration?api_key=${process.env.TMDB_API_KEY} // );

// const configo = await config.json(); // console.log(configo.images.base_url); // const profSizes = configo.images.profile_sizes; // console.log(profSizes[1]); // const imagePath = ${configo.images.base_url}w185;

// const [selectedCard, setSelectedCard] = useState(""); // state for which card was clicked

// update the hero image to show clicked return ( // map through the res and return 25 names

{/* display details of selected card, larger image, person name, knownfor */}
{someData !== undefined && moreData !== undefined && {`image}
You've clicked on {someData[0]?.name}
{someData?.map((person) => (
))}

); }

tippi-fifestarr commented 1 year ago

@Erriccc well, i tried this, thank you! i think i got the main idea here but now I'm doing something wrong in my conditional render. Kinda tired will try again tomorrow or thursday.

Just pushed the changes, if you get a chance to check it out let me know. My next step will be see if GPT can figure out what i did wrong haha I think its something having a wrapping div and then conditionally rendering only that top detail component on the state of people fetched and card clicked

Thanks again dude

tippi-fifestarr commented 1 year ago

Migrating from _appdir to normal next 13 as I setup Thirdweb