Repository: emirankorainc/bt-internship-fe
Pull request #10: [BT-37] Implemented Card User Component 
Author: login: AndNijaz
Created: 2025-04-26T12:22:12Z | Merged: 2025-05-20T17:17:05Z

ADDED:
- Features Folder
- Featuers/users  
- UserCard Component
- UserSkill Component
- ShadCN badge
- ShadCN card
- ShadCN avatar

![image](https://github.com/user-attachments/assets/199f6f0f-5d73-4afd-9c80-5dc4495a5d26)

https://bloomteq-internship-team4.atlassian.net/browse/BT-37


Diff:
diff --git a/Implemented b/Implemented
new file mode 100644
index 0000000..e69de29
diff --git a/app/components/types/user-card.types.ts b/app/components/types/user-card.types.ts
new file mode 100644
index 0000000..ad86586
--- /dev/null
+++ b/app/components/types/user-card.types.ts
@@ -0,0 +1,16 @@
+export interface Skill {
+  title: string;
+  level: number;
+}
+
+export interface Goal {
+  title: string;
+  level: number;
+}
+
+export interface UserCardProps {
+  name: string;
+  avatarUrl: string;
+  skills: Skill[];
+  currentGoals: Goal[];
+}
diff --git a/app/components/ui/avatar.tsx b/app/components/ui/avatar.tsx
new file mode 100644
index 0000000..7ffa109
--- /dev/null
+++ b/app/components/ui/avatar.tsx
@@ -0,0 +1,51 @@
+import * as React from "react"
+import * as AvatarPrimitive from "@radix-ui/react-avatar"
+
+import { cn } from "@app/lib/utils"
+
+function Avatar({
+  className,
+  ...props
+}: React.ComponentProps<typeof AvatarPrimitive.Root>) {
+  return (
+    <AvatarPrimitive.Root
+      data-slot="avatar"
+      className={cn(
+        "relative flex size-8 shrink-0 overflow-hidden rounded-full",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function AvatarImage({
+  className,
+  ...props
+}: React.ComponentProps<typeof AvatarPrimitive.Image>) {
+  return (
+    <AvatarPrimitive.Image
+      data-slot="avatar-image"
+      className={cn("aspect-square size-full", className)}
+      {...props}
+    />
+  )
+}
+
+function AvatarFallback({
+  className,
+  ...props
+}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {
+  return (
+    <AvatarPrimitive.Fallback
+      data-slot="avatar-fallback"
+      className={cn(
+        "bg-muted flex size-full items-center justify-center rounded-full",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export { Avatar, AvatarImage, AvatarFallback }
diff --git a/app/constants/example.ts b/app/constants/example.ts
index 428f9b5..d8f9010 100644
--- a/app/constants/example.ts
+++ b/app/constants/example.ts
@@ -1,3 +1,16 @@
+export const FAKE_USERCARD = {
+  id: 1,
+  name: 'Jonas Schm',
+  avatarUrl: 'https://github.com/shadcn.png',
+  skills: [
+    { title: 'Bus Analysis', level: 5 },
+    { title: 'Cloud Architect', level: 4 },
+  ],
+  currentGoals: [
+    { title: 'Cloud Architect', level: 5 },
+    { title: 'Cloud Architect', level: 6 },
+  ],
+
 import { RoleType, UserType } from '../types/types';
 
 export const fake_users: UserType[] = [
@@ -286,6 +299,7 @@ export const USER_TABLE_COLUMNS: Array<keyof UserType> = [
   'role',
   'status',
 ];
+
 export const FAKE_BUCKET = {
   title: 'Software Engineer',
   description:
diff --git a/app/features/users/UserCard.tsx b/app/features/users/UserCard.tsx
new file mode 100644
index 0000000..a104155
--- /dev/null
+++ b/app/features/users/UserCard.tsx
@@ -0,0 +1,52 @@
+import { UserCardProps } from '@app/components/types/user-card.types';
+import { Avatar, AvatarFallback, AvatarImage } from '../../components/ui/avatar';
+import { Button } from '../../components/ui/button';
+import { Card, CardFooter } from '../../components/ui/card';
+import { UserSkill } from './UserSkill';
+import { FAKE_USERCARD } from '@app/constants/example';
+
+export const UserCard = ({ userInfo }: { userInfo: UserCardProps }) => {
+  const user = userInfo || FAKE_USERCARD;
+
+  return (
+    <Card className="flex w-64 flex-col items-center gap-4 rounded-3xl border-2 border-black p-4 pt-8">
+      <Avatar className="h-24 w-24 border-2 border-black">
+        <AvatarImage src={user.avatarUrl} />
+        <AvatarFallback className="bg-white"></AvatarFallback>
+      </Avatar>
+
+      <div className="w-full text-center">
+        <h3 className="mb-4 text-xl font-medium">{user.name}</h3>
+
+        <div className="mb-6 flex flex-col gap-2">
+          {user.skills.length > 0 ? (
+            user.skills.map((skill, index) => (
+              <UserSkill
+                key={index}
+                skill={`${skill.level} ${skill.title}`}
+                background={index % 2 === 0 ? 'bg-gray-200' : ''}
+              />
+            ))
+          ) : (
+            <p>User doesn't have skills.</p>
+          )}
+        </div>
+
+        <div className="mb-4 text-left text-sm">
+          {user.currentGoals.length > 0 && <p className="font-medium">Current Goal:</p>}
+          {user.currentGoals.map((goal, index) => (
+            <p key={index}>
+              {goal.title} {goal.level}
+            </p>
+          ))}
+        </div>
+      </div>
+
+      <CardFooter className="flex w-full flex-col p-0">
+        <Button variant="outline" className="w-full rounded-md border-black">
+          See Full
+        </Button>
+      </CardFooter>
+    </Card>
+  );
+};
diff --git a/app/features/users/UserSkill.tsx b/app/features/users/UserSkill.tsx
new file mode 100644
index 0000000..9387169
--- /dev/null
+++ b/app/features/users/UserSkill.tsx
@@ -0,0 +1,16 @@
+import { Badge } from '@app/components/ui/badge';
+import classNames from 'classnames';
+
+export const UserSkill = ({ skill, background }: { skill: string; background?: string }) => {
+  return (
+    <Badge
+      variant="secondary"
+      className={classNames('w-full justify-center rounded-md px-3 py-1 font-medium text-black', {
+        'bg-gray-200 hover:bg-gray-200': background,
+        'bg-gray-300 hover:bg-gray-300': !background,
+      })}
+    >
+      {skill}
+    </Badge>
+  );
+};
diff --git a/package-lock.json b/package-lock.json
index 9e2ba0f..5ed652b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,8 @@
       "name": "bt-internship-fe",
       "version": "0.0.0",
       "dependencies": {
+        "@heroicons/react": "^2.2.0",
+        "@radix-ui/react-avatar": "^1.1.9",
         "@radix-ui/react-dialog": "^1.1.11",
         "@radix-ui/react-dropdown-menu": "^2.1.14",
         "@radix-ui/react-select": "^2.2.4",
@@ -2382,6 +2384,22 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-avatar": {
+      "version": "1.1.9",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-avatar/-/react-avatar-1.1.9.tgz",
+      "integrity": "sha512-10tQokfvZdFvnvDkcOJPjm2pWiP8A0R4T83MoD7tb15bC/k2GU7B1YBuzJi8lNQ8V1QqhP8ocNqp27ByZaNagQ==",
+      "dependencies": {
+        "@radix-ui/react-context": "1.1.2",
+        "@radix-ui/react-primitive": "2.1.2",
+        "@radix-ui/react-use-callback-ref": "1.1.1",
+        "@radix-ui/react-use-is-hydrated": "0.1.0",
+        "@radix-ui/react-use-layout-effect": "1.1.1"
+    "node_modules/@radix-ui/primitive": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.1.2.tgz",
+      "integrity": "sha512-XnbHrrprsNqZKQhStrSwgRUQzoCI1glLzdw79xiZPoofhGICeZRSQ3dIxAKH1gb3OHfNf4d6f+vAv3kil2eggA=="
+    },
+    "node_modules/@radix-ui/react-arrow": {
     "node_modules/@radix-ui/react-presence": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.4.tgz",
@@ -2444,6 +2462,16 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-primitive": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.1.2.tgz",
+      "integrity": "sha512-uHa+l/lKfxuDD2zjN/0peM/RhhSmRjr5YWdk/37EnSv1nJ88uvG85DPexSm8HdFQROd2VdERJ6ynXbkCFi+APw==",
+      "dependencies": {
+        "@radix-ui/react-slot": "1.2.2"
+    "node_modules/@radix-ui/react-dialog": {
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-dialog/-/react-dialog-1.1.11.tgz",
+      "integrity": "sha512-yI7S1ipkP5/+99qhSI6nthfo/tR6bL6Zgxi/+1UO6qPa6UeM6nlafWcQ65vB4rU2XjgjMfMhI3k9Y5MztA62VQ==",
     "node_modules/@radix-ui/react-roving-focus": {
       "version": "1.1.9",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-roving-focus/-/react-roving-focus-1.1.9.tgz",
@@ -2863,6 +2891,12 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-use-is-hydrated": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-is-hydrated/-/react-use-is-hydrated-0.1.0.tgz",
+      "integrity": "sha512-U+UORVEq+cTnRIaostJv9AGdV3G6Y+zbVd+12e18jQ5A3c0xL03IhnHuiU4UV69wolOQp5GfR58NW/EgdQhwOA==",
+      "dependencies": {
+        "use-sync-external-store": "^1.5.0"
     "node_modules/@radix-ui/react-use-controllable-state": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.2.2.tgz",
@@ -3827,6 +3861,7 @@
       }
     },
     "node_modules/@types/react-dom": {
+
       "version": "19.1.2",
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.1.2.tgz",
       "integrity": "sha512-XGJkWF41Qq305SKWEILa1O8vzhb3aOo3ogBlSmiqNko/WmRb6QIaweuZCXjKygVDXpzXb5wyxKTSOsmkuqj+Qw==",
@@ -10509,6 +10544,12 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/use-sync-external-store": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.5.0.tgz",
+      "integrity": "sha512-Rb46I4cGGVBmjamjphe8L/UnvJD+uPPtTkNvX5mZgqdbavhI4EbgIWJiIHXJ8bc/i9EQGPRh4DwEURJ552Do0A==",
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
     "node_modules/use-callback-ref": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.3.3.tgz",
diff --git a/package.json b/package.json
index 70b27b1..f43e151 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@heroicons/react": "^2.2.0",
+    "@radix-ui/react-avatar": "^1.1.9",
     "@radix-ui/react-dialog": "^1.1.11",
     "@radix-ui/react-dropdown-menu": "^2.1.14",
     "@radix-ui/react-select": "^2.2.4",


Reviews:
user: login: emirankorainc
state: CHANGES_REQUESTED
author_association: OWNER
submitted_at: 2025-05-06T06:43:57Z
user: login: emirankorainc
state: APPROVED
author_association: OWNER
submitted_at: 2025-05-16T14:43:46Z
user: login: amilanedzibovic
state: APPROVED
author_association: COLLABORATOR
submitted_at: 2025-05-20T17:00:00Z

Review comments:
diff_hunk: @@ -0,0 +1,18 @@
+import { Badge } from '@app/components/ui/badge';
+
+export const UserSkill = ({
+  skill,
+  background,
+}: {
+  skill: string;
+  background?: string;
+}) => {
+  return (
+    <Badge
+      variant="secondary"
+      className={`= w-full justify-center rounded-md px-3 py-1 font-medium text-black ${background ? 'bg-gray-200 hover:bg-gray-200' : 'bg-gray-300 hover:bg-gray-300'}`}
path: app/features/users/UserSkill.tsx
user: login: emirankorainc
body: We don't need `=` here ? 
created_at: 2025-05-06T06:21:29Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,18 @@
+import { Badge } from '@app/components/ui/badge';
+
+export const UserSkill = ({
+  skill,
+  background,
+}: {
+  skill: string;
+  background?: string;
+}) => {
+  return (
+    <Badge
+      variant="secondary"
+      className={`= w-full justify-center rounded-md px-3 py-1 font-medium text-black ${background ? 'bg-gray-200 hover:bg-gray-200' : 'bg-gray-300 hover:bg-gray-300'}`}
path: app/features/users/UserSkill.tsx
user: login: emirankorainc
body: I would recommend you to install `classnames` and for example write it like this: 

`    className={classNames(
        'w-full justify-center rounded-md px-3 py-1 font-medium text-black',
        {
          'bg-gray-200 hover:bg-gray-200': background,
          'bg-gray-300 hover:bg-gray-300': !background,
        }
      )}` 
created_at: 2025-05-06T06:25:41Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,78 @@
+import { AvatarImage } from '@radix-ui/react-avatar';
+import { Avatar, AvatarFallback } from '../../components/ui/avatar';
+import { Button } from '../../components/ui/button';
+import { Card, CardFooter } from '../../components/ui/card';
+import { UserSkill } from './UserSkill';
+
+const FAKE_USERCARD = {
+  id: 1,
+  name: 'Jonas Schm',
+  avatar: 'https://github.com/shadcn.png',
+  skills: [
+    { title: 'Bus Analysis', level: 5 },
+    { title: 'Cloud Architect', level: 4 },
+  ],
+  currentGoals: [
+    { title: 'Cloud Architect', level: 5 },
+    { title: 'Cloud Architect', level: 6 },
+  ],
+  buttonText: 'See Full',
+};
+
+interface Skill {
+  title: string;
+  level: number;
+}
+
+interface Goal {
+  title: string;
+  level: number;
+}
+
+interface UserCardProp {
path: app/features/users/UserCard.tsx
user: login: emirankorainc
body: I would rename it to `UserCardProps`
created_at: 2025-05-06T06:32:46Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,78 @@
+import { AvatarImage } from '@radix-ui/react-avatar';
+import { Avatar, AvatarFallback } from '../../components/ui/avatar';
+import { Button } from '../../components/ui/button';
+import { Card, CardFooter } from '../../components/ui/card';
+import { UserSkill } from './UserSkill';
+
+const FAKE_USERCARD = {
+  id: 1,
+  name: 'Jonas Schm',
+  avatar: 'https://github.com/shadcn.png',
+  skills: [
+    { title: 'Bus Analysis', level: 5 },
+    { title: 'Cloud Architect', level: 4 },
+  ],
+  currentGoals: [
+    { title: 'Cloud Architect', level: 5 },
+    { title: 'Cloud Architect', level: 6 },
+  ],
+  buttonText: 'See Full',
+};
+
+interface Skill {
+  title: string;
+  level: number;
+}
+
+interface Goal {
+  title: string;
+  level: number;
+}
+
+interface UserCardProp {
+  name: string;
+  avatarUrl: string;
+  skills: Skill[];
+  currentGoals: Goal[];
+}
+
+export const UserCard = ({ userInfo }: { userInfo: UserCardProp }) => {
+  const user = userInfo || FAKE_USERCARD;
+
+  return (
+    <Card className="flex w-64 flex-col items-center gap-4 rounded-3xl border-2 border-black p-4 pt-8">
+      <Avatar className="h-24 w-24 border-2 border-black">
+        <AvatarImage src="https://github.com/shadcn.png" />
path: app/features/users/UserCard.tsx
user: login: emirankorainc
body: Can we use here `{user.avatarUrl}` ? 
created_at: 2025-05-06T06:33:38Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,78 @@
+import { AvatarImage } from '@radix-ui/react-avatar';
+import { Avatar, AvatarFallback } from '../../components/ui/avatar';
+import { Button } from '../../components/ui/button';
+import { Card, CardFooter } from '../../components/ui/card';
+import { UserSkill } from './UserSkill';
+
+const FAKE_USERCARD = {
+  id: 1,
+  name: 'Jonas Schm',
+  avatar: 'https://github.com/shadcn.png',
+  skills: [
+    { title: 'Bus Analysis', level: 5 },
+    { title: 'Cloud Architect', level: 4 },
+  ],
+  currentGoals: [
+    { title: 'Cloud Architect', level: 5 },
+    { title: 'Cloud Architect', level: 6 },
+  ],
+  buttonText: 'See Full',
+};
+
+interface Skill {
+  title: string;
+  level: number;
+}
+
+interface Goal {
+  title: string;
+  level: number;
+}
+
+interface UserCardProp {
+  name: string;
+  avatarUrl: string;
+  skills: Skill[];
+  currentGoals: Goal[];
+}
+
+export const UserCard = ({ userInfo }: { userInfo: UserCardProp }) => {
+  const user = userInfo || FAKE_USERCARD;
+
+  return (
+    <Card className="flex w-64 flex-col items-center gap-4 rounded-3xl border-2 border-black p-4 pt-8">
+      <Avatar className="h-24 w-24 border-2 border-black">
+        <AvatarImage src="https://github.com/shadcn.png" />
+        <AvatarFallback className="bg-white"></AvatarFallback>
+      </Avatar>
+
+      <div className="w-full text-center">
+        <h3 className="mb-4 text-xl font-medium">{user.name}</h3>
+
+        <div className="mb-6 flex flex-col gap-2">
+          {user.skills.map((skill, i) => (
+            <UserSkill
+              skill={`${skill.level} ${skill.title}`}
+              background={i % 2 === 0 ? 'bg-gray-200' : ''}
+            />
+          ))}
+        </div>
+
+        <div className="mb-4 text-left text-sm">
+          <p className="font-medium">Current Goal:</p>
+          {user.currentGoals.map((goal) => (
+            <p>
+              {goal.title} {goal.level}
+            </p>
path: app/features/users/UserCard.tsx
user: login: emirankorainc
body: React requires unique keys → missing here in both to prevent warnings in Console.

I would also rename `i` to `index`

And for example: 
` (goal) ` => ` (goal, index)` 
`<p key={index_goal.title} ` ... something like this
created_at: 2025-05-06T06:37:35Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,78 @@
+import { AvatarImage } from '@radix-ui/react-avatar';
+import { Avatar, AvatarFallback } from '../../components/ui/avatar';
+import { Button } from '../../components/ui/button';
+import { Card, CardFooter } from '../../components/ui/card';
+import { UserSkill } from './UserSkill';
+
+const FAKE_USERCARD = {
+  id: 1,
+  name: 'Jonas Schm',
+  avatar: 'https://github.com/shadcn.png',
+  skills: [
+    { title: 'Bus Analysis', level: 5 },
+    { title: 'Cloud Architect', level: 4 },
+  ],
+  currentGoals: [
+    { title: 'Cloud Architect', level: 5 },
+    { title: 'Cloud Architect', level: 6 },
+  ],
+  buttonText: 'See Full',
+};
+
+interface Skill {
+  title: string;
+  level: number;
+}
+
+interface Goal {
+  title: string;
+  level: number;
+}
+
+interface UserCardProp {
+  name: string;
+  avatarUrl: string;
+  skills: Skill[];
+  currentGoals: Goal[];
+}
+
+export const UserCard = ({ userInfo }: { userInfo: UserCardProp }) => {
+  const user = userInfo || FAKE_USERCARD;
+
+  return (
+    <Card className="flex w-64 flex-col items-center gap-4 rounded-3xl border-2 border-black p-4 pt-8">
+      <Avatar className="h-24 w-24 border-2 border-black">
+        <AvatarImage src="https://github.com/shadcn.png" />
+        <AvatarFallback className="bg-white"></AvatarFallback>
+      </Avatar>
+
+      <div className="w-full text-center">
+        <h3 className="mb-4 text-xl font-medium">{user.name}</h3>
+
+        <div className="mb-6 flex flex-col gap-2">
+          {user.skills.map((skill, i) => (
+            <UserSkill
+              skill={`${skill.level} ${skill.title}`}
+              background={i % 2 === 0 ? 'bg-gray-200' : ''}
+            />
+          ))}
+        </div>
path: app/features/users/UserCard.tsx
user: login: emirankorainc
body:  I'm not sure, does user have `skills` always ? If that is not case, then consider also
 something like this `: <example>No skills</example>` 
created_at: 2025-05-06T06:40:41Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,78 @@
+import { AvatarImage } from '@radix-ui/react-avatar';
+import { Avatar, AvatarFallback } from '../../components/ui/avatar';
+import { Button } from '../../components/ui/button';
+import { Card, CardFooter } from '../../components/ui/card';
+import { UserSkill } from './UserSkill';
+
+const FAKE_USERCARD = {
+  id: 1,
+  name: 'Jonas Schm',
+  avatar: 'https://github.com/shadcn.png',
+  skills: [
+    { title: 'Bus Analysis', level: 5 },
+    { title: 'Cloud Architect', level: 4 },
+  ],
+  currentGoals: [
+    { title: 'Cloud Architect', level: 5 },
+    { title: 'Cloud Architect', level: 6 },
+  ],
+  buttonText: 'See Full',
+};
+
path: app/features/users/UserCard.tsx
user: login: emirankorainc
body: Please move this to another file :) 
created_at: 2025-05-06T06:41:17Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,78 @@
+import { AvatarImage } from '@radix-ui/react-avatar';
+import { Avatar, AvatarFallback } from '../../components/ui/avatar';
+import { Button } from '../../components/ui/button';
+import { Card, CardFooter } from '../../components/ui/card';
+import { UserSkill } from './UserSkill';
+
+const FAKE_USERCARD = {
+  id: 1,
+  name: 'Jonas Schm',
+  avatar: 'https://github.com/shadcn.png',
+  skills: [
+    { title: 'Bus Analysis', level: 5 },
+    { title: 'Cloud Architect', level: 4 },
+  ],
+  currentGoals: [
+    { title: 'Cloud Architect', level: 5 },
+    { title: 'Cloud Architect', level: 6 },
+  ],
+  buttonText: 'See Full',
+};
+
+interface Skill {
+  title: string;
+  level: number;
+}
+
+interface Goal {
+  title: string;
+  level: number;
+}
+
+interface UserCardProp {
path: app/features/users/UserCard.tsx
user: login: emirankorainc
body: Also if we need some of these types for later in some other files, I would move it to new folder `types/...` 
and export them from there and use it here
created_at: 2025-05-06T06:42:48Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,51 @@
+import * as React from "react"
path: app/components/ui/avatar.tsx
user: login: emirankorainc
body: Consider renaming files to `Avatar.tsx` , ... 
created_at: 2025-05-06T06:43:51Z
author_association: OWNER

PR comments:
user: login: AndNijaz
created_at: 2025-04-26T12:28:25Z
body: Ne znam sta se dasava sa ovim mergeom...

author_association: COLLABORATOR
user: login: emirankorainc
created_at: 2025-05-09T08:51:31Z
body: @AndNijaz 

You have conflicts here :) 
author_association: OWNER
user: login: AndNijaz
created_at: 2025-05-20T13:36:12Z
body: Can I merge?

author_association: COLLABORATOR
user: login: amilanedzibovic
created_at: 2025-05-20T16:59:44Z
body: > Can I merge?

Sure, you can merge whatever is approved. 😄 
author_association: COLLABORATOR