Feat:Added loading text to be replaced with animation after

Frontend/src/components/FarmList.jsx

@@ -3,7 +3,7 @@ import Td from "./Td";
 
 const FarmList = () => {
   const [data, setData] = useState([]);
-
+  const [loading, setLoading] = useState(true);
   useEffect(() => {
     fetch("http://localhost:8000/api/v1/farm", {
       credentials: "include",
@@ -12,11 +12,15 @@ const FarmList = () => {
     })
       .then((response) => response.json())
       .then((data) => setData(data))
+      .then(setLoading(false))
       .catch((error) => console.error(error));
   }, []);
 
   return (
     <div className="relative overflow-x-auto shadow-md sm:rounded-lg">
+      {loading ? (
+        <div>Loading...</div>
+      ) : (
         <table className="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
           <thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
             <tr>
@@ -49,6 +53,7 @@ const FarmList = () => {
             )}
           </tbody>
         </table>
+      )}
     </div>
   );
 };