task overview item updated

client/src/components/forms/TaskForm/index.tsx

@@ -102,7 +102,6 @@ export default function TaskForm({ task, onSubmit, project }: Props) {
 
     const handleSubmit = useCallback(async (e: FormEvent) => {
         e.preventDefault();
-        console.log(priority);
         
         if (validateName(name ?? '') === null &&
             validateText(text ?? '') === null &&
@@ -145,7 +144,7 @@ export default function TaskForm({ task, onSubmit, project }: Props) {
                 }
             </select>
 
-            <Picker onEmojiClick={(e, emoji) => setIcon(emoji.unified)} />
+            <Picker onEmojiClick={(e, emoji) => setIcon(emoji.originalUnified)} />
             <h2>Dependencies</h2>
             {
                 allTasks.length > 0 ? (

client/src/components/ui/AssigneeList/assignee-list.scss

-@use 'styles/settings.scss' as s;
+@use 'styles/settings.scss'as s;
 
 .assignee-list {
     display: flex;
@@ -10,17 +10,18 @@
     }
 
     .assignee,
-    .overhead {
-
+    .avatar {
         margin-left: -8px;
+        width: 35px;
+        height: 35px;
 
         img {
-            width: 35px;
-            height: 35px;
+            width: 100%;
             border-radius: 50%;
         }
 
     }
+
     .overhead {
         background: s.$primary;
         display: flex;

client/src/components/ui/Task/index.tsx

@@ -2,6 +2,8 @@ import './task.scss';
 import { Link } from 'react-router-dom';
 import AssigneeList from 'components/ui/AssigneeList';
 import { Task as ITask } from 'adapters/task';
+import { useEffect, useState } from 'react';
+import { getUser, User } from 'adapters/user';
 
 interface Props {
     task: ITask,
@@ -12,22 +14,22 @@ function formattedTime(date: Date) {
 }
 
 export default function Task({ task }: Props) {
+    const [assignees, setAssignees] = useState<User[]>([]);
     const start = new Date(200);
     const end = new Date(300);
 
-    const member = {
-        id: 'asdf',
-        username: 'testname',
-        realname: 'Roland Bernard',
-        role: 'Backend'
-    }
+    useEffect(() => {
+        task.assigned.forEach((assign) => {
+            getUser(assign.user).then((user) => setAssignees(state => [...state, user])).catch(() => {})
+        })
+    }, []);
 
     return (
         <Link to={'/tasks/' + task.id} className="task">
             <div className="project-indicator"></div>
             <div className="main-info">
                 <div className="icon-container">
-                    {task.icon}
+                {String.fromCharCode(parseInt(task.icon, 16))}
                 </div>
                 <div className="text-container">
                     <h4>{task.name}</h4>
@@ -37,7 +39,7 @@ export default function Task({ task }: Props) {
             <div className="description-container">
                 {task.text}
             </div>
-            <AssigneeList assignees={[member, member, member, member, member]} max={3} />
+            <AssigneeList assignees={assignees} max={3} />
 
         </Link>
     )