Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refact/231207 new question focus #225

Merged

Conversation

Byeonjin
Copy link
Collaborator

@Byeonjin Byeonjin commented Dec 7, 2023

작업 개요

질문리스트, 질문 채팅 관련 사용성 개선

작업 사항

  1. 질문 리스트의 메모지 색 통일 Refactor: 질문 리스트의 메모지 색 통일 #218
  • 기존: 5가지 색으로 인덱스에 따라 색 지정
  • 개선: 리스트에 생성되는 메모지의 색을 노란색으로 고정해 화이트보드에 생성되는 메모지의 색과 일치시켰습니다.
  1. 발표자-질문리스트 새로운 질문 상단에 생성 Refactor: 참여자, 발표자 최신 질문에 대한 사용성 개선 #216

  2. 발표자-버블의 알림 애니메이션이 헤더 밑으로 깔리는 문제 해결

  3. 참여자-질문 채팅 새로운 질문으로 스크롤 이동 Refactor: 참여자, 발표자 최신 질문에 대한 사용성 개선 #216

고민한 점들(필수 X)

스크린샷(필수 X)

  • 버블 개선 전
2023-12-07.4.34.15.mov
  • 버블 개선 후
2023-12-07.4.48.40.mov
  • 질문 채팅 개선 전
2023-12-07.4.35.34.mov
  • 질문 채팅 개선 후
2023-12-07.4.49.25.mov
  • 질문 리스트 개선 전
2023-12-07.4.36.43.mov
  • 질문 리스트 개선 후
2023-12-07.4.37.41.mov

Copy link

netlify bot commented Dec 7, 2023

Deploy Preview for boarlog ready!

Name Link
🔨 Latest commit f9026d8
🔍 Latest deploy log https://app.netlify.com/sites/boarlog/deploys/6571807423196400094e27e1
😎 Deploy Preview https://deploy-preview-225--boarlog.netlify.app/
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@Byeonjin Byeonjin self-assigned this Dec 7, 2023
@Byeonjin Byeonjin added 🛠️ Refactor 리팩토링 작업 FE 프론트엔드 작업 labels Dec 7, 2023
@Byeonjin Byeonjin added this to the 5주차 milestone Dec 7, 2023
@Byeonjin Byeonjin marked this pull request as ready for review December 7, 2023 07:54
Copy link
Collaborator

@LellowMellow LellowMellow left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

코드 잘 봤습니다!! method 분리까지 너무 깔끔해요!! 👍👍👍👍👍

}, []);
if (type === "prompt") {
useEffect(() => {
console.log("p");
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

특별한 의미가 있는 console.log가 아니라면 지워주셔도 좋을 것 같습니다!

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

앗 바로 고치겠습니다.

if (type === "prompt") {
useEffect(() => {
console.log("p");
axios("./reviewLecture.json")
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

미리 mock 데이터로 API 요청 대신하신 점 너무 좋습니다.

Comment on lines +1 to +18
const MS_OF_SECOND = 1000;
const SECOND_OF_HOUR = 3600;
const MINUTE_OF_HOUR = 60;

const convertMsToTimeString = (ms: string) => {
let msNumber = parseInt(ms);
let seconds = Math.floor(msNumber / MS_OF_SECOND);
let hours = Math.floor(seconds / SECOND_OF_HOUR);
seconds = seconds % 3600;

let minutes = Math.floor(seconds / MINUTE_OF_HOUR);
seconds = seconds % 60;

return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}:${seconds
.toString()
.padStart(2, "0")}`;
};
export default convertMsToTimeString;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

헉..! 바로 반영해주셨군요,,,! 감사합니다 :)

Copy link
Collaborator

@Jw705 Jw705 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

고생하셨습니다!! 작은 디테일까지 항상 꼼꼼히 살펴보시는 진상님 보면서 많이 배웁니다. 👍👍


return COLOR_SET[randomIndex].background + " " + COLOR_SET[randomIndex].border;
};
const MEMO_COLOR = "bg-memo-yellow border-memo-border-yellow";
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

반영해주셔셔 감사합니다!

Comment on lines +1 to +18
const MS_OF_SECOND = 1000;
const SECOND_OF_HOUR = 3600;
const MINUTE_OF_HOUR = 60;

const convertMsToTimeString = (ms: string) => {
let msNumber = parseInt(ms);
let seconds = Math.floor(msNumber / MS_OF_SECOND);
let hours = Math.floor(seconds / SECOND_OF_HOUR);
seconds = seconds % 3600;

let minutes = Math.floor(seconds / MINUTE_OF_HOUR);
seconds = seconds % 60;

return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}:${seconds
.toString()
.padStart(2, "0")}`;
};
export default convertMsToTimeString;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

util 폴더 분리 너무 좋네요! 저도 잘 사용하겠습니다 :)

@Byeonjin Byeonjin merged commit cf3ab31 into boostcampwm2023:dev Dec 7, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
FE 프론트엔드 작업 🛠️ Refactor 리팩토링 작업
Projects
None yet
3 participants