add gql queries to fronted and test with getting agents + install material-tailwind UI library to use it to enhance the UI/UX

src/components/modals/agent_modal.tsx

@@ -179,7 +179,7 @@ export default function AgentModal(props: {
                     <img
                       src={agent?.image ?? "/sailor.png"}
                       alt="Software Engineer"
-                      className="w-full rounded-lg"
+                      className="w-7/12 mx-auto rounded-lg"
                     />
                   )}
                 </div>