diff --git a/components/InfoBlock.tsx b/components/InfoBlock.tsx
index 147c736..729be49 100644
--- a/components/InfoBlock.tsx
+++ b/components/InfoBlock.tsx
@@ -1,21 +1,21 @@
-'use client';
+"use client";
 // NextJs components
-import Image from 'next/image';
-import Link from 'next/link';
+import Image from "next/image";
+import Link from "next/link";
 // React query
-import { useQuery } from '@tanstack/react-query';
-import { Queries } from '@/api/queries';
+import { useQuery } from "@tanstack/react-query";
+import { Queries } from "@/api/queries";
 // Components
-import Loader from './Loader';
-import VideoPlayer from './VideoPlayer';
-import SectionTitle from './SectionTitle';
+import Loader from "./Loader";
+import VideoPlayer from "./VideoPlayer";
+import SectionTitle from "./SectionTitle";
 // Images and cions
-import { SlEye } from 'react-icons/sl';
-import aydym from '@/public/aydym-com.webp';
-import horjun from '@/public/horjun.png';
-import belet from '@/public/belet.jpg';
+import { SlEye } from "react-icons/sl";
+import aydym from "@/public/aydym-com.webp";
+import horjun from "@/public/horjun.png";
+import belet from "@/public/belet.jpg";
 
-import ReactionsBlock from './treasury/ReactionsBlock';
+import ReactionsBlock from "./treasury/ReactionsBlock";
 
 interface IProps {
   video_id: number;
@@ -23,11 +23,16 @@ interface IProps {
 
 const InfoBlock = ({ video_id }: IProps) => {
   const { data, isFetching, error } = useQuery({
-    queryKey: ['video', video_id],
+    queryKey: ["video", video_id],
     queryFn: () => Queries.getVideo(video_id),
   });
 
-  if (isFetching) return <Loader height={200} />;
+  if (isFetching)
+    return (
+      <div className="w-full h-[500px] sm:h-[667px] md:h-[600px] l flex items-center justify-center">
+        <Loader height={700} />
+      </div>
+    );
   if (error) return <h1>{JSON.stringify(error)}</h1>;
 
   return (
@@ -39,7 +44,9 @@ const InfoBlock = ({ video_id }: IProps) => {
               <SectionTitle title={data!.data.title} />
               <div className="flex gap-2 items-center">
                 <SlEye
-                  style={{ transition: '150ms all cubic-bezier(0.4, 0, 0.2, 1)' }}
+                  style={{
+                    transition: "150ms all cubic-bezier(0.4, 0, 0.2, 1)",
+                  }}
                   width={30}
                   height={18}
                   className="w-[30px] h-[18px]"
@@ -52,12 +59,18 @@ const InfoBlock = ({ video_id }: IProps) => {
             <div className="flex flex-col gap-[40px] h-full  w-full">
               <div className="flex gap-[40px] md:flex-row flex-col  h-full  w-full">
                 <div>
-                  <VideoPlayer video_id={video_id} maxHeight="700px" maxWidth="100%" />
+                  <VideoPlayer
+                    video_id={video_id}
+                    maxHeight="700px"
+                    maxWidth="100%"
+                  />
                 </div>
 
                 <div className="flex flex-col gap-6">
                   {data?.data.desc ? (
-                    <p className="font-roboto text-lg w-full text-black">{data!.data.desc}</p>
+                    <p className="font-roboto text-lg w-full text-black">
+                      {data!.data.desc}
+                    </p>
                   ) : null}
 
                   <ReactionsBlock video_id={video_id} />
@@ -66,15 +79,22 @@ const InfoBlock = ({ video_id }: IProps) => {
                   data?.data.horjun_content_url ||
                   data?.data.belet_url ? (
                     <div className="flex flex-col gap-6">
-                      <h2 className="text-2xl font-semibold">Beýleki platformalarda seret:</h2>
+                      <h2 className="text-2xl font-semibold">
+                        Beýleki platformalarda seret:
+                      </h2>
                       <div className="flex gap-11 items-center">
                         {data?.data.aydym_com_url ? (
                           <Link
                             href={data?.data.aydym_com_url}
                             target="_blank"
-                            className="flex flex-col items-center justify-center gap-2">
+                            className="flex flex-col items-center justify-center gap-2"
+                          >
                             <div className="relative h-16 w-16 flex items-center justify-center overflow-hidden border-[#00AEFF] border-[1.5px] p-2 rounded-full">
-                              <Image src={aydym} alt="Aydym.com" className="rounded-full" />
+                              <Image
+                                src={aydym}
+                                alt="Aydym.com"
+                                className="rounded-full"
+                              />
                             </div>
                             <h3>Aydym.com</h3>
                           </Link>
@@ -83,9 +103,14 @@ const InfoBlock = ({ video_id }: IProps) => {
                           <Link
                             href={data?.data.horjun_content_url}
                             target="_blank"
-                            className="flex flex-col items-center justify-center gap-2">
+                            className="flex flex-col items-center justify-center gap-2"
+                          >
                             <div className="relative h-16 w-16 flex items-center justify-center overflow-hidden border-[#00AEFF] border-[1.5px] p-2 rounded-full">
-                              <Image src={horjun} alt="HorjunTv" className="rounded-full" />
+                              <Image
+                                src={horjun}
+                                alt="HorjunTv"
+                                className="rounded-full"
+                              />
                             </div>
                             <h3>HorjunTv</h3>
                           </Link>
@@ -94,9 +119,14 @@ const InfoBlock = ({ video_id }: IProps) => {
                           <Link
                             href={data.data.belet_url}
                             target="_blank"
-                            className="flex flex-col items-center justify-center gap-2">
+                            className="flex flex-col items-center justify-center gap-2"
+                          >
                             <div className="relative h-16 w-16 flex items-center justify-center overflow-hidden border-[#00AEFF] border-[1.5px] p-2 rounded-full">
-                              <Image src={belet} alt="BeletTv" className="rounded-full" />
+                              <Image
+                                src={belet}
+                                alt="BeletTv"
+                                className="rounded-full"
+                              />
                             </div>
                             <h3>BeletFilm</h3>
                           </Link>
diff --git a/components/VideoPlayer.tsx b/components/VideoPlayer.tsx
index 1c57c28..f160d1f 100644
--- a/components/VideoPlayer.tsx
+++ b/components/VideoPlayer.tsx
@@ -28,7 +28,11 @@ const VideoPlayer = ({ maxHeight, maxWidth, video_id }: IProps) => {
     queryKey: ["video", `video:${video_id}`],
     queryFn: async () => {
       const response = await Queries.getVideo(video_id);
-      // setCanDownload(response.data.canDownload); // Set canDownload from API
+      if (response.data.is_downloadable === 0) {
+        setCanDownload(false);
+      } else {
+        setCanDownload(true);
+      } // Set canDownload from API
       return response;
     },
   });
@@ -48,7 +52,12 @@ const VideoPlayer = ({ maxHeight, maxWidth, video_id }: IProps) => {
     }
   };
 
-  if (isFetching) return <Loader height={700} />;
+  if (isFetching)
+    return (
+      <div className="lg:w-[700px] md:w-[550px] w-full h-[200px] sm:h-[250px] md:h-[350px] lg:h-[420px] flex items-center justify-center">
+        <Loader height={700} />
+      </div>
+    );
   if (error) return <h1>{JSON.stringify(error)}</h1>;
 
   return (
diff --git a/models/video.model.ts b/models/video.model.ts
index c8571a2..e8105bb 100644
--- a/models/video.model.ts
+++ b/models/video.model.ts
@@ -18,4 +18,5 @@ export interface Data {
   video_stream_url: string;
   likes: number;
   dislikes: number;
+  is_downloadable: 0 | 1;
 }