Select Leetcode Problems

[ncharchenko]

For right now, it appears that the plugin only gives a random set of problems. Being able to choose a set of problems for the room would be helpful for practice.

[marwanhawari]

This is a big feature. Going to need a few things:

• new UI element (probably a modal element in the Home.tsx component) to select the question filters
• new logic in the extension to POST to the backend with that information
• new logic in the "createRoom" handler on the backend to properly filter questions
• updates to the db to allow for filtering

In my mind, there are more important features that I want to have first (which I've created issues for), so I'm probably not going to be working on this right away. But if somebody wants to start designing and coding this, I'd be happy to give feedback and review PRs.

On the UI, users should be able to filter by:

1. Topics (including difficulty) - searchable and select-/unselect-all
2. Contests (both weekly and biweekly)
3. Problems (up to 4) - searchable and select-/unselect-all

Need db migration to add "Contest" and "Tags" (TEXT[]) columns to Questions table.

Will need a CRON job to update the Questions table when the contest questions are released.

[marwanhawari]

Partially solved by this PR:

• feat: add room settings panel #11

Still need to add a difficulty filter for the topics.

I'm going to hold off on the contests/problems selection. I don't think it's high priority.

[jakecastelli]

Hi guys,

First of all, big shout out to @marwanhawari for making the extension, it makes solving leetcode with friends so much fun.

Second, I really like this purposed feature, my mate and I usually practice together 1 - 2 specific questions at night.

Is it ok for me to continue contributing to this feature?

Cheers

[marwanhawari]

Awesome, contributions are welcome! Here's a rough idea of what needs to be done to let users select specific questions:

• Frontend:
  • add a new tab to the modal UI called Questions. Start here:
    

    LeetRooms/extension/src/components/buttons/RoomSettingsButton.tsx

    Line 213 in 7ca3dcb

    let tabs = ["Topics"];

  • when the user switches to the Questions UI, fetch all the questions from the db (you'll need to create a new GET /questions/ endpoint). Use react query like in scoreboard modal:
    

    LeetRooms/extension/src/components/buttons/PlayersButton.tsx

    Line 67 in 7ca3dcb

    } = useQuery<PlayerWithSubmissions[]>({

  • Display a list of all the questions (don't worry about displaying difficulties). It should be selectable just like topics. Users should only be able to select a max of 4 questions.
    • there's potentially a lot of depth here like allowing the user to filter by difficulty, making it searchable, etc. but for now you can essentially just copy the way it's done w/ topics. Just needs a reset button to unselect all questions.
  • Add a new field to the QuestionFilterKind enum called Questions. Actually you need to do this in both the backend and frontend.
    

    LeetRooms/extension/src/types/RoomSettings.ts

    Line 18 in 7ca3dcb

    export enum QuestionFilterKind {

    
    

    LeetRooms/server/src/types/RoomSettings.ts

    Line 24 in 7ca3dcb

    export enum QuestionFilterKind {

    • Make sure that when the app POSTs to the /rooms/ endpoint you set the questionFilter.kind to Questions the

let body: RoomSettings = {
    questionFilter: {
      kind: QuestionFilterKind.Questions
	  selections: [ { id: 1, title: "Two Sum", titleSlug: "two-sum", difficulty: Difficulty.Easy } ]
    };
    duration?: ...;
    difficulty: ...;
}

• Backend:
  • add a new GET /questions/ endpoint. You'd need to make a new server/src/api/questions folder to put the files in.
  • Update the backend logic to handle when the filterKind is Questions:
    • You might find it easier to do a little refactoring here. Side note: the API as a whole is a bit of a mess right now and I'm planning to do a big refactor in the next few months.
      

      LeetRooms/server/src/api/rooms/rooms.handler.ts

      Line 78 in 7ca3dcb

      if (filterKind !== QuestionFilterKind.Topics) {

I might be missing something, but I just brain-dumped this and that's all I can think of for now. Of course, this is a lot and I don't expect you to do all of this (unless you want to).

Also, the best way to get a hold of me if you have questions is in the LeetRooms discord: https://discord.gg/bJBDNpSUWQ

[jakecastelli]

I really appreciate your step to step guide! This is absolutely amazing along with the CONTRIBUTION.md as my initial onboarding docs.

I like your idea and I will keep you updated on the progress either here or in discord:

there's potentially a lot of depth here like allowing the user to filter by difficulty, making it searchable, etc. but for now you can essentially just copy the way it's done w/ topics. Just needs a reset button to unselect all questions.