feat: create supervisor component #21

mejsiejdev · 2024-12-07T17:51:58Z

Depends on #23

Adds a supervisor component.

chewmanji · 2024-12-08T20:08:40Z

Well, I think we need to refactor the supervisor component in design first and then implement it on frontend.
Meanwhile may you start implementing saving conversation to local storage or migrate prompt input to ProseMirror lib?
I assigned myself to the second one but for me there's no difference which one I'd do.

mejsiejdev · 2024-12-08T22:21:06Z

Well, I think we need to refactor the supervisor component in design first and then implement it on frontend.
Meanwhile may you start implementing saving conversation to local storage or migrate prompt input to ProseMirror lib?
I assigned myself to the second one but for me there's no difference which one I'd do.

Damn, I wish it was mentioned in the issue that the design is going to be changed 🙃

I will start working on saving conversations.

chewmanji · 2024-12-08T22:44:02Z

😭😭
My bad, forgot to change it. Sorry

maciejkrol18

issue (responsiveness): expanding the accordion on mobile causes <body> overflow

suggestion: This whole component isn't bad and we can use it after we address my comments, but we're already using shadcn/ui components throughout our app, and I don't see why we wouldn't use shadcn's accordion (with adjusted code to match our design of course) for this case as well. We would benefit from nice animations and it would ensure that this part of the app is accessible.

maciejkrol18 · 2024-12-18T17:27:12Z

src/components/supervisor.tsx

+      <div
+        className={cn(
+          "inline-flex w-full flex-col gap-4 rounded-2xl p-4",
+          (highlight ?? false)


issue (non-blocking): This highlight doesn't make any sense. I don't think there's any reason to pass a highlight prop to this component. Though admittedly this can't be really deduced from our figma design on first glance, I think it makes most sense to highlight the currently active/expanded accordion - thing is, in the current implementation we can have multiple expanded accordions at once

the design did not really show that the expanded accordion is highlighted - I thought that only the first one is highlighted, will change that

maciejkrol18 · 2024-12-18T17:29:51Z

src/components/supervisor.tsx

+          <Button
+            size="icon"
+            variant="transparent"
+            title="Rozwiń"
+            onClick={() => {
+              setIsOpen(!isOpen);
+            }}
+          >
+            {isOpen ? <ChevronUp size={36} /> : <ChevronDown size={36} />}
+          </Button>


issue (non-blocking): Having to specifically click this small button to toggle the accordion is bad UX. I suggest making the div with the professor's name and faculty the actual button

will change that

maciejkrol18 · 2024-12-18T17:32:27Z

tailwind.config.ts

@@ -20,6 +20,7 @@ export default {
        "chat-bot": "#1D2150",
        "chat-user": "#34386A",
        "chat-background": "#060C28",
+        "message-primary": "#5D70B8",


suggestion: Currently, message-primary is used for the chat bot's message, yet we also have a chat-bot variable. This appears to be caused by the fact that on our homepage, chat-bot is used as the bot's message background color. If we stay with message-primary (see below), I think the homepage could be adjusted so that it represents how the chat actually looks (bot message uses the brighter message-primary as its background color)

Though on another hand, this color doesn't pass WCAG AAA contrast check given the white foreground (https://webaim.org/resources/contrastchecker/), while chat-bot passes all checks

I used this color because it was used in the design, we have to choose another color for it then

I understand, that's not a mistake on your part. We'll address this design problem later

maciejkrol18 · 2024-12-18T17:45:39Z

src/components/supervisor.tsx

+        <div className="flex items-center justify-between gap-4">
+          <div className="flex flex-col gap-1">
+            <p className="text-xl font-bold">{name}</p>
+            <p>{faculty}</p>


thought: Since the API returns faculties in english, we will probably have to setup some sort of a "dictionary" within the app, which will have english-polish faculty name pairs that we will then use in api requests and the ui respectively

mejsiejdev · 2024-12-19T11:08:41Z

Hey @maciejkrol18 , can you take a look at it again? It is now using the accordion from shadcn

maciejkrol18

Good job, everything looks and works nice. I'll let you do the honors of merging

edit: and the honors of resolving conflicts

maciejkrol18 · 2024-12-19T14:38:11Z

src/app/chat/page.tsx

+          <PromochatorIcon
+            imageWidth={36}
+            imageHeight={36}
+            imageClassName="py-2 px-1"
+          />


note: This icon gets really tiny on mobile. Just noting this since this whole markup is just for showcasing the component, this should be handled in #45

maciejkrol18 · 2024-12-19T14:38:51Z

tailwind.config.ts

@@ -20,6 +20,7 @@ export default {
        "chat-bot": "#1D2150",
        "chat-user": "#34386A",
        "chat-background": "#060C28",
+        "message-primary": "#5D70B8",


I understand, that's not a mistake on your part. We'll address this design problem later

mejsiejdev linked an issue Dec 7, 2024 that may be closed by this pull request

Create supervisor component #14

Closed

mejsiejdev force-pushed the 14-create-supervisor-component branch 2 times, most recently from 28cd685 to 1680903 Compare December 8, 2024 19:08

mejsiejdev self-assigned this Dec 8, 2024

mejsiejdev marked this pull request as ready for review December 8, 2024 19:18

mejsiejdev requested review from maciejkrol18 and chewmanji December 8, 2024 19:19

chewmanji and others added 8 commits December 10, 2024 13:59

add auto resize textarea

24c05b7

refact: remove textarea hook

021093c

feat: add redirecting to uuid generated path

bba980c

feat: Create a Supervisor component

2e928f2

feat: Create a view to test Supervisor component

ed8d61a

refact: remove tailwind scrollbar lib; small fixes

318bf1b

refact: remove code for testing; rename tailwind color variable

8ed9c45

feat(supervisor): Add highlight state

24c1833

mejsiejdev force-pushed the 14-create-supervisor-component branch from 9a26830 to 24c1833 Compare December 10, 2024 13:00

fix(supervisor): fix lint errors

43fa21d

mejsiejdev changed the title ~~Create supervisor component~~ feat: create supervisor component Dec 10, 2024

mejsiejdev added the enhancement New feature or request label Dec 10, 2024

mejsiejdev added 5 commits December 12, 2024 11:57

feat(supervisor): update based on the new design

175c79f

refactor: reformat pnpm-lock.yaml

6b97952

refactor: Use pnpm-lock.yaml from main

c38562c

Merge branch 'main' into 14-create-supervisor-component

03f5729

feat(supervisor): update to the revised design

5b13447

maciejkrol18 reviewed Dec 18, 2024

View reviewed changes

refactor(supervisor): use shadcn accordion

28999e1

mejsiejdev requested a review from maciejkrol18 December 19, 2024 11:07

maciejkrol18 approved these changes Dec 19, 2024

View reviewed changes

Merge branch 'main' into 14-create-supervisor-component

e8e1278

mejsiejdev merged commit ccbf982 into main Dec 19, 2024
1 check passed

mejsiejdev deleted the 14-create-supervisor-component branch December 19, 2024 16:33

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: create supervisor component #21

feat: create supervisor component #21

mejsiejdev commented Dec 7, 2024 •

edited

Loading

chewmanji commented Dec 8, 2024 •

edited

Loading

mejsiejdev commented Dec 8, 2024 •

edited

Loading

chewmanji commented Dec 8, 2024

maciejkrol18 left a comment

maciejkrol18 Dec 18, 2024

mejsiejdev Dec 19, 2024

maciejkrol18 Dec 18, 2024

mejsiejdev Dec 19, 2024

maciejkrol18 Dec 18, 2024

mejsiejdev Dec 19, 2024

maciejkrol18 Dec 19, 2024

maciejkrol18 Dec 18, 2024

mejsiejdev commented Dec 19, 2024

maciejkrol18 left a comment •

edited

Loading

maciejkrol18 Dec 19, 2024

maciejkrol18 Dec 19, 2024

feat: create supervisor component #21

feat: create supervisor component #21

Conversation

mejsiejdev commented Dec 7, 2024 • edited Loading

chewmanji commented Dec 8, 2024 • edited Loading

mejsiejdev commented Dec 8, 2024 • edited Loading

chewmanji commented Dec 8, 2024

maciejkrol18 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

mejsiejdev commented Dec 19, 2024

maciejkrol18 left a comment • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

mejsiejdev commented Dec 7, 2024 •

edited

Loading

chewmanji commented Dec 8, 2024 •

edited

Loading

mejsiejdev commented Dec 8, 2024 •

edited

Loading

maciejkrol18 left a comment •

edited

Loading