feat : progress bar config for space is dynamic from api

src/components/progressSpace/index.tsx

@@ -19,21 +19,28 @@ const ProgressSpace = ({ startSpace, endSpace }: ProgressSpaceProps) => {
         <div className="w-full rounded-full h-2 md:h-2.5 bg-gray-700">
           <motion.div
             className="bg-secondTheme h-2 md:h-2.5 rounded-full"
-            animate={{ width: `${startSpacePercentage}%` }}
             initial={{ width: 0 }}
+            animate={{
+              width: `${
+                endSpace === "unlimited" ? 100 : startSpacePercentage
+              }%`,
+            }}
             transition={{ type: "tween", duration: 1 }}
             style={{ transformOrigin: "right" }}
           ></motion.div>
         </div>
         <div className="flex flex-row-reverse gap-1">
-          <span> {endSpace}</span>
-          <span>GB</span>
+          <span> {endSpace === "unlimited" ? "نامحدود" : endSpace}</span>
+          {endSpace !== "unlimited" && <span>GB</span>}
         </div>
       </div>
       <div className="w-full h-full mt-1 p-2 text-center text-xs md:text-base">
         <p>
           {" "}
-          حجم باقیمانده کانفیگ شما از {endSpace} گیگ <span className="mx-1 border-b border-secondTheme">{remaining}</span>گیگ میباشد{" "}
+          حجم باقیمانده کانفیگ شما از{" "}
+          {endSpace === "unlimited" ? "نامحدود" : endSpace} گیگ{" "}
+          <span className="mx-1 border-b border-secondTheme">{remaining}</span>
+          گیگ میباشد{" "}
         </p>
       </div>
     </>