概要

新規登録の横スクロールができてしまう問題を修正する

https://discord.com/channels/824955425983168553/909693628891406426/912942674112303144

発生環境

• 不明
  • Macbook Pro 13-inchi OS BigSur 11.6でChromeで検証から画面サイズを変えたり、大きめのディスプレイで表示したりと色々試したが、再現できなかった

概要

Custom Hook やコンポーネント化をして350行以上あるファイルの行数を減らす
1ファイル当たり300~350行以内にしたい
（まだ規約について話し合えていないので目標行数が変わる可能性もあり。notion を参考すること）

目的

まだきちんとディレクトリ構成やコーディング規約を定める前にコードを書き始めてしまったため、行数が長いファイル or 長くせざるを得なかったファイルがちょいちょい出てしまっている。短くしたい

概要

概要

issue 概要を記入

やること

• あれば記入

関連

• 関連する issue や PR を #${issue, PR}で記述

参考リンク

概要

プロジェクト詳細 - プロジェクトメンバー一覧 & 詳細ポップオーバー

やること

関連

参考リンク

概要

殿が作ってくれたtoastを使ってメッセージを表示する
https://discord.com/channels/824955425983168553/877130875781939220/909707042770546728

概要

タスク追加時、listのidではないものが入っているのでそれの修正

issue 概要を記入

やること

関連

参考リンク

概要

issue 概要を記入

やること

関連

参考リンク

Projectにissueを関連付けてタスク管理するためのテスト

概要

issue 概要を記入

やること

関連

参考リンク

概要

ログの内容が決まったのでそれに対応するよう実装

やること

• ログの定数を作成
• ログのフロント周り
• モンスターHPの計算
• mutation周りの実装
  • task create
  • list create
  • project create
  • online
  • offline
  • create first task
  • completed task
  • level up
  • completed project

関連

参考リンク

概要

タスク編集
・タイトル変更
・概要変更
・ステータス変更
・期日変更
タスク削除

人事側
ユーザ毎のタスク完了数・更新日取得

概要

チャット取得・挿入・更新・削除
api側でquery・mutationの実装

概要

• 新規登録画面を作成する

TODO

• ヘッダーを作成する
• react-hook-formを使った新規登録処理の完成
• 新規登録画面の完成

概要

完了にタスクを移動させた時のみ、データベースに完了フラグを立てにいく

やること

関連

参考リンク

概要

issue 概要を記入

やること

関連

参考リンク

概要

新規登録画面の修正を行う

やること

• 画像のところのカーソルpointer
• 興味/資格追加時に空白を弾く
• 興味/資格の横に n / 20 の表示をする
• 興味/資格の上限を20個までとする
• 興味/資格の文字数制限を50文字までとする
• 新規登録の横スクロールが若干できてしまう問題の修正
• imgにalt属性をつける

関連

参考リンク

概要

プロジェクト詳細のリスト周りを作成

やること

タスク周り含めてリファクタしつつ機能と見た目を作る

関連

参考リンク

概要

タスク割り当て

概要

• モーダル表示時に右側の要素が下に突き抜けてしまうので修正する
• できたらモーダル以外の部分でリファクタしたほうがいいところがあるので直しておく
  • stateの配列操作でpushしてる箇所があるのでスプレッド演算子に直す
  • SimpleRoundedButtonがpropsでstyleを渡すようになっており好ましくないので修正
  • bgSrcなど、ソースを渡している部分で先頭にスラッシュが付いていない箇所は、相対パスになってしまい不具合を生む可能性があるので直しておく

関連

• #99

概要

• hooks, utilsにJSDocを付与して可読性を上げる
• 新規登録のロゴがレスポンシブになってない問題の修正

https://discord.com/channels/824955425983168553/909693628891406426/913306243941163039

やること

関連

参考リンク

概要

• Name that Colorで重複する色名が出てきており、 SILVER, SILVER2 という風に色が増えてしまっている
• 色をどちらかに統一したり、適切な名前に変更して修正する

概要

タスクカードの作成

やること

関連

参考リンク

概要

make:seeder-run実行でダミーデータが作られる

やること

seedとfactoryの作成

概要

• マイページをfigmaを見ながらデザインを反映

やること

• ユーザデータの取得
• ステータス表示
• 資格、興味あることの表示
• 編集領域

関連

参考リンク

Figam マイページデザイン

概要

タスク一覧画面の作成を行う
機能面は roll1226 が何個か既に作ってくれているのでそれを使う

概要

issue 概要を記入

やること

関連

参考リンク

概要

• タスク作成時のモーダルを作る
• 他でも使い回せるようにコンポーネントを分けて作る

関連

#67

概要

• 1440px未満の場合はFigmaのサイズ比率で縮小するが、それ以上はFigmaのサイズ通りで表示する
• タスク一覧画面を考えた時、この画面においてはディスプレイが大きいならその分タスクもたくさん表示して欲しいが、現在の実装だと全てFigma通りの縮尺になってしまうためたくさん表示できない

どう実装するか

• メディアクエリを使う
  • 多分こっちが安牌
• max-widthを設定する

概要

ログイン状態の場合のヘッダーを作成
メニューを作成

やること

• アイコン
• 通知
• アカウントメニュー
• 招待

関連

参考リンク

概要

issue 概要を記入

やること

• あれば記入

関連

• 関連する issue や PR を #${issue, PR}で記述

参考リンク

概要

issue 概要を記入

やること

関連

参考リンク

概要

• プロジェクト詳細(/projects/:id)の右側(ダイアログ、リスト追加ボタンなど)を実装

issue 概要を記入

やること

• ダイアログ
• リスト追加ボタン
• ドラゴンの表示

参考リンク

Figma プロジェクト詳細ページ

概要

issue 概要を記入

やること

関連

参考リンク

概要

タスク編集モーダルを作成する

やること

• コメント機能の実装
• 詳細 / 編集の状態切り替え
• スクロールの挙動の実装
  • 同期スクロールにする

関連

• #99

参考リンク

概要

issue 概要を記入

やること

関連

参考リンク

概要

人事で必要なquery・mutaitionの作成

必要なquery・mutaition

企業名登録(人事ユーザ)(addMutation)
ログイン(企業ユーザ(uid・会社名)取得)(query)
社員ユーザ一覧取得(query)
社員ユーザ社員詳細(query)
社員メモ(addMutation)

概要

タスク検索が正常に動作していない

• 検索できるタスクと検索できないタスクがある

関連

参考リンク

404ページを作成する

概要

issue 概要を記入

やること

関連

参考リンク

概要

Trello と GitHub issuesは連携できるようなので、今後のために連携しておきたい

やりたいこと

• issueを作成したらtrelloの未着手に作成される
• issueを関連づけたPRを作成したとき、trelloのタスクは進行中に移動する
• issueにアサインされているユーザーがtrelloにアサインされる
• PRにアサインされているユーザーがtrelloにアサインされる
• issueをcloseしたら、trelloのタスクは完了に移動する
• PRにコミットしたら、関連するissueのtrelloタスクにコメントする

概要

ログインページの実装

#45 で新規登録ページはできているので、そんなに時間はかからなさそう

概要

タスク完了時にcompleteなどの通知を送れるように
Subscriptionの実装

概要

issue 概要を記入

やること

関連

参考リンク

概要

issue 概要を記入

やること

• あれば記入

関連

• 関連する issue や PR を #${issue, PR}で記述

参考リンク

概要

現状、Figmaと同じ画面サイズ (1440*900) で表示すれば問題ないが、

MacBook Pro 13-inchi (1152*720)で表示すると、下記のようにかなり大きめに表示されてしまう

vw, vh等を使い、スマホサイズに対応する必要はないが、少なくともPC上ではンプ通りのデザインで表示されるようにする

概要

プロジェクト詳細ページの左下にある自分の情報を載せる

やること

• 画像表示
• 名前表示
• レベル表示
• HP, MP, EXP
• 技術力, 達成力, 解決力, 意欲, デザイン, 設計力

関連

参考リンク

概要

プロジェクト一覧画面を作成する

TODO

• uiフォルダ内にMonster関連のコンポーネントがあるが、これらはmodelsに移す