diff --git a/src/component/mymedia/MyMedia.js b/src/component/mymedia/MyMedia.js
index aff659f..8eb9b70 100644
--- a/src/component/mymedia/MyMedia.js
+++ b/src/component/mymedia/MyMedia.js
@@ -1,6 +1,9 @@
 import React from "react";
 import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
 import {useState, useRef} from "react";
+import {useQuery} from "@tanstack/react-query";
+import queryKeys from "../../services/queryKeys";
+import {getMediaFileList} from "../../services/services";
 
 export default function MyMedia() {
     const basePath = process.env.REACT_APP_MAIN_API
@@ -51,6 +54,22 @@ export default function MyMedia() {
         }
     }
 
+
+    const {data, isFetching, isError, error} = useQuery({
+        queryKey: queryKeys.my_files,
+        queryFn: () => {
+            let reqData = {
+                token: localStorage.getItem('token'), // USER TOKEN
+                uid: localStorage.getItem('uid') // USER UID
+            }
+            return getMediaFileList(reqData)
+        }
+    })
+
+    const mediaFileList = data?.data
+
+    //debugger;
+
     return (
         <>
             <BreadcrumbComBS title='Files' paths={['Dashboard', 'Files']}/>
@@ -70,7 +89,6 @@ export default function MyMedia() {
                                     <input className="form-control form-control-sm" type="file"
                                            onChange={handleFileChange}/>
 
-
                                     {selectedFile && (
                                         <div>
                                             <h4>Selected File Details:</h4>
@@ -88,7 +106,6 @@ export default function MyMedia() {
                                             </>
                                         </div>
 
-
                                     )}
                                 </div>
 
@@ -107,61 +124,29 @@ export default function MyMedia() {
                             </div>
                         </div>
                         <div className="card-body scrollbar scroll_dark">
-                            <div className="widget-text">
-                                <div className="media align-items-center">
-                                    <img src="assets/img/file-icon/ai.png" className="img-fluid" alt="avi"/>
-                                    <div className="media-body">
-                                        <h4 className="mb-0 ml-3">Mentor_demo.avi</h4>
-                                    </div>
-                                    <div>
-                                        <a href="" className="btn btn-icon btn-round btn-outline-success">
-                                            <i className="ti ti-download"></i>
-                                        </a>
-                                        <a href="" className="btn btn-icon btn-round btn-outline-danger ml-2">
-                                            <i className="ti ti-close"></i>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
+                            {mediaFileList && mediaFileList?.file_list && mediaFileList?.file_list.map((item, index) => {
+                                const file_url = (mediaFileList?.media_server + "/" + item?.file_group + "/" + item?.file_uid + "/" + item.filename).toLowerCase();
 
-
-                            <div className="widget-text">
-                                <div className="media align-items-center">
-                                    <img src="assets/img/file-icon/dwg.png" className="img-fluid" alt="dwg"/>
-                                    <div className="media-body">
-                                        <h4 className="mb-0 ml-3">Mentor_demo.dwg</h4>
+                                return (<div className="widget-text">
+                                    <div className="media align-items-center">
+                                        <img src={`assets/img/file-icon/${item.file_type}.png`} className="img-fluid"
+                                             alt={`${item.file_type}`}/>
+                                        <div className="media-body">
+                                            <h4 className="mb-0 ml-3">{item.filename}</h4>
+                                        </div>
+                                        <div>
+                                            <a href={`${file_url}`}
+                                               className="btn btn-icon btn-round btn-outline-success">
+                                                <i className="ti ti-download"></i>
+                                            </a>
+                                            <a href="" className="btn btn-icon btn-round btn-outline-danger ml-2">
+                                                <i className="ti ti-close"></i>
+                                            </a>
+                                        </div>
                                     </div>
-                                    <div>
-                                        <a href="javascript:void(0)"
-                                           className="btn btn-icon btn-round btn-outline-success">
-                                            <i className="ti ti-download"></i>
-                                        </a>
-                                        <a href="javascript:void(0)"
-                                           className="btn btn-icon btn-round btn-outline-danger ml-2">
-                                            <i className="ti ti-close"></i>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
-
-                            <div className="widget-text">
-                                <div className="media align-items-center">
-                                    <img src="assets/img/file-icon/exe.png" className="img-fluid" alt="exe"/>
-                                    <div className="media-body">
-                                        <h4 className="mb-0 ml-3">Mentor_demo.exe</h4>
-                                    </div>
-                                    <div>
-                                        <a href="javascript:void(0)"
-                                           className="btn btn-icon btn-round btn-outline-success">
-                                            <i className="ti ti-download"></i>
-                                        </a>
-                                        <a href="javascript:void(0)"
-                                           className="btn btn-icon btn-round btn-outline-danger ml-2">
-                                            <i className="ti ti-close"></i>
-                                        </a>
-                                    </div>
-                                </div>
-                            </div>
+                                </div>)
+                            })
+                            }
                         </div>
                     </div>
                 </div>
diff --git a/src/component/subscription/Subscription.jsx b/src/component/subscription/Subscription.jsx
index f51cc2b..e6d4e8e 100644
--- a/src/component/subscription/Subscription.jsx
+++ b/src/component/subscription/Subscription.jsx
@@ -57,7 +57,7 @@ export default function Subscription() {
                                         <h2 className="text-primary pt-3">{currentSubscription?.display_name}</h2>
                                     </div>
                                     <div className="pt-2" style={{textAlign: 'left'}}>
-                                        <div style={{fontSize: '12px', fontWeight: 'bolder' , color: "#3E3699"  }}>
+                                        <div style={{fontSize: '12px', fontWeight: 'bolder', color: "#3E3699"}}>
                                             Next Payment: {getDateTimeFromDateString(currentSubscription?.next_payment)}
                                         </div>
                                     </div>
diff --git a/src/services/queryKeys.js b/src/services/queryKeys.js
index d7a0346..550a695 100644
--- a/src/services/queryKeys.js
+++ b/src/services/queryKeys.js
@@ -11,6 +11,7 @@ const queryKeys = {
     productTemplateData: ['product_template_data'],
     subscriptions: ['subscriptions'],
     profile_data: ['profile_data'],
+    my_files: ['my_files'],
     
     dashboard: ['dashboard'],
     topBar: ['top-bar'],
diff --git a/src/services/services.js b/src/services/services.js
index 9b4616c..eafca0c 100644
--- a/src/services/services.js
+++ b/src/services/services.js
@@ -277,6 +277,13 @@ export const getSubscriptions = (reqData) => {
     return postAuxEnd(`/panel/subscription/products`, postData, false)
 }
 
+export const getMediaFileList = (reqData) => {
+    let postData = {
+        ...reqData,
+    }
+    return postAuxEnd(`/panel/account/media-files`, postData, false)
+}
+
 // FUNCTION TO GET COMMON PRACTICE
 export const getCommonPractice = (reqData) => {
     let postData = {