search

three-ppp / PPP_Engibeer

チーム開発　エンジビアの泉
1 stars 0 forks source link

【ユーザー】エンジビア表示板（放送中・放送前）の作成 #49

Closed london-newyork closed 2 years ago

london-newyork commented 2 years ago

プルリクお願いいたします。

やろうとしたこと

desktop-16の表示板作成

スクリーンショット 2021-11-17 19 28 13

自信のないところ

rinka0v0 commented 2 years ago

放送中画面（desktop-13）やアーカイブ(desktop-19)では加えて、へぇの総数とエンジビア番号？（タイトルの上にあるエンジビア5など）が必要になります。そのため今の状態では使いまわせません。 そのため（desktop-13）やアーカイブ(desktop-19)のために別のコンポーネントを作るか、このコンポーネントを拡張して、propsにへぇ数とエンジビア数を受け取るようにして、へぇ数とエンジビア数がpropsに渡された時は（desktop-13）やアーカイブ(desktop-19)にあるコンポーネントを表示する。propsにへぇ数とエンジビア数が渡させていない場合はdesktop-16にあるものを表示するようにする必要などがあると思います。

tksat commented 2 years ago

rinkaさんのレビューめちゃ勉強になる・・！！rinkaさんの修正点以外特に気になる所ありませんでした！

london-newyork commented 2 years ago

やったこと

自信のないところ

import { EngibeerAddPage } from '/pages/before/[broadcastId]/engibeer/add';//URLが怪しい

const { text, displayname, iconURL, engibeerCount, engibeer } = props;//engibeerはEngibeerAddPageで取得された内容

const userEditingEngibeerURL = '/live/放送ID';//desktop16

まだ手をつけていないところ

DisplayHeyコンポーネント（仮）

london-newyork commented 2 years ago

　やったこと

自信のないところ

rinka0v0 commented 2 years ago

へえ数の合計のカウントですが、このコンポーネントでは計算は行わず、親から渡された（計算済みの合計カウント）を受け取って表示するだけでとりあえずよいと思うので、へえ数の合計のカウントの計算の部分は考えなくて大丈夫です。 なので合計カウントはtotalHeyCountという名前でpropsで受け取るようにしてこれを表示して貰えば大丈夫です

rinka0v0 commented 2 years ago

多分必要なpropsの型定義は

type Props = {
  title: string;　　　　　　    　　（エンジビアのタイトル）　　（必須props）
  displayname: string;　　　　（投稿者の名前）　　　　　　（必須props）
  iconURL: string;　　　　　　（投稿者のアイコンURL）　　（必須props）
  totalHeyCount?: number    　　（へえ数の合計のカウント）（desktop-13では必要だがdesktop-16ではいらないので？をつける）
  engibieerNumber?: number　　（エンジビアの番号）　　　（desktop-13では必要だがdesktop-16ではいらないので？をつける）
}

こんな感じになると思います。上記の５つだけでいけると思います。名前（title, displayname）などはテキトーなのでよりわかりやすいものがあったら変更してください🙇‍♂️

london-newyork commented 2 years ago

ありがとうございます！ なんだかちょっと考えすぎだったみたいです。すごくわかりやすくて参考になりました！

london-newyork commented 2 years ago
スクリーンショット 2021-11-22 22 03 53

下記は上記ブラウザのソースコードです。

` 

  </div>
  <div className="bg-gray-300 p-6">
    <DisplayBoardEngibeer engibeerNumber={11} title="エンジビアはエンジビアである。エンジビアはエンジビア"　displayname="yururin" iconURL="https://source.unsplash.com/random" totalHeyCount={85}/>
  </div>`

変更点

DisplayBoardEngibeer.tsx内の三項演算子の中身・２パターン、それぞれを入れ替え

  • title と engibeerNumberが渡ってきた時、engibeerNumberを必要としないパターンのJSXをtrueで返すようにしていたため、engibeerNumberを必要とするパターンのJSXをtrueに返すようにしました。
london-newyork commented 2 years ago

変更点

  • 三項演算子の条件を変更しました。
  • jsx形式を削除しました。
rinka0v0 commented 2 years ago

修正ありがとうございます！！ 自分はこれで問題なさそうだと思います！！

london-newyork commented 2 years ago

ありがとうございます！ 今日明日中に皆さんから回答がなければ、マージしちゃいます。

tksat commented 2 years ago

すごい・・！！私も問題ありません・・！対応ありがとうございます！

medi772425 commented 2 years ago

良い悪いはさっぱり分かってないのですが、コードを確認いたしました。ありがとうございます。