event planner: lekce 10

[atuseract]

@ladariha ahoj, este nez zacnem pridavat testy, pls spravis mi review a az to upravim spravim testy ? Diky

[ladariha]

Par spise prkotin (ale zvazil bych to predelat na tabulku :) , ale jinak je to dobre, mas to rozdelene na vice komponent, props davaji smysl. Dobre :)

[ladariha]

prkotina, ale podle zadani tohle ma byt number, napr. pocet milisekund od epochy. Jinymi slovy neco jako vysledek Date.now() nebo date.getTime()

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getTime

a potom pro zobrazeni je potreba napr. neco jako

<h4>{new Date(timestamp).toLocaleString()}</h4>

[ladariha]

nazev by mel byt records (mnozne cislo) - lepe to reflektuje, ze se jedna o pole

[ladariha]

jenom pro zamysleni: item.name nemusi byt asi vzdy unikatni. Muze se stat, ze by jsi mel hlasy od dvou "Jan" napr. V tomto pripade, protoze entita UserRecord nema nic jako id, by asi nejsnazsi/nejjistejsi bylo pouziti nahodneho stringu jako key, napr.

{record.map((item) => (
                <div key={`${Math.random()}`}>{item.name} ({item.answer})</div>
            ))}

[ladariha]

Nicmene pro ucely ukolu, zpetne uvazovano, pocitejme, ze jmeno je unikatni :)

[ladariha]

take bych pouzil spise dates (mnozne cislo) jako nazev propu

[ladariha]

Vcera jsem se bavili o formatu. Muze to byt bez nejakeho stylovani, ale zvazil bych , zda VodeResults nema renderovat <tr> a zobrazit to jako tabulku.

Technicky v zadani ukolu je

tabulku s výsledkem
hlasování - v řádcích jsou jména účastníků, ve sloupcích data a jednotlivé
buňky pak zobrazují, zda daný účastník se v tomto datu účastní nebo ne

nebudu na tom nijak trvat, neni to jadro ukolu, ale UI je pak srozumitelnejsi:

Stacilo by v Event komponente napr.

 <h3>{title}-{location}</h3>
            <table>
                <thead>
                    <tr>{date.map((d) => <td key={d.timestamp}>{d.timestamp}</td>)}</tr>
                </thead>
                <tbody>
                    {date.map((item) => (
                        <VoteResults key={item.timestamp} record={item.record} timestamp={item.timestamp}></VoteResults>
                    ))}
                </tbody>
            </table>

a potom upravit VoteResults, aby vracel <tr> a ten callback uvnitr .map() volani (konkretne https://github.com/pseudorandomnameAdam/starter/blob/96f39533f2b69bf2825baef3cd2d5adb87bd25c1/client/src/pages/VoteResults/VoteResults.tsx#L20 ) vypadal neco jako

<td key={`${Math.random()}`}>{item.name} ({item.answer})</td>

[atuseract]

Ahoj, prave som to skusal ale uvedomil som si ze ta tabulka musi byt transponovana asi nejak takto:

Tak s tym trochu bojujem ako toho docielit :D

[ladariha]

Omlouvám se za matoucí screenshot, máš samozřejmě pravdu:) je to komplikovanější, protože struktura dat není úplně ideální, nevíš, jestli všichni hlasovali u všech datumu, jestli jsou datumy seřazene...A to pro zjednodušení můžeme počítat, že jména jsou unikátní :) ale je to jen formalita, body to neovlivní:)

Mergnuti necham na tobě