add SVG

resources/js/components/toDos/ToDoIndex.tsx

@@ -5,6 +5,7 @@ import {Link} from "react-router-dom";
 import useTracker from "../../hooks/TraskerHook";
 import {Simulate} from "react-dom/test-utils";
 import load = Simulate.load;
+import {DraggableSVG, PlaySVG} from "../SVG";
 
 const ToDoIndex: FC<ToDoIndexProps> = ({reload, setReload}) => {
 
@@ -50,7 +51,7 @@ const ToDoIndex: FC<ToDoIndexProps> = ({reload, setReload}) => {
         {errorLabel()}
         <ul className="my-5">
             {toDos.map(toDo => <li key={toDo.id} className="flex gap-2">
-                <span>Move</span>
+                <span><DraggableSVG className="w-6" /></span>
                 <input type={"checkbox"}
                        checked={!!toDo.checked}
                        onChange={() =>toggleCheck(toDo)}
@@ -59,9 +60,10 @@ const ToDoIndex: FC<ToDoIndexProps> = ({reload, setReload}) => {
                       className={`${toDo.checked ? 'line-through' : ''} flex-1`}>
                     {toDo.name}
                 </Link>
-                {!toDo.checked && <span className="cursor-pointer"
+                {!toDo.checked && <span className="cursor-pointer flex items-center"
+                                        title="Commencer"
                                         onClick={() => startTrackToDo(toDo)}>
-                    Play
+                    <PlaySVG className="w-4" />
                 </span>}
             </li>)}
         </ul>