diff --git a/web/src/assets/svg/file-icon/aep.svg b/web/src/assets/svg/file-icon/aep.svg
new file mode 100644
index 0000000000000000000000000000000000000000..fcf26db8a5ce984d224292a232a6c3952b8a6d1f
--- /dev/null
+++ b/web/src/assets/svg/file-icon/aep.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="27" height="16" rx="2" fill="#6938EF" />
+    <path
+        d="M6.34659 30H4.69886L7.20952 22.7273H9.19105L11.6982 30H10.0504L8.22869 24.3892H8.17188L6.34659 30ZM6.24361 27.1413H10.1357V28.3416H6.24361V27.1413ZM12.5735 30V22.7273H17.4741V23.995H14.1112V25.728H17.2219V26.9957H14.1112V28.7322H17.4883V30H12.5735ZM18.6966 30V22.7273H21.5659C22.1175 22.7273 22.5874 22.8326 22.9757 23.0433C23.3639 23.2517 23.6599 23.5417 23.8635 23.9134C24.0694 24.2827 24.1724 24.7088 24.1724 25.1918C24.1724 25.6747 24.0682 26.1009 23.8599 26.4702C23.6516 26.8395 23.3497 27.1271 22.9544 27.3331C22.5614 27.5391 22.0855 27.642 21.5268 27.642H19.698V26.4098H21.2782C21.5742 26.4098 21.818 26.3589 22.0098 26.2571C22.2039 26.1529 22.3483 26.0097 22.443 25.8274C22.5401 25.6428 22.5886 25.4309 22.5886 25.1918C22.5886 24.9503 22.5401 24.7396 22.443 24.5597C22.3483 24.3774 22.2039 24.2365 22.0098 24.1371C21.8156 24.0353 21.5694 23.9844 21.2711 23.9844H20.2342V30H18.6966Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/ai.svg b/web/src/assets/svg/file-icon/ai.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4e2bf68aa6ba894dcca784d85f95aaf4e9f1cf26
--- /dev/null
+++ b/web/src/assets/svg/file-icon/ai.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="17" height="16" rx="2" fill="#E04F16" />
+    <path
+        d="M6.24405 30H4.59632L7.10698 22.7273H9.08851L11.5956 30H9.94789L8.12615 24.3892H8.06934L6.24405 30ZM6.14107 27.1413H10.0331V28.3416H6.14107V27.1413ZM14.0086 22.7273V30H12.471V22.7273H14.0086Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/avi.svg b/web/src/assets/svg/file-icon/avi.svg
new file mode 100644
index 0000000000000000000000000000000000000000..7225956cf39ed46112af1328f75eee788760c957
--- /dev/null
+++ b/web/src/assets/svg/file-icon/avi.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="23" height="16" rx="2" fill="#155EEF" />
+    <path
+        d="M5.95792 30H4.31019L6.82085 22.7273H8.80238L11.3095 30H9.66175L7.84002 24.3892H7.7832L5.95792 30ZM5.85494 27.1413H9.74698V28.3416H5.85494V27.1413ZM12.5906 22.7273L14.3484 28.2528H14.4158L16.1772 22.7273H17.8817L15.3746 30H13.3931L10.8825 22.7273H12.5906ZM20.2947 22.7273V30H18.7571V22.7273H20.2947Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/css.svg b/web/src/assets/svg/file-icon/css.svg
new file mode 100644
index 0000000000000000000000000000000000000000..506a853c4464c8ea140bd73515faa0ba71b7297a
--- /dev/null
+++ b/web/src/assets/svg/file-icon/css.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="27" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M11.2365 25.2734H9.68111C9.6527 25.0722 9.5947 24.8935 9.5071 24.7372C9.41951 24.5786 9.30706 24.4437 9.16974 24.3324C9.03243 24.2211 8.87382 24.1359 8.69389 24.0767C8.51634 24.0175 8.32339 23.9879 8.11506 23.9879C7.73864 23.9879 7.41075 24.0814 7.13139 24.2685C6.85204 24.4531 6.63542 24.723 6.48153 25.0781C6.32765 25.4309 6.25071 25.8594 6.25071 26.3636C6.25071 26.8821 6.32765 27.3177 6.48153 27.6705C6.63778 28.0232 6.85559 28.2895 7.13494 28.4695C7.4143 28.6494 7.73745 28.7393 8.1044 28.7393C8.31037 28.7393 8.50095 28.7121 8.67614 28.6577C8.85369 28.6032 9.01113 28.5239 9.14844 28.4197C9.28575 28.3132 9.39938 28.1842 9.48935 28.0327C9.58168 27.8812 9.6456 27.7083 9.68111 27.5142L11.2365 27.5213C11.1963 27.8551 11.0956 28.1771 10.9347 28.4872C10.776 28.795 10.5618 29.0708 10.2919 29.3146C10.0244 29.5561 9.70478 29.7479 9.3331 29.8899C8.96378 30.0296 8.54593 30.0994 8.07955 30.0994C7.43087 30.0994 6.85085 29.9527 6.33949 29.6591C5.83049 29.3655 5.42803 28.9406 5.1321 28.3842C4.83854 27.8279 4.69176 27.1544 4.69176 26.3636C4.69176 25.5705 4.84091 24.8958 5.1392 24.3395C5.4375 23.7831 5.84233 23.3594 6.35369 23.0682C6.86506 22.7746 7.44034 22.6278 8.07955 22.6278C8.50095 22.6278 8.89157 22.687 9.25142 22.8054C9.61364 22.9238 9.93442 23.0966 10.2138 23.3239C10.4931 23.5488 10.7204 23.8246 10.8956 24.1513C11.0732 24.478 11.1868 24.852 11.2365 25.2734ZM16.2844 24.8189C16.256 24.5324 16.1341 24.3099 15.9187 24.1513C15.7032 23.9927 15.4109 23.9134 15.0415 23.9134C14.7906 23.9134 14.5787 23.9489 14.4059 24.0199C14.2331 24.0885 14.1005 24.1844 14.0082 24.3075C13.9182 24.4306 13.8732 24.5703 13.8732 24.7266C13.8685 24.8568 13.8957 24.9704 13.9549 25.0675C14.0165 25.1645 14.1005 25.2486 14.207 25.3196C14.3136 25.3883 14.4367 25.4486 14.5763 25.5007C14.716 25.5504 14.8652 25.593 15.0238 25.6286L15.6772 25.7848C15.9944 25.8558 16.2856 25.9505 16.5508 26.0689C16.8159 26.1873 17.0456 26.3329 17.2397 26.5057C17.4338 26.6785 17.5842 26.8821 17.6907 27.1165C17.7996 27.3509 17.8552 27.6196 17.8576 27.9226C17.8552 28.3677 17.7416 28.7536 17.5167 29.0803C17.2942 29.4046 16.9722 29.6567 16.5508 29.8366C16.1317 30.0142 15.6263 30.103 15.0344 30.103C14.4473 30.103 13.936 30.013 13.5004 29.8331C13.0671 29.6532 12.7286 29.3868 12.4847 29.0341C12.2433 28.679 12.1166 28.2398 12.1048 27.7166H13.5927C13.6093 27.9605 13.6791 28.1641 13.8022 28.3274C13.9277 28.4884 14.0946 28.6103 14.3029 28.6932C14.5136 28.7737 14.7515 28.8139 15.0167 28.8139C15.2771 28.8139 15.5032 28.776 15.695 28.7003C15.8891 28.6245 16.0394 28.5192 16.146 28.3842C16.2525 28.2493 16.3058 28.0942 16.3058 27.919C16.3058 27.7557 16.2572 27.6184 16.1602 27.5071C16.0655 27.3958 15.9258 27.3011 15.7411 27.223C15.5588 27.1449 15.3351 27.0739 15.07 27.0099L14.2781 26.8111C13.6649 26.6619 13.1808 26.4287 12.8256 26.1115C12.4705 25.7943 12.2942 25.367 12.2965 24.8295C12.2942 24.3892 12.4113 24.0045 12.6481 23.6754C12.8872 23.3464 13.2151 23.0895 13.6317 22.9048C14.0484 22.7202 14.5219 22.6278 15.0522 22.6278C15.592 22.6278 16.0631 22.7202 16.4656 22.9048C16.8704 23.0895 17.1853 23.3464 17.4102 23.6754C17.6351 24.0045 17.7511 24.3857 17.7582 24.8189H16.2844ZM22.8372 24.8189C22.8088 24.5324 22.6868 24.3099 22.4714 24.1513C22.256 23.9927 21.9636 23.9134 21.5943 23.9134C21.3433 23.9134 21.1315 23.9489 20.9586 24.0199C20.7858 24.0885 20.6532 24.1844 20.5609 24.3075C20.4709 24.4306 20.426 24.5703 20.426 24.7266C20.4212 24.8568 20.4484 24.9704 20.5076 25.0675C20.5692 25.1645 20.6532 25.2486 20.7598 25.3196C20.8663 25.3883 20.9894 25.4486 21.1291 25.5007C21.2688 25.5504 21.4179 25.593 21.5765 25.6286L22.2299 25.7848C22.5472 25.8558 22.8384 25.9505 23.1035 26.0689C23.3687 26.1873 23.5983 26.3329 23.7924 26.5057C23.9866 26.6785 24.1369 26.8821 24.2434 27.1165C24.3523 27.3509 24.408 27.6196 24.4103 27.9226C24.408 28.3677 24.2943 28.7536 24.0694 29.0803C23.8469 29.4046 23.5249 29.6567 23.1035 29.8366C22.6845 30.0142 22.179 30.103 21.5872 30.103C21.0001 30.103 20.4887 30.013 20.0531 29.8331C19.6199 29.6532 19.2813 29.3868 19.0375 29.0341C18.796 28.679 18.6693 28.2398 18.6575 27.7166H20.1454C20.162 27.9605 20.2318 28.1641 20.3549 28.3274C20.4804 28.4884 20.6473 28.6103 20.8556 28.6932C21.0663 28.7737 21.3043 28.8139 21.5694 28.8139C21.8298 28.8139 22.0559 28.776 22.2477 28.7003C22.4418 28.6245 22.5922 28.5192 22.6987 28.3842C22.8052 28.2493 22.8585 28.0942 22.8585 27.919C22.8585 27.7557 22.81 27.6184 22.7129 27.5071C22.6182 27.3958 22.4785 27.3011 22.2939 27.223C22.1116 27.1449 21.8878 27.0739 21.6227 27.0099L20.8308 26.8111C20.2176 26.6619 19.7335 26.4287 19.3784 26.1115C19.0233 25.7943 18.8469 25.367 18.8493 24.8295C18.8469 24.3892 18.9641 24.0045 19.2008 23.6754C19.4399 23.3464 19.7678 23.0895 20.1845 22.9048C20.6011 22.7202 21.0746 22.6278 21.6049 22.6278C22.1447 22.6278 22.6158 22.7202 23.0183 22.9048C23.4231 23.0895 23.738 23.3464 23.9629 23.6754C24.1878 24.0045 24.3038 24.3857 24.3109 24.8189H22.8372Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/csv.svg b/web/src/assets/svg/file-icon/csv.svg
new file mode 100644
index 0000000000000000000000000000000000000000..ad691e0d4f1d468dcfd81cdc4a8fca9a59b606a5
--- /dev/null
+++ b/web/src/assets/svg/file-icon/csv.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="28" height="16" rx="2" fill="#079455" />
+    <path
+        d="M11.2726 25.2734H9.71724C9.68883 25.0722 9.63083 24.8935 9.54324 24.7372C9.45564 24.5786 9.34319 24.4437 9.20588 24.3324C9.06857 24.2211 8.90995 24.1359 8.73002 24.0767C8.55247 24.0175 8.35952 23.9879 8.15119 23.9879C7.77477 23.9879 7.44688 24.0814 7.16752 24.2685C6.88817 24.4531 6.67155 24.723 6.51767 25.0781C6.36378 25.4309 6.28684 25.8594 6.28684 26.3636C6.28684 26.8821 6.36378 27.3177 6.51767 27.6705C6.67392 28.0232 6.89172 28.2895 7.17108 28.4695C7.45043 28.6494 7.77359 28.7393 8.14054 28.7393C8.3465 28.7393 8.53708 28.7121 8.71227 28.6577C8.88983 28.6032 9.04726 28.5239 9.18457 28.4197C9.32188 28.3132 9.43552 28.1842 9.52548 28.0327C9.61781 27.8812 9.68173 27.7083 9.71724 27.5142L11.2726 27.5213C11.2324 27.8551 11.1318 28.1771 10.9708 28.4872C10.8122 28.795 10.5979 29.0708 10.328 29.3146C10.0605 29.5561 9.74092 29.7479 9.36923 29.8899C8.99991 30.0296 8.58206 30.0994 8.11568 30.0994C7.467 30.0994 6.88699 29.9527 6.37562 29.6591C5.86663 29.3655 5.46416 28.9406 5.16824 28.3842C4.87467 27.8279 4.72789 27.1544 4.72789 26.3636C4.72789 25.5705 4.87704 24.8958 5.17534 24.3395C5.47363 23.7831 5.87846 23.3594 6.38983 23.0682C6.90119 22.7746 7.47647 22.6278 8.11568 22.6278C8.53708 22.6278 8.9277 22.687 9.28755 22.8054C9.64977 22.9238 9.97056 23.0966 10.2499 23.3239C10.5293 23.5488 10.7565 23.8246 10.9317 24.1513C11.1093 24.478 11.2229 24.852 11.2726 25.2734ZM16.3206 24.8189C16.2922 24.5324 16.1702 24.3099 15.9548 24.1513C15.7394 23.9927 15.447 23.9134 15.0777 23.9134C14.8267 23.9134 14.6148 23.9489 14.442 24.0199C14.2692 24.0885 14.1366 24.1844 14.0443 24.3075C13.9543 24.4306 13.9094 24.5703 13.9094 24.7266C13.9046 24.8568 13.9318 24.9704 13.991 25.0675C14.0526 25.1645 14.1366 25.2486 14.2432 25.3196C14.3497 25.3883 14.4728 25.4486 14.6125 25.5007C14.7522 25.5504 14.9013 25.593 15.0599 25.6286L15.7133 25.7848C16.0306 25.8558 16.3218 25.9505 16.5869 26.0689C16.8521 26.1873 17.0817 26.3329 17.2758 26.5057C17.47 26.6785 17.6203 26.8821 17.7268 27.1165C17.8357 27.3509 17.8914 27.6196 17.8937 27.9226C17.8914 28.3677 17.7777 28.7536 17.5528 29.0803C17.3303 29.4046 17.0083 29.6567 16.5869 29.8366C16.1679 30.0142 15.6624 30.103 15.0706 30.103C14.4835 30.103 13.9721 30.013 13.5365 29.8331C13.1032 29.6532 12.7647 29.3868 12.5209 29.0341C12.2794 28.679 12.1527 28.2398 12.1409 27.7166H13.6288C13.6454 27.9605 13.7152 28.1641 13.8383 28.3274C13.9638 28.4884 14.1307 28.6103 14.339 28.6932C14.5497 28.7737 14.7877 28.8139 15.0528 28.8139C15.3132 28.8139 15.5393 28.776 15.7311 28.7003C15.9252 28.6245 16.0756 28.5192 16.1821 28.3842C16.2886 28.2493 16.3419 28.0942 16.3419 27.919C16.3419 27.7557 16.2934 27.6184 16.1963 27.5071C16.1016 27.3958 15.9619 27.3011 15.7773 27.223C15.595 27.1449 15.3712 27.0739 15.1061 27.0099L14.3142 26.8111C13.701 26.6619 13.2169 26.4287 12.8618 26.1115C12.5067 25.7943 12.3303 25.367 12.3327 24.8295C12.3303 24.3892 12.4475 24.0045 12.6842 23.6754C12.9233 23.3464 13.2512 23.0895 13.6679 22.9048C14.0845 22.7202 14.558 22.6278 15.0883 22.6278C15.6281 22.6278 16.0992 22.7202 16.5017 22.9048C16.9065 23.0895 17.2214 23.3464 17.4463 23.6754C17.6712 24.0045 17.7872 24.3857 17.7943 24.8189H16.3206ZM20.2419 22.7273L21.9997 28.2528H22.0672L23.8286 22.7273H25.5331L23.026 30H21.0445L18.5338 22.7273H20.2419Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/dmg.svg b/web/src/assets/svg/file-icon/dmg.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4755f46fa976d3d55a20ca11b8a703a569e9adef
--- /dev/null
+++ b/web/src/assets/svg/file-icon/dmg.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="31" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M7.69363 30H5.1155V22.7273H7.71493C8.44647 22.7273 9.0762 22.8729 9.60414 23.1641C10.1321 23.4529 10.5381 23.8684 10.8222 24.4105C11.1086 24.9527 11.2519 25.6013 11.2519 26.3565C11.2519 27.1141 11.1086 27.7652 10.8222 28.3097C10.5381 28.8542 10.1297 29.272 9.59703 29.5632C9.06673 29.8544 8.43226 30 7.69363 30ZM6.65314 28.6825H7.62971C8.08425 28.6825 8.46659 28.602 8.77672 28.4411C9.08922 28.2777 9.3236 28.0256 9.47985 27.6847C9.63846 27.3414 9.71777 26.8987 9.71777 26.3565C9.71777 25.8191 9.63846 25.38 9.47985 25.0391C9.3236 24.6982 9.09041 24.4472 8.78027 24.2862C8.47014 24.1252 8.0878 24.0447 7.63326 24.0447H6.65314V28.6825ZM12.3909 22.7273H14.2872L16.29 27.6136H16.3753L18.3781 22.7273H20.2744V30H18.7829V25.2663H18.7226L16.8405 29.9645H15.8248L13.9427 25.2486H13.8824V30H12.3909V22.7273ZM26.3637 25.0781C26.314 24.9053 26.2442 24.7526 26.1542 24.62C26.0642 24.4851 25.9542 24.3714 25.824 24.2791C25.6961 24.1844 25.5493 24.1122 25.3836 24.0625C25.2203 24.0128 25.0392 23.9879 24.8403 23.9879C24.4686 23.9879 24.1419 24.0803 23.8602 24.2649C23.5808 24.4496 23.363 24.7183 23.2068 25.071C23.0505 25.4214 22.9724 25.8499 22.9724 26.3565C22.9724 26.8632 23.0493 27.294 23.2032 27.6491C23.3571 28.0043 23.5749 28.2753 23.8566 28.4624C24.1383 28.647 24.471 28.7393 24.8545 28.7393C25.2025 28.7393 25.4996 28.6778 25.7458 28.5547C25.9944 28.4292 26.1838 28.2528 26.314 28.0256C26.4466 27.7983 26.5129 27.5296 26.5129 27.2195L26.8254 27.2656H24.9504V26.108H27.9937V27.0241C27.9937 27.6634 27.8588 28.2126 27.5889 28.6719C27.319 29.1288 26.9473 29.4815 26.4738 29.7301C26.0003 29.9763 25.4582 30.0994 24.8474 30.0994C24.1656 30.0994 23.5666 29.9491 23.0505 29.6484C22.5344 29.3454 22.132 28.9157 21.8431 28.3594C21.5567 27.8007 21.4134 27.1378 21.4134 26.3707C21.4134 25.7812 21.4987 25.2557 21.6691 24.794C21.8419 24.33 22.0834 23.937 22.3936 23.6151C22.7037 23.2931 23.0647 23.0481 23.4767 22.88C23.8886 22.7119 24.3348 22.6278 24.8154 22.6278C25.2274 22.6278 25.6109 22.6882 25.966 22.8089C26.3211 22.9273 26.636 23.0954 26.9106 23.3132C27.1876 23.531 27.4137 23.7902 27.5889 24.0909C27.7641 24.3892 27.8765 24.7183 27.9262 25.0781H26.3637Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/doc.svg b/web/src/assets/svg/file-icon/doc.svg
new file mode 100644
index 0000000000000000000000000000000000000000..2e68655ca1f4e395c4448f8fdb9a0a1112de0336
--- /dev/null
+++ b/web/src/assets/svg/file-icon/doc.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="29" height="16" rx="2" fill="#155EEF" />
+    <path
+        d="M7.40163 30H4.82351V22.7273H7.42294C8.15447 22.7273 8.78421 22.8729 9.31214 23.1641C9.84008 23.4529 10.2461 23.8684 10.5302 24.4105C10.8166 24.9527 10.9599 25.6013 10.9599 26.3565C10.9599 27.1141 10.8166 27.7652 10.5302 28.3097C10.2461 28.8542 9.83771 29.272 9.30504 29.5632C8.77474 29.8544 8.14027 30 7.40163 30ZM6.36115 28.6825H7.33771C7.79226 28.6825 8.1746 28.602 8.48473 28.4411C8.79723 28.2777 9.03161 28.0256 9.18786 27.6847C9.34647 27.3414 9.42578 26.8987 9.42578 26.3565C9.42578 25.8191 9.34647 25.38 9.18786 25.0391C9.03161 24.6982 8.79841 24.4472 8.48828 24.2862C8.17815 24.1252 7.79581 24.0447 7.34126 24.0447H6.36115V28.6825ZM18.7821 26.3636C18.7821 27.1567 18.6318 27.8314 18.3311 28.3878C18.0328 28.9441 17.6257 29.3691 17.1096 29.6626C16.5958 29.9538 16.0182 30.0994 15.3766 30.0994C14.7303 30.0994 14.1503 29.9527 13.6365 29.6591C13.1228 29.3655 12.7168 28.9406 12.4185 28.3842C12.1202 27.8279 11.9711 27.1544 11.9711 26.3636C11.9711 25.5705 12.1202 24.8958 12.4185 24.3395C12.7168 23.7831 13.1228 23.3594 13.6365 23.0682C14.1503 22.7746 14.7303 22.6278 15.3766 22.6278C16.0182 22.6278 16.5958 22.7746 17.1096 23.0682C17.6257 23.3594 18.0328 23.7831 18.3311 24.3395C18.6318 24.8958 18.7821 25.5705 18.7821 26.3636ZM17.2232 26.3636C17.2232 25.8499 17.1462 25.4167 16.9924 25.0639C16.8408 24.7112 16.6266 24.4437 16.3496 24.2614C16.0726 24.0791 15.7483 23.9879 15.3766 23.9879C15.0049 23.9879 14.6806 24.0791 14.4036 24.2614C14.1266 24.4437 13.9112 24.7112 13.7573 25.0639C13.6058 25.4167 13.53 25.8499 13.53 26.3636C13.53 26.8774 13.6058 27.3106 13.7573 27.6634C13.9112 28.0161 14.1266 28.2836 14.4036 28.4659C14.6806 28.6482 15.0049 28.7393 15.3766 28.7393C15.7483 28.7393 16.0726 28.6482 16.3496 28.4659C16.6266 28.2836 16.8408 28.0161 16.9924 27.6634C17.1462 27.3106 17.2232 26.8774 17.2232 26.3636ZM26.3381 25.2734H24.7827C24.7543 25.0722 24.6963 24.8935 24.6087 24.7372C24.5211 24.5786 24.4086 24.4437 24.2713 24.3324C24.134 24.2211 23.9754 24.1359 23.7955 24.0767C23.6179 24.0175 23.425 23.9879 23.2166 23.9879C22.8402 23.9879 22.5123 24.0814 22.233 24.2685C21.9536 24.4531 21.737 24.723 21.5831 25.0781C21.4292 25.4309 21.3523 25.8594 21.3523 26.3636C21.3523 26.8821 21.4292 27.3177 21.5831 27.6705C21.7393 28.0232 21.9571 28.2895 22.2365 28.4695C22.5159 28.6494 22.839 28.7393 23.206 28.7393C23.4119 28.7393 23.6025 28.7121 23.7777 28.6577C23.9553 28.6032 24.1127 28.5239 24.25 28.4197C24.3873 28.3132 24.5009 28.1842 24.5909 28.0327C24.6832 27.8812 24.7472 27.7083 24.7827 27.5142L26.3381 27.5213C26.2978 27.8551 26.1972 28.1771 26.0362 28.4872C25.8776 28.795 25.6634 29.0708 25.3935 29.3146C25.1259 29.5561 24.8063 29.7479 24.4347 29.8899C24.0653 30.0296 23.6475 30.0994 23.1811 30.0994C22.5324 30.0994 21.9524 29.9527 21.4411 29.6591C20.9321 29.3655 20.5296 28.9406 20.2337 28.3842C19.9401 27.8279 19.7933 27.1544 19.7933 26.3636C19.7933 25.5705 19.9425 24.8958 20.2408 24.3395C20.5391 23.7831 20.9439 23.3594 21.4553 23.0682C21.9666 22.7746 22.5419 22.6278 23.1811 22.6278C23.6025 22.6278 23.9931 22.687 24.353 22.8054C24.7152 22.9238 25.036 23.0966 25.3153 23.3239C25.5947 23.5488 25.822 23.8246 25.9972 24.1513C26.1747 24.478 26.2884 24.852 26.3381 25.2734Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/docx.svg b/web/src/assets/svg/file-icon/docx.svg
new file mode 100644
index 0000000000000000000000000000000000000000..dd43254899c5a0de7665aaa39d9f8cf6cef5fcd8
--- /dev/null
+++ b/web/src/assets/svg/file-icon/docx.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="36" height="16" rx="2" fill="#155EEF" />
+    <path
+        d="M7.40554 30H4.82741V22.7273H7.42685C8.15838 22.7273 8.78812 22.8729 9.31605 23.1641C9.84399 23.4529 10.25 23.8684 10.5341 24.4105C10.8205 24.9527 10.9638 25.6013 10.9638 26.3565C10.9638 27.1141 10.8205 27.7652 10.5341 28.3097C10.25 28.8542 9.84162 29.272 9.30895 29.5632C8.77865 29.8544 8.14418 30 7.40554 30ZM6.36506 28.6825H7.34162C7.79616 28.6825 8.1785 28.602 8.48864 28.4411C8.80114 28.2777 9.03551 28.0256 9.19176 27.6847C9.35038 27.3414 9.42969 26.8987 9.42969 26.3565C9.42969 25.8191 9.35038 25.38 9.19176 25.0391C9.03551 24.6982 8.80232 24.4472 8.49219 24.2862C8.18205 24.1252 7.79972 24.0447 7.34517 24.0447H6.36506V28.6825ZM18.786 26.3636C18.786 27.1567 18.6357 27.8314 18.335 28.3878C18.0368 28.9441 17.6296 29.3691 17.1135 29.6626C16.5997 29.9538 16.0221 30.0994 15.3805 30.0994C14.7342 30.0994 14.1542 29.9527 13.6404 29.6591C13.1267 29.3655 12.7207 28.9406 12.4224 28.3842C12.1241 27.8279 11.975 27.1544 11.975 26.3636C11.975 25.5705 12.1241 24.8958 12.4224 24.3395C12.7207 23.7831 13.1267 23.3594 13.6404 23.0682C14.1542 22.7746 14.7342 22.6278 15.3805 22.6278C16.0221 22.6278 16.5997 22.7746 17.1135 23.0682C17.6296 23.3594 18.0368 23.7831 18.335 24.3395C18.6357 24.8958 18.786 25.5705 18.786 26.3636ZM17.2271 26.3636C17.2271 25.8499 17.1502 25.4167 16.9963 25.0639C16.8448 24.7112 16.6305 24.4437 16.3535 24.2614C16.0765 24.0791 15.7522 23.9879 15.3805 23.9879C15.0088 23.9879 14.6845 24.0791 14.4075 24.2614C14.1305 24.4437 13.9151 24.7112 13.7612 25.0639C13.6097 25.4167 13.5339 25.8499 13.5339 26.3636C13.5339 26.8774 13.6097 27.3106 13.7612 27.6634C13.9151 28.0161 14.1305 28.2836 14.4075 28.4659C14.6845 28.6482 15.0088 28.7393 15.3805 28.7393C15.7522 28.7393 16.0765 28.6482 16.3535 28.4659C16.6305 28.2836 16.8448 28.0161 16.9963 27.6634C17.1502 27.3106 17.2271 26.8774 17.2271 26.3636ZM26.342 25.2734H24.7866C24.7582 25.0722 24.7002 24.8935 24.6126 24.7372C24.525 24.5786 24.4125 24.4437 24.2752 24.3324C24.1379 24.2211 23.9793 24.1359 23.7994 24.0767C23.6218 24.0175 23.4289 23.9879 23.2205 23.9879C22.8441 23.9879 22.5162 24.0814 22.2369 24.2685C21.9575 24.4531 21.7409 24.723 21.587 25.0781C21.4331 25.4309 21.3562 25.8594 21.3562 26.3636C21.3562 26.8821 21.4331 27.3177 21.587 27.6705C21.7433 28.0232 21.9611 28.2895 22.2404 28.4695C22.5198 28.6494 22.8429 28.7393 23.2099 28.7393C23.4158 28.7393 23.6064 28.7121 23.7816 28.6577C23.9592 28.6032 24.1166 28.5239 24.2539 28.4197C24.3912 28.3132 24.5049 28.1842 24.5948 28.0327C24.6871 27.8812 24.7511 27.7083 24.7866 27.5142L26.342 27.5213C26.3017 27.8551 26.2011 28.1771 26.0401 28.4872C25.8815 28.795 25.6673 29.0708 25.3974 29.3146C25.1299 29.5561 24.8103 29.7479 24.4386 29.8899C24.0692 30.0296 23.6514 30.0994 23.185 30.0994C22.5363 30.0994 21.9563 29.9527 21.445 29.6591C20.936 29.3655 20.5335 28.9406 20.2376 28.3842C19.944 27.8279 19.7972 27.1544 19.7972 26.3636C19.7972 25.5705 19.9464 24.8958 20.2447 24.3395C20.543 23.7831 20.9478 23.3594 21.4592 23.0682C21.9705 22.7746 22.5458 22.6278 23.185 22.6278C23.6064 22.6278 23.997 22.687 24.3569 22.8054C24.7191 22.9238 25.0399 23.0966 25.3192 23.3239C25.5986 23.5488 25.8259 23.8246 26.0011 24.1513C26.1786 24.478 26.2923 24.852 26.342 25.2734ZM28.7301 22.7273L30.1967 25.206H30.2536L31.7273 22.7273H33.4638L31.2443 26.3636L33.5135 30H31.745L30.2536 27.5178H30.1967L28.7053 30H26.9439L29.2202 26.3636L26.9865 22.7273H28.7301Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/eps.svg b/web/src/assets/svg/file-icon/eps.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4f2a66b1a03162da5127721ce5d51bf483d5310a
--- /dev/null
+++ b/web/src/assets/svg/file-icon/eps.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="26" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M5.05691 30V22.7273H9.95748V23.995H6.59455V25.728H9.70534V26.9957H6.59455V28.7322H9.97168V30H5.05691ZM11.18 30V22.7273H14.0493C14.6009 22.7273 15.0708 22.8326 15.4591 23.0433C15.8473 23.2517 16.1433 23.5417 16.3469 23.9134C16.5528 24.2827 16.6558 24.7088 16.6558 25.1918C16.6558 25.6747 16.5516 26.1009 16.3433 26.4702C16.135 26.8395 15.8331 27.1271 15.4378 27.3331C15.0448 27.5391 14.5689 27.642 14.0102 27.642H12.1814V26.4098H13.7616C14.0576 26.4098 14.3014 26.3589 14.4932 26.2571C14.6873 26.1529 14.8317 26.0097 14.9264 25.8274C15.0235 25.6428 15.072 25.4309 15.072 25.1918C15.072 24.9503 15.0235 24.7396 14.9264 24.5597C14.8317 24.3774 14.6873 24.2365 14.4932 24.1371C14.299 24.0353 14.0528 23.9844 13.7545 23.9844H12.7176V30H11.18ZM21.5999 24.8189C21.5715 24.5324 21.4495 24.3099 21.2341 24.1513C21.0187 23.9927 20.7263 23.9134 20.357 23.9134C20.106 23.9134 19.8941 23.9489 19.7213 24.0199C19.5485 24.0885 19.4159 24.1844 19.3236 24.3075C19.2336 24.4306 19.1887 24.5703 19.1887 24.7266C19.1839 24.8568 19.2111 24.9704 19.2703 25.0675C19.3319 25.1645 19.4159 25.2486 19.5225 25.3196C19.629 25.3883 19.7521 25.4486 19.8918 25.5007C20.0315 25.5504 20.1806 25.593 20.3392 25.6286L20.9926 25.7848C21.3099 25.8558 21.6011 25.9505 21.8662 26.0689C22.1314 26.1873 22.361 26.3329 22.5551 26.5057C22.7493 26.6785 22.8996 26.8821 23.0061 27.1165C23.115 27.3509 23.1707 27.6196 23.173 27.9226C23.1707 28.3677 23.057 28.7536 22.8321 29.0803C22.6096 29.4046 22.2876 29.6567 21.8662 29.8366C21.4472 30.0142 20.9417 30.103 20.3499 30.103C19.7628 30.103 19.2514 30.013 18.8158 29.8331C18.3825 29.6532 18.044 29.3868 17.8002 29.0341C17.5587 28.679 17.432 28.2398 17.4202 27.7166H18.9081C18.9247 27.9605 18.9945 28.1641 19.1176 28.3274C19.2431 28.4884 19.41 28.6103 19.6183 28.6932C19.829 28.7737 20.067 28.8139 20.3321 28.8139C20.5925 28.8139 20.8186 28.776 21.0104 28.7003C21.2045 28.6245 21.3548 28.5192 21.4614 28.3842C21.5679 28.2493 21.6212 28.0942 21.6212 27.919C21.6212 27.7557 21.5727 27.6184 21.4756 27.5071C21.3809 27.3958 21.2412 27.3011 21.0566 27.223C20.8743 27.1449 20.6505 27.0739 20.3854 27.0099L19.5935 26.8111C18.9803 26.6619 18.4962 26.4287 18.1411 26.1115C17.786 25.7943 17.6096 25.367 17.6119 24.8295C17.6096 24.3892 17.7268 24.0045 17.9635 23.6754C18.2026 23.3464 18.5305 23.0895 18.9472 22.9048C19.3638 22.7202 19.8373 22.6278 20.3676 22.6278C20.9074 22.6278 21.3785 22.7202 21.781 22.9048C22.1858 23.0895 22.5007 23.3464 22.7256 23.6754C22.9505 24.0045 23.0665 24.3857 23.0736 24.8189H21.5999Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/exe.svg b/web/src/assets/svg/file-icon/exe.svg
new file mode 100644
index 0000000000000000000000000000000000000000..fbaea17f1c008d7ab65e805e4a63535738923c8c
--- /dev/null
+++ b/web/src/assets/svg/file-icon/exe.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="26" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M4.93484 30V22.7273H9.8354V23.995H6.47248V25.728H9.58327V26.9957H6.47248V28.7322H9.84961V30H4.93484ZM12.4996 22.7273L13.9663 25.206H14.0231L15.4968 22.7273H17.2333L15.0138 26.3636L17.283 30H15.5146L14.0231 27.5178H13.9663L12.4748 30H10.7134L12.9897 26.3636L10.756 22.7273H12.4996ZM18.2063 30V22.7273H23.1069V23.995H19.744V25.728H22.8548V26.9957H19.744V28.7322H23.1211V30H18.2063Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/fig.svg b/web/src/assets/svg/file-icon/fig.svg
new file mode 100644
index 0000000000000000000000000000000000000000..7a500cdaebd1b291a1c633d204edf225d2fe0a5b
--- /dev/null
+++ b/web/src/assets/svg/file-icon/fig.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="23" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M5.00222 30V22.7273H9.81756V23.995H6.53986V25.728H9.49796V26.9957H6.53986V30H5.00222ZM12.3895 22.7273V30H10.8518V22.7273H12.3895ZM18.477 25.0781C18.4273 24.9053 18.3575 24.7526 18.2675 24.62C18.1775 24.4851 18.0674 24.3714 17.9372 24.2791C17.8094 24.1844 17.6626 24.1122 17.4969 24.0625C17.3335 24.0128 17.1524 23.9879 16.9536 23.9879C16.5819 23.9879 16.2552 24.0803 15.9735 24.2649C15.6941 24.4496 15.4763 24.7183 15.32 25.071C15.1638 25.4214 15.0857 25.8499 15.0857 26.3565C15.0857 26.8632 15.1626 27.294 15.3165 27.6491C15.4704 28.0043 15.6882 28.2753 15.9699 28.4624C16.2516 28.647 16.5843 28.7393 16.9678 28.7393C17.3158 28.7393 17.6129 28.6778 17.8591 28.5547C18.1077 28.4292 18.2971 28.2528 18.4273 28.0256C18.5599 27.7983 18.6262 27.5296 18.6262 27.2195L18.9387 27.2656H17.0637V26.108H20.107V27.0241C20.107 27.6634 19.972 28.2126 19.7021 28.6719C19.4323 29.1288 19.0606 29.4815 18.5871 29.7301C18.1136 29.9763 17.5715 30.0994 16.9607 30.0994C16.2789 30.0994 15.6799 29.9491 15.1638 29.6484C14.6477 29.3454 14.2452 28.9157 13.9564 28.3594C13.67 27.8007 13.5267 27.1378 13.5267 26.3707C13.5267 25.7812 13.6119 25.2557 13.7824 24.794C13.9552 24.33 14.1967 23.937 14.5068 23.6151C14.817 23.2931 15.178 23.0481 15.5899 22.88C16.0019 22.7119 16.4481 22.6278 16.9287 22.6278C17.3406 22.6278 17.7242 22.6882 18.0793 22.8089C18.4344 22.9273 18.7493 23.0954 19.0239 23.3132C19.3009 23.531 19.527 23.7902 19.7021 24.0909C19.8773 24.3892 19.9898 24.7183 20.0395 25.0781H18.477Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/gif.svg b/web/src/assets/svg/file-icon/gif.svg
new file mode 100644
index 0000000000000000000000000000000000000000..ff4e0245578a224eaffe0aa7811e71d858cbd5aa
--- /dev/null
+++ b/web/src/assets/svg/file-icon/gif.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="23" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M9.82466 25.0781C9.77495 24.9053 9.70511 24.7526 9.61515 24.62C9.52518 24.4851 9.4151 24.3714 9.28489 24.2791C9.15705 24.1844 9.01027 24.1122 8.84455 24.0625C8.6812 24.0128 8.50009 23.9879 8.30123 23.9879C7.92954 23.9879 7.60284 24.0803 7.32111 24.2649C7.04176 24.4496 6.82395 24.7183 6.6677 25.071C6.51145 25.4214 6.43333 25.8499 6.43333 26.3565C6.43333 26.8632 6.51027 27.294 6.66415 27.6491C6.81803 28.0043 7.03584 28.2753 7.31756 28.4624C7.59928 28.647 7.93191 28.7393 8.31543 28.7393C8.66344 28.7393 8.96055 28.6778 9.20676 28.5547C9.45534 28.4292 9.64474 28.2528 9.77495 28.0256C9.90752 27.7983 9.97381 27.5296 9.97381 27.2195L10.2863 27.2656H8.41131V26.108H11.4546V27.0241C11.4546 27.6634 11.3197 28.2126 11.0498 28.6719C10.7799 29.1288 10.4082 29.4815 9.93475 29.7301C9.46126 29.9763 8.91912 30.0994 8.30833 30.0994C7.62651 30.0994 7.02755 29.9491 6.51145 29.6484C5.99535 29.3454 5.59289 28.9157 5.30407 28.3594C5.01761 27.8007 4.87438 27.1378 4.87438 26.3707C4.87438 25.7812 4.95961 25.2557 5.13006 24.794C5.30288 24.33 5.54436 23.937 5.85449 23.6151C6.16462 23.2931 6.52566 23.0481 6.93759 22.88C7.34952 22.7119 7.79578 22.6278 8.27637 22.6278C8.6883 22.6278 9.07182 22.6882 9.42694 22.8089C9.78205 22.9273 10.0969 23.0954 10.3715 23.3132C10.6485 23.531 10.8746 23.7902 11.0498 24.0909C11.225 24.3892 11.3374 24.7183 11.3872 25.0781H9.82466ZM14.1473 22.7273V30H12.6096V22.7273H14.1473ZM15.4124 30V22.7273H20.2277V23.995H16.95V25.728H19.9081V26.9957H16.95V30H15.4124Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/html.svg b/web/src/assets/svg/file-icon/html.svg
new file mode 100644
index 0000000000000000000000000000000000000000..8d157fe680eafa5b46b0786db868209da3fba7d0
--- /dev/null
+++ b/web/src/assets/svg/file-icon/html.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="35" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M4.64968 30V22.7273H6.18732V25.728H9.30877V22.7273H10.8429V30H9.30877V26.9957H6.18732V30H4.64968ZM11.8336 23.995V22.7273H17.8066V23.995H15.5801V30H14.0602V23.995H11.8336ZM18.7903 22.7273H20.6866L22.6895 27.6136H22.7747L24.7775 22.7273H26.6738V30H25.1824V25.2663H25.122L23.2399 29.9645H22.2243L20.3422 25.2486H20.2818V30H18.7903V22.7273ZM27.9407 30V22.7273H29.4783V28.7322H32.5962V30H27.9407Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/indd.svg b/web/src/assets/svg/file-icon/indd.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b86688b6601fd51e5293c7e113786e8344d19c4e
--- /dev/null
+++ b/web/src/assets/svg/file-icon/indd.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="31" height="16" rx="2" fill="#BA24D5" />
+    <path
+        d="M6.31623 22.7273V30H4.77859V22.7273H6.31623ZM13.6644 22.7273V30H12.3363L9.17223 25.4226H9.11896V30H7.58132V22.7273H8.93075L12.07 27.3011H12.1339V22.7273H13.6644ZM17.513 30H14.9348V22.7273H17.5343C18.2658 22.7273 18.8955 22.8729 19.4235 23.1641C19.9514 23.4529 20.3574 23.8684 20.6415 24.4105C20.928 24.9527 21.0712 25.6013 21.0712 26.3565C21.0712 27.1141 20.928 27.7652 20.6415 28.3097C20.3574 28.8542 19.949 29.272 19.4164 29.5632C18.8861 29.8544 18.2516 30 17.513 30ZM16.4725 28.6825H17.449C17.9036 28.6825 18.2859 28.602 18.5961 28.4411C18.9086 28.2777 19.1429 28.0256 19.2992 27.6847C19.4578 27.3414 19.5371 26.8987 19.5371 26.3565C19.5371 25.8191 19.4578 25.38 19.2992 25.0391C19.1429 24.6982 18.9097 24.4472 18.5996 24.2862C18.2895 24.1252 17.9071 24.0447 17.4526 24.0447H16.4725V28.6825ZM24.7884 30H22.2102V22.7273H24.8097C25.5412 22.7273 26.1709 22.8729 26.6989 23.1641C27.2268 23.4529 27.6328 23.8684 27.9169 24.4105C28.2034 24.9527 28.3466 25.6013 28.3466 26.3565C28.3466 27.1141 28.2034 27.7652 27.9169 28.3097C27.6328 28.8542 27.2244 29.272 26.6918 29.5632C26.1615 29.8544 25.527 30 24.7884 30ZM23.7479 28.6825H24.7244C25.179 28.6825 25.5613 28.602 25.8714 28.4411C26.1839 28.2777 26.4183 28.0256 26.5746 27.6847C26.7332 27.3414 26.8125 26.8987 26.8125 26.3565C26.8125 25.8191 26.7332 25.38 26.5746 25.0391C26.4183 24.6982 26.1851 24.4472 25.875 24.2862C25.5649 24.1252 25.1825 24.0447 24.728 24.0447H23.7479V28.6825Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/java.svg b/web/src/assets/svg/file-icon/java.svg
new file mode 100644
index 0000000000000000000000000000000000000000..bea4ca9cc4db714b1a029ab45da0b412898bb407
--- /dev/null
+++ b/web/src/assets/svg/file-icon/java.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="33" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M7.90927 22.7273H9.42915V27.7983C9.42915 28.267 9.3238 28.6742 9.1131 29.0199C8.90477 29.3655 8.61476 29.6319 8.24308 29.8189C7.87139 30.0059 7.43933 30.0994 6.94691 30.0994C6.50894 30.0994 6.11121 30.0225 5.75373 29.8686C5.39862 29.7124 5.11689 29.4756 4.90856 29.1584C4.70022 28.8388 4.59724 28.4375 4.59961 27.9545H6.13015C6.13488 28.1463 6.17395 28.3108 6.24734 28.4482C6.32309 28.5831 6.42608 28.6873 6.55629 28.7607C6.68886 28.8317 6.84511 28.8672 7.02504 28.8672C7.21443 28.8672 7.37423 28.8269 7.50444 28.7464C7.63701 28.6636 7.73763 28.5429 7.80629 28.3842C7.87494 28.2256 7.90927 28.0303 7.90927 27.7983V22.7273ZM11.954 30H10.3063L12.8169 22.7273H14.7985L17.3056 30H15.6578L13.8361 24.3892H13.7793L11.954 30ZM11.851 27.1413H15.7431V28.3416H11.851V27.1413ZM18.5866 22.7273L20.3445 28.2528H20.4119L22.1733 22.7273H23.8778L21.3707 30H19.3892L16.8786 22.7273H18.5866ZM25.04 30H23.3922L25.9029 22.7273H27.8844L30.3915 30H28.7438L26.9221 24.3892H26.8652L25.04 30ZM24.937 27.1413H28.829V28.3416H24.937V27.1413Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/jpeg.svg b/web/src/assets/svg/file-icon/jpeg.svg
new file mode 100644
index 0000000000000000000000000000000000000000..490a29226c8627ffb29f9a7a8745ac105c3be3ad
--- /dev/null
+++ b/web/src/assets/svg/file-icon/jpeg.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="32" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M7.58993 22.7273H9.10982V27.7983C9.10982 28.267 9.00447 28.6742 8.79377 29.0199C8.58543 29.3655 8.29542 29.6319 7.92374 29.8189C7.55205 30.0059 7.12 30.0994 6.62757 30.0994C6.1896 30.0994 5.79187 30.0225 5.43439 29.8686C5.07928 29.7124 4.79756 29.4756 4.58922 29.1584C4.38089 28.8388 4.27791 28.4375 4.28027 27.9545H5.81081C5.81555 28.1463 5.85461 28.3108 5.928 28.4482C6.00376 28.5831 6.10674 28.6873 6.23695 28.7607C6.36953 28.8317 6.52578 28.8672 6.7057 28.8672C6.89509 28.8672 7.05489 28.8269 7.1851 28.7464C7.31768 28.6636 7.41829 28.5429 7.48695 28.3842C7.5556 28.2256 7.58993 28.0303 7.58993 27.7983V22.7273ZM10.3811 30V22.7273H13.2504C13.8021 22.7273 14.272 22.8326 14.6602 23.0433C15.0485 23.2517 15.3444 23.5417 15.548 23.9134C15.754 24.2827 15.857 24.7088 15.857 25.1918C15.857 25.6747 15.7528 26.1009 15.5445 26.4702C15.3361 26.8395 15.0343 27.1271 14.6389 27.3331C14.2459 27.5391 13.7701 27.642 13.2114 27.642H11.3825V26.4098H12.9628C13.2587 26.4098 13.5026 26.3589 13.6943 26.2571C13.8885 26.1529 14.0329 26.0097 14.1276 25.8274C14.2246 25.6428 14.2732 25.4309 14.2732 25.1918C14.2732 24.9503 14.2246 24.7396 14.1276 24.5597C14.0329 24.3774 13.8885 24.2365 13.6943 24.1371C13.5002 24.0353 13.254 23.9844 12.9557 23.9844H11.9188V30H10.3811ZM16.8557 30V22.7273H21.7563V23.995H18.3934V25.728H21.5042V26.9957H18.3934V28.7322H21.7705V30H16.8557ZM27.8012 25.0781C27.7515 24.9053 27.6817 24.7526 27.5917 24.62C27.5017 24.4851 27.3917 24.3714 27.2615 24.2791C27.1336 24.1844 26.9868 24.1122 26.8211 24.0625C26.6578 24.0128 26.4767 23.9879 26.2778 23.9879C25.9061 23.9879 25.5794 24.0803 25.2977 24.2649C25.0183 24.4496 24.8005 24.7183 24.6443 25.071C24.488 25.4214 24.4099 25.8499 24.4099 26.3565C24.4099 26.8632 24.4868 27.294 24.6407 27.6491C24.7946 28.0043 25.0124 28.2753 25.2941 28.4624C25.5758 28.647 25.9085 28.7393 26.292 28.7393C26.64 28.7393 26.9371 28.6778 27.1833 28.5547C27.4319 28.4292 27.6213 28.2528 27.7515 28.0256C27.8841 27.7983 27.9504 27.5296 27.9504 27.2195L28.2629 27.2656H26.3879V26.108H29.4312V27.0241C29.4312 27.6634 29.2963 28.2126 29.0264 28.6719C28.7565 29.1288 28.3848 29.4815 27.9113 29.7301C27.4378 29.9763 26.8957 30.0994 26.2849 30.0994C25.6031 30.0994 25.0041 29.9491 24.488 29.6484C23.9719 29.3454 23.5695 28.9157 23.2806 28.3594C22.9942 27.8007 22.8509 27.1378 22.8509 26.3707C22.8509 25.7812 22.9362 25.2557 23.1066 24.794C23.2794 24.33 23.5209 23.937 23.8311 23.6151C24.1412 23.2931 24.5022 23.0481 24.9142 22.88C25.3261 22.7119 25.7723 22.6278 26.2529 22.6278C26.6649 22.6278 27.0484 22.6882 27.4035 22.8089C27.7586 22.9273 28.0735 23.0954 28.3481 23.3132C28.6251 23.531 28.8512 23.7902 29.0264 24.0909C29.2016 24.3892 29.314 24.7183 29.3637 25.0781H27.8012Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/jpg.svg b/web/src/assets/svg/file-icon/jpg.svg
new file mode 100644
index 0000000000000000000000000000000000000000..035ef810c09a0f321cef595dfcba40673c6a3a7b
--- /dev/null
+++ b/web/src/assets/svg/file-icon/jpg.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="26" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M7.65146 22.7273H9.17134V27.7983C9.17134 28.267 9.06599 28.6742 8.85529 29.0199C8.64696 29.3655 8.35695 29.6319 7.98526 29.8189C7.61358 30.0059 7.18152 30.0994 6.6891 30.0994C6.25112 30.0994 5.8534 30.0225 5.49592 29.8686C5.1408 29.7124 4.85908 29.4756 4.65075 29.1584C4.44241 28.8388 4.33943 28.4375 4.3418 27.9545H5.87234C5.87707 28.1463 5.91613 28.3108 5.98952 28.4482C6.06528 28.5831 6.16826 28.6873 6.29847 28.7607C6.43105 28.8317 6.5873 28.8672 6.76722 28.8672C6.95662 28.8672 7.11642 28.8269 7.24663 28.7464C7.3792 28.6636 7.47982 28.5429 7.54847 28.3842C7.61713 28.2256 7.65146 28.0303 7.65146 27.7983V22.7273ZM10.4426 30V22.7273H13.312C13.8636 22.7273 14.3335 22.8326 14.7218 23.0433C15.11 23.2517 15.406 23.5417 15.6096 23.9134C15.8155 24.2827 15.9185 24.7088 15.9185 25.1918C15.9185 25.6747 15.8143 26.1009 15.606 26.4702C15.3977 26.8395 15.0958 27.1271 14.7005 27.3331C14.3075 27.5391 13.8316 27.642 13.2729 27.642H11.4441V26.4098H13.0243C13.3203 26.4098 13.5641 26.3589 13.7559 26.2571C13.95 26.1529 14.0944 26.0097 14.1891 25.8274C14.2862 25.6428 14.3347 25.4309 14.3347 25.1918C14.3347 24.9503 14.2862 24.7396 14.1891 24.5597C14.0944 24.3774 13.95 24.2365 13.7559 24.1371C13.5617 24.0353 13.3155 23.9844 13.0172 23.9844H11.9803V30H10.4426ZM21.7397 25.0781C21.69 24.9053 21.6201 24.7526 21.5302 24.62C21.4402 24.4851 21.3301 24.3714 21.1999 24.2791C21.0721 24.1844 20.9253 24.1122 20.7596 24.0625C20.5962 24.0128 20.4151 23.9879 20.2163 23.9879C19.8446 23.9879 19.5179 24.0803 19.2362 24.2649C18.9568 24.4496 18.739 24.7183 18.5827 25.071C18.4265 25.4214 18.3484 25.8499 18.3484 26.3565C18.3484 26.8632 18.4253 27.294 18.5792 27.6491C18.7331 28.0043 18.9509 28.2753 19.2326 28.4624C19.5143 28.647 19.8469 28.7393 20.2305 28.7393C20.5785 28.7393 20.8756 28.6778 21.1218 28.5547C21.3704 28.4292 21.5598 28.2528 21.69 28.0256C21.8226 27.7983 21.8888 27.5296 21.8888 27.2195L22.2013 27.2656H20.3263V26.108H23.3697V27.0241C23.3697 27.6634 23.2347 28.2126 22.9648 28.6719C22.695 29.1288 22.3233 29.4815 21.8498 29.7301C21.3763 29.9763 20.8342 30.0994 20.2234 30.0994C19.5415 30.0994 18.9426 29.9491 18.4265 29.6484C17.9104 29.3454 17.5079 28.9157 17.2191 28.3594C16.9326 27.8007 16.7894 27.1378 16.7894 26.3707C16.7894 25.7812 16.8746 25.2557 17.0451 24.794C17.2179 24.33 17.4594 23.937 17.7695 23.6151C18.0797 23.2931 18.4407 23.0481 18.8526 22.88C19.2646 22.7119 19.7108 22.6278 20.1914 22.6278C20.6033 22.6278 20.9869 22.6882 21.342 22.8089C21.6971 22.9273 22.012 23.0954 22.2866 23.3132C22.5636 23.531 22.7897 23.7902 22.9648 24.0909C23.14 24.3892 23.2525 24.7183 23.3022 25.0781H21.7397Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/js.svg b/web/src/assets/svg/file-icon/js.svg
new file mode 100644
index 0000000000000000000000000000000000000000..3791ff50af569d16dd46e00a7f83c49dec6f005d
--- /dev/null
+++ b/web/src/assets/svg/file-icon/js.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="19" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M7.9161 22.7273H9.43599V27.7983C9.43599 28.267 9.33064 28.6742 9.11994 29.0199C8.91161 29.3655 8.6216 29.6319 8.24991 29.8189C7.87823 30.0059 7.44617 30.0994 6.95375 30.0994C6.51577 30.0994 6.11805 30.0225 5.76056 29.8686C5.40545 29.7124 5.12373 29.4756 4.91539 29.1584C4.70706 28.8388 4.60408 28.4375 4.60645 27.9545H6.13699C6.14172 28.1463 6.18078 28.3108 6.25417 28.4482C6.32993 28.5831 6.43291 28.6873 6.56312 28.7607C6.6957 28.8317 6.85195 28.8672 7.03187 28.8672C7.22127 28.8672 7.38107 28.8269 7.51127 28.7464C7.64385 28.6636 7.74447 28.5429 7.81312 28.3842C7.88178 28.2256 7.9161 28.0303 7.9161 27.7983V22.7273ZM14.6526 24.8189C14.6242 24.5324 14.5023 24.3099 14.2868 24.1513C14.0714 23.9927 13.779 23.9134 13.4097 23.9134C13.1588 23.9134 12.9469 23.9489 12.7741 24.0199C12.6012 24.0885 12.4687 24.1844 12.3763 24.3075C12.2864 24.4306 12.2414 24.5703 12.2414 24.7266C12.2367 24.8568 12.2639 24.9704 12.3231 25.0675C12.3846 25.1645 12.4687 25.2486 12.5752 25.3196C12.6817 25.3883 12.8048 25.4486 12.9445 25.5007C13.0842 25.5504 13.2333 25.593 13.392 25.6286L14.0454 25.7848C14.3626 25.8558 14.6538 25.9505 14.9189 26.0689C15.1841 26.1873 15.4137 26.3329 15.6079 26.5057C15.802 26.6785 15.9523 26.8821 16.0589 27.1165C16.1678 27.3509 16.2234 27.6196 16.2258 27.9226C16.2234 28.3677 16.1098 28.7536 15.8849 29.0803C15.6623 29.4046 15.3403 29.6567 14.9189 29.8366C14.4999 30.0142 13.9945 30.103 13.4026 30.103C12.8155 30.103 12.3041 30.013 11.8685 29.8331C11.4353 29.6532 11.0967 29.3868 10.8529 29.0341C10.6114 28.679 10.4848 28.2398 10.4729 27.7166H11.9608C11.9774 27.9605 12.0473 28.1641 12.1704 28.3274C12.2958 28.4884 12.4627 28.6103 12.6711 28.6932C12.8818 28.7737 13.1197 28.8139 13.3849 28.8139C13.6453 28.8139 13.8714 28.776 14.0631 28.7003C14.2573 28.6245 14.4076 28.5192 14.5141 28.3842C14.6207 28.2493 14.6739 28.0942 14.6739 27.919C14.6739 27.7557 14.6254 27.6184 14.5283 27.5071C14.4336 27.3958 14.2939 27.3011 14.1093 27.223C13.927 27.1449 13.7033 27.0739 13.4381 27.0099L12.6462 26.8111C12.0331 26.6619 11.5489 26.4287 11.1938 26.1115C10.8387 25.7943 10.6623 25.367 10.6647 24.8295C10.6623 24.3892 10.7795 24.0045 11.0162 23.6754C11.2554 23.3464 11.5832 23.0895 11.9999 22.9048C12.4166 22.7202 12.8901 22.6278 13.4204 22.6278C13.9601 22.6278 14.4313 22.7202 14.8337 22.9048C15.2385 23.0895 15.5534 23.3464 15.7783 23.6754C16.0032 24.0045 16.1192 24.3857 16.1263 24.8189H14.6526Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/json.svg b/web/src/assets/svg/file-icon/json.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5ead80c1e29316f8c22cce8ffc2b60fa9e74708a
--- /dev/null
+++ b/web/src/assets/svg/file-icon/json.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="34" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M7.82821 22.7273H9.3481V27.7983C9.3481 28.267 9.24275 28.6742 9.03205 29.0199C8.82372 29.3655 8.53371 29.6319 8.16202 29.8189C7.79033 30.0059 7.35828 30.0994 6.86586 30.0994C6.42788 30.0994 6.03016 30.0225 5.67267 29.8686C5.31756 29.7124 5.03584 29.4756 4.8275 29.1584C4.61917 28.8388 4.51619 28.4375 4.51855 27.9545H6.04909C6.05383 28.1463 6.09289 28.3108 6.16628 28.4482C6.24204 28.5831 6.34502 28.6873 6.47523 28.7607C6.60781 28.8317 6.76406 28.8672 6.94398 28.8672C7.13337 28.8672 7.29318 28.8269 7.42338 28.7464C7.55596 28.6636 7.65658 28.5429 7.72523 28.3842C7.79389 28.2256 7.82821 28.0303 7.82821 27.7983V22.7273ZM14.5647 24.8189C14.5363 24.5324 14.4144 24.3099 14.199 24.1513C13.9835 23.9927 13.6911 23.9134 13.3218 23.9134C13.0709 23.9134 12.859 23.9489 12.6862 24.0199C12.5133 24.0885 12.3808 24.1844 12.2884 24.3075C12.1985 24.4306 12.1535 24.5703 12.1535 24.7266C12.1488 24.8568 12.176 24.9704 12.2352 25.0675C12.2967 25.1645 12.3808 25.2486 12.4873 25.3196C12.5938 25.3883 12.7169 25.4486 12.8566 25.5007C12.9963 25.5504 13.1454 25.593 13.3041 25.6286L13.9575 25.7848C14.2747 25.8558 14.5659 25.9505 14.8311 26.0689C15.0962 26.1873 15.3258 26.3329 15.52 26.5057C15.7141 26.6785 15.8644 26.8821 15.971 27.1165C16.0799 27.3509 16.1355 27.6196 16.1379 27.9226C16.1355 28.3677 16.0219 28.7536 15.797 29.0803C15.5744 29.4046 15.2525 29.6567 14.8311 29.8366C14.412 30.0142 13.9066 30.103 13.3147 30.103C12.7276 30.103 12.2162 30.013 11.7806 29.8331C11.3474 29.6532 11.0088 29.3868 10.765 29.0341C10.5235 28.679 10.3969 28.2398 10.385 27.7166H11.873C11.8895 27.9605 11.9594 28.1641 12.0825 28.3274C12.2079 28.4884 12.3749 28.6103 12.5832 28.6932C12.7939 28.7737 13.0318 28.8139 13.297 28.8139C13.5574 28.8139 13.7835 28.776 13.9752 28.7003C14.1694 28.6245 14.3197 28.5192 14.4262 28.3842C14.5328 28.2493 14.586 28.0942 14.586 27.919C14.586 27.7557 14.5375 27.6184 14.4404 27.5071C14.3457 27.3958 14.2061 27.3011 14.0214 27.223C13.8391 27.1449 13.6154 27.0739 13.3502 27.0099L12.5583 26.8111C11.9452 26.6619 11.461 26.4287 11.1059 26.1115C10.7508 25.7943 10.5744 25.367 10.5768 24.8295C10.5744 24.3892 10.6916 24.0045 10.9284 23.6754C11.1675 23.3464 11.4954 23.0895 11.912 22.9048C12.3287 22.7202 12.8022 22.6278 13.3325 22.6278C13.8722 22.6278 14.3434 22.7202 14.7458 22.9048C15.1507 23.0895 15.4655 23.3464 15.6904 23.6754C15.9153 24.0045 16.0313 24.3857 16.0384 24.8189H14.5647ZM23.8554 26.3636C23.8554 27.1567 23.705 27.8314 23.4044 28.3878C23.1061 28.9441 22.6989 29.3691 22.1828 29.6626C21.6691 29.9538 21.0914 30.0994 20.4498 30.0994C19.8035 30.0994 19.2235 29.9527 18.7098 29.6591C18.1961 29.3655 17.79 28.9406 17.4917 28.3842C17.1934 27.8279 17.0443 27.1544 17.0443 26.3636C17.0443 25.5705 17.1934 24.8958 17.4917 24.3395C17.79 23.7831 18.1961 23.3594 18.7098 23.0682C19.2235 22.7746 19.8035 22.6278 20.4498 22.6278C21.0914 22.6278 21.6691 22.7746 22.1828 23.0682C22.6989 23.3594 23.1061 23.7831 23.4044 24.3395C23.705 24.8958 23.8554 25.5705 23.8554 26.3636ZM22.2964 26.3636C22.2964 25.8499 22.2195 25.4167 22.0656 25.0639C21.9141 24.7112 21.6998 24.4437 21.4229 24.2614C21.1459 24.0791 20.8215 23.9879 20.4498 23.9879C20.0782 23.9879 19.7538 24.0791 19.4768 24.2614C19.1998 24.4437 18.9844 24.7112 18.8305 25.0639C18.679 25.4167 18.6032 25.8499 18.6032 26.3636C18.6032 26.8774 18.679 27.3106 18.8305 27.6634C18.9844 28.0161 19.1998 28.2836 19.4768 28.4659C19.7538 28.6482 20.0782 28.7393 20.4498 28.7393C20.8215 28.7393 21.1459 28.6482 21.4229 28.4659C21.6998 28.2836 21.9141 28.0161 22.0656 27.6634C22.2195 27.3106 22.2964 26.8774 22.2964 26.3636ZM31.0775 22.7273V30H29.7494L26.5853 25.4226H26.532V30H24.9944V22.7273H26.3438L29.483 27.3011H29.547V22.7273H31.0775Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/mkv.svg b/web/src/assets/svg/file-icon/mkv.svg
new file mode 100644
index 0000000000000000000000000000000000000000..2b00a8eced65e6cece9d1446d32900f7a06717c6
--- /dev/null
+++ b/web/src/assets/svg/file-icon/mkv.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="30" height="16" rx="2" fill="#155EEF" />
+    <path
+        d="M4.86941 22.7273H6.76571L8.76855 27.6136H8.85378L10.8566 22.7273H12.7529V30H11.2615V25.2663H11.2011L9.31898 29.9645H8.30336L6.42125 25.2486H6.36088V30H4.86941V22.7273ZM14.0198 30V22.7273H15.5574V25.9339H15.6533L18.2705 22.7273H20.1135L17.4147 25.9837L20.1455 30H18.306L16.3138 27.0099L15.5574 27.9332V30H14.0198ZM22.2282 22.7273L23.9861 28.2528H24.0535L25.8149 22.7273H27.5194L25.0123 30H23.0308L20.5202 22.7273H22.2282Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/mp3.svg b/web/src/assets/svg/file-icon/mp3.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b311e4d535a306a0072106548cd1400c485ed5fd
--- /dev/null
+++ b/web/src/assets/svg/file-icon/mp3.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="29" height="16" rx="2" fill="#DD2590" />
+    <path
+        d="M5.0237 22.7273H6.92001L8.92285 27.6136H9.00808L11.0109 22.7273H12.9072V30H11.4157V25.2663H11.3554L9.47328 29.9645H8.45765L6.57555 25.2486H6.51518V30H5.0237V22.7273ZM14.1741 30V22.7273H17.0434C17.595 22.7273 18.065 22.8326 18.4532 23.0433C18.8415 23.2517 19.1374 23.5417 19.341 23.9134C19.547 24.2827 19.6499 24.7088 19.6499 25.1918C19.6499 25.6747 19.5458 26.1009 19.3374 26.4702C19.1291 26.8395 18.8273 27.1271 18.4319 27.3331C18.0389 27.5391 17.5631 27.642 17.0044 27.642H15.1755V26.4098H16.7558C17.0517 26.4098 17.2955 26.3589 17.4873 26.2571C17.6814 26.1529 17.8258 26.0097 17.9205 25.8274C18.0176 25.6428 18.0661 25.4309 18.0661 25.1918C18.0661 24.9503 18.0176 24.7396 17.9205 24.5597C17.8258 24.3774 17.6814 24.2365 17.4873 24.1371C17.2932 24.0353 17.047 23.9844 16.7487 23.9844H15.7117V30H14.1741ZM23.2943 30.0994C22.764 30.0994 22.2917 30.0083 21.8774 29.826C21.4655 29.6413 21.1399 29.388 20.9008 29.0661C20.6641 28.7417 20.5422 28.3677 20.5351 27.9439H22.0834C22.0928 28.1214 22.1508 28.2777 22.2574 28.4126C22.3663 28.5452 22.5107 28.6482 22.6906 28.7216C22.8705 28.795 23.0729 28.8317 23.2979 28.8317C23.5322 28.8317 23.7394 28.7902 23.9193 28.7074C24.0992 28.6245 24.2401 28.5097 24.3419 28.3629C24.4437 28.2161 24.4946 28.0469 24.4946 27.8551C24.4946 27.661 24.4401 27.4893 24.3312 27.3402C24.2247 27.1887 24.0708 27.0703 23.8696 26.9851C23.6707 26.8999 23.434 26.8572 23.1594 26.8572H22.4811V25.728H23.1594C23.3914 25.728 23.5961 25.6877 23.7737 25.6072C23.9536 25.5268 24.0933 25.4155 24.1927 25.2734C24.2922 25.129 24.3419 24.9609 24.3419 24.7692C24.3419 24.5869 24.2981 24.4271 24.2105 24.2898C24.1253 24.1501 24.0045 24.0412 23.8483 23.9631C23.6944 23.8849 23.5145 23.8459 23.3085 23.8459C23.1002 23.8459 22.9096 23.8838 22.7368 23.9595C22.564 24.0329 22.4255 24.1383 22.3213 24.2756C22.2171 24.4129 22.1615 24.5739 22.1544 24.7585H20.6807C20.6878 24.3395 20.8073 23.9702 21.0393 23.6506C21.2713 23.331 21.5838 23.0812 21.9768 22.9013C22.3722 22.719 22.8184 22.6278 23.3156 22.6278C23.8175 22.6278 24.2567 22.719 24.6331 22.9013C25.0095 23.0836 25.3019 23.3298 25.5102 23.6399C25.7209 23.9477 25.8251 24.2933 25.8227 24.6768C25.8251 25.084 25.6984 25.4238 25.4427 25.696C25.1894 25.9683 24.8592 26.1411 24.452 26.2145V26.2713C24.987 26.34 25.3942 26.5258 25.6736 26.8288C25.9553 27.1295 26.095 27.5059 26.0926 27.9581C26.095 28.3724 25.9754 28.7405 25.7339 29.0625C25.4948 29.3845 25.1646 29.6378 24.7432 29.8224C24.3218 30.0071 23.8388 30.0994 23.2943 30.0994Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/mp4.svg b/web/src/assets/svg/file-icon/mp4.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4f5f79dc367db4db031858fd4411cef0f76d3ec8
--- /dev/null
+++ b/web/src/assets/svg/file-icon/mp4.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="29" height="16" rx="2" fill="#155EEF" />
+    <path
+        d="M4.93093 22.7273H6.82724L8.83008 27.6136H8.91531L10.9181 22.7273H12.8145V30H11.323V25.2663H11.2626L9.3805 29.9645H8.36488L6.48278 25.2486H6.42241V30H4.93093V22.7273ZM14.0813 30V22.7273H16.9506C17.5022 22.7273 17.9722 22.8326 18.3604 23.0433C18.7487 23.2517 19.0446 23.5417 19.2482 23.9134C19.4542 24.2827 19.5572 24.7088 19.5572 25.1918C19.5572 25.6747 19.453 26.1009 19.2447 26.4702C19.0363 26.8395 18.7345 27.1271 18.3391 27.3331C17.9461 27.5391 17.4703 27.642 16.9116 27.642H15.0827V26.4098H16.663C16.9589 26.4098 17.2028 26.3589 17.3945 26.2571C17.5887 26.1529 17.7331 26.0097 17.8278 25.8274C17.9248 25.6428 17.9734 25.4309 17.9734 25.1918C17.9734 24.9503 17.9248 24.7396 17.8278 24.5597C17.7331 24.3774 17.5887 24.2365 17.3945 24.1371C17.2004 24.0353 16.9542 23.9844 16.6559 23.9844H15.619V30H14.0813ZM20.4032 28.7216V27.5107L23.4395 22.7273H24.4835V24.4034H23.8656L21.9515 27.4325V27.4893H26.2662V28.7216H20.4032ZM23.894 30V28.3523L23.9224 27.8161V22.7273H25.3642V30H23.894Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/mpeg.svg b/web/src/assets/svg/file-icon/mpeg.svg
new file mode 100644
index 0000000000000000000000000000000000000000..23c01e866ca7754baa3d2f18eb0152ea3dd66c47
--- /dev/null
+++ b/web/src/assets/svg/file-icon/mpeg.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="36" height="16" rx="2" fill="#155EEF" />
+    <path
+        d="M4.95437 22.7273H6.85067L8.85352 27.6136H8.93874L10.9416 22.7273H12.8379V30H11.3464V25.2663H11.286L9.40394 29.9645H8.38832L6.50621 25.2486H6.44585V30H4.95437V22.7273ZM14.1048 30V22.7273H16.9741C17.5257 22.7273 17.9956 22.8326 18.3839 23.0433C18.7721 23.2517 19.0681 23.5417 19.2717 23.9134C19.4776 24.2827 19.5806 24.7088 19.5806 25.1918C19.5806 25.6747 19.4764 26.1009 19.2681 26.4702C19.0598 26.8395 18.7579 27.1271 18.3626 27.3331C17.9696 27.5391 17.4937 27.642 16.935 27.642H15.1062V26.4098H16.6864C16.9824 26.4098 17.2262 26.3589 17.418 26.2571C17.6121 26.1529 17.7565 26.0097 17.8512 25.8274C17.9483 25.6428 17.9968 25.4309 17.9968 25.1918C17.9968 24.9503 17.9483 24.7396 17.8512 24.5597C17.7565 24.3774 17.6121 24.2365 17.418 24.1371C17.2238 24.0353 16.9776 23.9844 16.6793 23.9844H15.6424V30H14.1048ZM20.5794 30V22.7273H25.4799V23.995H22.117V25.728H25.2278V26.9957H22.117V28.7322H25.4941V30H20.5794ZM31.5249 25.0781C31.4751 24.9053 31.4053 24.7526 31.3153 24.62C31.2254 24.4851 31.1153 24.3714 30.9851 24.2791C30.8572 24.1844 30.7105 24.1122 30.5447 24.0625C30.3814 24.0128 30.2003 23.9879 30.0014 23.9879C29.6297 23.9879 29.303 24.0803 29.0213 24.2649C28.742 24.4496 28.5241 24.7183 28.3679 25.071C28.2116 25.4214 28.1335 25.8499 28.1335 26.3565C28.1335 26.8632 28.2105 27.294 28.3643 27.6491C28.5182 28.0043 28.736 28.2753 29.0178 28.4624C29.2995 28.647 29.6321 28.7393 30.0156 28.7393C30.3636 28.7393 30.6607 28.6778 30.907 28.5547C31.1555 28.4292 31.3449 28.2528 31.4751 28.0256C31.6077 27.7983 31.674 27.5296 31.674 27.2195L31.9865 27.2656H30.1115V26.108H33.1548V27.0241C33.1548 27.6634 33.0199 28.2126 32.75 28.6719C32.4801 29.1288 32.1084 29.4815 31.6349 29.7301C31.1615 29.9763 30.6193 30.0994 30.0085 30.0994C29.3267 30.0994 28.7277 29.9491 28.2116 29.6484C27.6955 29.3454 27.2931 28.9157 27.0043 28.3594C26.7178 27.8007 26.5746 27.1378 26.5746 26.3707C26.5746 25.7812 26.6598 25.2557 26.8303 24.794C27.0031 24.33 27.2446 23.937 27.5547 23.6151C27.8648 23.2931 28.2259 23.0481 28.6378 22.88C29.0497 22.7119 29.496 22.6278 29.9766 22.6278C30.3885 22.6278 30.772 22.6882 31.1271 22.8089C31.4822 22.9273 31.7971 23.0954 32.0717 23.3132C32.3487 23.531 32.5748 23.7902 32.75 24.0909C32.9252 24.3892 33.0376 24.7183 33.0874 25.0781H31.5249Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/pdf.svg b/web/src/assets/svg/file-icon/pdf.svg
new file mode 100644
index 0000000000000000000000000000000000000000..6e1a5f060e42c08313f7a2961b1a054cac8b7965
--- /dev/null
+++ b/web/src/assets/svg/file-icon/pdf.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="26" height="16" rx="2" fill="#D92D20" />
+    <path
+        d="M4.8323 30V22.7273H7.70162C8.25323 22.7273 8.72316 22.8326 9.11142 23.0433C9.49967 23.2517 9.7956 23.5417 9.9992 23.9134C10.2052 24.2827 10.3082 24.7088 10.3082 25.1918C10.3082 25.6747 10.204 26.1009 9.99565 26.4702C9.78732 26.8395 9.48547 27.1271 9.09011 27.3331C8.69712 27.5391 8.22127 27.642 7.66255 27.642H5.83372V26.4098H7.41397C7.7099 26.4098 7.95375 26.3589 8.14551 26.2571C8.33964 26.1529 8.48405 26.0097 8.57875 25.8274C8.67581 25.6428 8.72434 25.4309 8.72434 25.1918C8.72434 24.9503 8.67581 24.7396 8.57875 24.5597C8.48405 24.3774 8.33964 24.2365 8.14551 24.1371C7.95138 24.0353 7.70517 23.9844 7.40687 23.9844H6.36994V30H4.8323ZM13.885 30H11.3069V22.7273H13.9063C14.6379 22.7273 15.2676 22.8729 15.7955 23.1641C16.3235 23.4529 16.7295 23.8684 17.0136 24.4105C17.3 24.9527 17.4433 25.6013 17.4433 26.3565C17.4433 27.1141 17.3 27.7652 17.0136 28.3097C16.7295 28.8542 16.3211 29.272 15.7884 29.5632C15.2581 29.8544 14.6237 30 13.885 30ZM12.8445 28.6825H13.8211C14.2757 28.6825 14.658 28.602 14.9681 28.4411C15.2806 28.2777 15.515 28.0256 15.6713 27.6847C15.8299 27.3414 15.9092 26.8987 15.9092 26.3565C15.9092 25.8191 15.8299 25.38 15.6713 25.0391C15.515 24.6982 15.2818 24.4472 14.9717 24.2862C14.6615 24.1252 14.2792 24.0447 13.8247 24.0447H12.8445V28.6825ZM18.5823 30V22.7273H23.3976V23.995H20.1199V25.728H23.078V26.9957H20.1199V30H18.5823Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/png.svg b/web/src/assets/svg/file-icon/png.svg
new file mode 100644
index 0000000000000000000000000000000000000000..d581915bdd69b190fb9c316350423cb1dce9ecd5
--- /dev/null
+++ b/web/src/assets/svg/file-icon/png.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="28" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M4.91433 30V22.7273H7.78365C8.33526 22.7273 8.80519 22.8326 9.19345 23.0433C9.58171 23.2517 9.87763 23.5417 10.0812 23.9134C10.2872 24.2827 10.3902 24.7088 10.3902 25.1918C10.3902 25.6747 10.286 26.1009 10.0777 26.4702C9.86935 26.8395 9.5675 27.1271 9.17214 27.3331C8.77915 27.5391 8.3033 27.642 7.74458 27.642H5.91575V26.4098H7.496C7.79193 26.4098 8.03578 26.3589 8.22754 26.2571C8.42167 26.1529 8.56608 26.0097 8.66078 25.8274C8.75784 25.6428 8.80637 25.4309 8.80637 25.1918C8.80637 24.9503 8.75784 24.7396 8.66078 24.5597C8.56608 24.3774 8.42167 24.2365 8.22754 24.1371C8.03341 24.0353 7.7872 23.9844 7.4889 23.9844H6.45197V30H4.91433ZM17.472 22.7273V30H16.1439L12.9798 25.4226H12.9266V30H11.3889V22.7273H12.7384L15.8776 27.3011H15.9415V22.7273H17.472ZM23.5649 25.0781C23.5152 24.9053 23.4453 24.7526 23.3554 24.62C23.2654 24.4851 23.1553 24.3714 23.0251 24.2791C22.8973 24.1844 22.7505 24.1122 22.5848 24.0625C22.4214 24.0128 22.2403 23.9879 22.0415 23.9879C21.6698 23.9879 21.3431 24.0803 21.0613 24.2649C20.782 24.4496 20.5642 24.7183 20.4079 25.071C20.2517 25.4214 20.1736 25.8499 20.1736 26.3565C20.1736 26.8632 20.2505 27.294 20.4044 27.6491C20.5583 28.0043 20.7761 28.2753 21.0578 28.4624C21.3395 28.647 21.6721 28.7393 22.0557 28.7393C22.4037 28.7393 22.7008 28.6778 22.947 28.5547C23.1956 28.4292 23.385 28.2528 23.5152 28.0256C23.6478 27.7983 23.714 27.5296 23.714 27.2195L24.0265 27.2656H22.1515V26.108H25.1949V27.0241C25.1949 27.6634 25.0599 28.2126 24.79 28.6719C24.5202 29.1288 24.1485 29.4815 23.675 29.7301C23.2015 29.9763 22.6594 30.0994 22.0486 30.0994C21.3667 30.0994 20.7678 29.9491 20.2517 29.6484C19.7356 29.3454 19.3331 28.9157 19.0443 28.3594C18.7578 27.8007 18.6146 27.1378 18.6146 26.3707C18.6146 25.7812 18.6998 25.2557 18.8703 24.794C19.0431 24.33 19.2846 23.937 19.5947 23.6151C19.9049 23.2931 20.2659 23.0481 20.6778 22.88C21.0898 22.7119 21.536 22.6278 22.0166 22.6278C22.4285 22.6278 22.8121 22.6882 23.1672 22.8089C23.5223 22.9273 23.8372 23.0954 24.1118 23.3132C24.3888 23.531 24.6148 23.7902 24.79 24.0909C24.9652 24.3892 25.0777 24.7183 25.1274 25.0781H23.5649Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/ppt.svg b/web/src/assets/svg/file-icon/ppt.svg
new file mode 100644
index 0000000000000000000000000000000000000000..365c32de35c59ea55b9151af1b5a947ba1c3527a
--- /dev/null
+++ b/web/src/assets/svg/file-icon/ppt.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="26" height="16" rx="2" fill="#E62E05" />
+    <path
+        d="M4.81765 30V22.7273H7.68697C8.23858 22.7273 8.70851 22.8326 9.09677 23.0433C9.48503 23.2517 9.78095 23.5417 9.98455 23.9134C10.1905 24.2827 10.2935 24.7088 10.2935 25.1918C10.2935 25.6747 10.1893 26.1009 9.981 26.4702C9.77267 26.8395 9.47082 27.1271 9.07546 27.3331C8.68247 27.5391 8.20662 27.642 7.6479 27.642H5.81907V26.4098H7.39933C7.69525 26.4098 7.9391 26.3589 8.13086 26.2571C8.32499 26.1529 8.4694 26.0097 8.5641 25.8274C8.66116 25.6428 8.70969 25.4309 8.70969 25.1918C8.70969 24.9503 8.66116 24.7396 8.5641 24.5597C8.4694 24.3774 8.32499 24.2365 8.13086 24.1371C7.93673 24.0353 7.69052 23.9844 7.39222 23.9844H6.35529V30H4.81765ZM11.2923 30V22.7273H14.1616C14.7132 22.7273 15.1831 22.8326 15.5714 23.0433C15.9596 23.2517 16.2556 23.5417 16.4592 23.9134C16.6651 24.2827 16.7681 24.7088 16.7681 25.1918C16.7681 25.6747 16.6639 26.1009 16.4556 26.4702C16.2473 26.8395 15.9454 27.1271 15.5501 27.3331C15.1571 27.5391 14.6812 27.642 14.1225 27.642H12.2937V26.4098H13.8739C14.1699 26.4098 14.4137 26.3589 14.6055 26.2571C14.7996 26.1529 14.944 26.0097 15.0387 25.8274C15.1358 25.6428 15.1843 25.4309 15.1843 25.1918C15.1843 24.9503 15.1358 24.7396 15.0387 24.5597C14.944 24.3774 14.7996 24.2365 14.6055 24.1371C14.4113 24.0353 14.1651 23.9844 13.8668 23.9844H12.8299V30H11.2923ZM17.4899 23.995V22.7273H23.4629V23.995H21.2363V30H19.7164V23.995H17.4899Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/pptx.svg b/web/src/assets/svg/file-icon/pptx.svg
new file mode 100644
index 0000000000000000000000000000000000000000..09894ce2a018be244d9190e96b6f8178fb7dd5a6
--- /dev/null
+++ b/web/src/assets/svg/file-icon/pptx.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="33" height="16" rx="2" fill="#E62E05" />
+    <path
+        d="M4.74343 30V22.7273H7.61275C8.16436 22.7273 8.63429 22.8326 9.02255 23.0433C9.41081 23.2517 9.70674 23.5417 9.91033 23.9134C10.1163 24.2827 10.2193 24.7088 10.2193 25.1918C10.2193 25.6747 10.1151 26.1009 9.90678 26.4702C9.69845 26.8395 9.3966 27.1271 9.00124 27.3331C8.60825 27.5391 8.1324 27.642 7.57369 27.642H5.74485V26.4098H7.32511C7.62103 26.4098 7.86488 26.3589 8.05664 26.2571C8.25077 26.1529 8.39518 26.0097 8.48988 25.8274C8.58694 25.6428 8.63548 25.4309 8.63548 25.1918C8.63548 24.9503 8.58694 24.7396 8.48988 24.5597C8.39518 24.3774 8.25077 24.2365 8.05664 24.1371C7.86251 24.0353 7.6163 23.9844 7.318 23.9844H6.28107V30H4.74343ZM11.218 30V22.7273H14.0874C14.639 22.7273 15.1089 22.8326 15.4972 23.0433C15.8854 23.2517 16.1813 23.5417 16.3849 23.9134C16.5909 24.2827 16.6939 24.7088 16.6939 25.1918C16.6939 25.6747 16.5897 26.1009 16.3814 26.4702C16.1731 26.8395 15.8712 27.1271 15.4759 27.3331C15.0829 27.5391 14.607 27.642 14.0483 27.642H12.2195V26.4098H13.7997C14.0956 26.4098 14.3395 26.3589 14.5312 26.2571C14.7254 26.1529 14.8698 26.0097 14.9645 25.8274C15.0616 25.6428 15.1101 25.4309 15.1101 25.1918C15.1101 24.9503 15.0616 24.7396 14.9645 24.5597C14.8698 24.3774 14.7254 24.2365 14.5312 24.1371C14.3371 24.0353 14.0909 23.9844 13.7926 23.9844H12.7557V30H11.218ZM17.4157 23.995V22.7273H23.3887V23.995H21.1621V30H19.6422V23.995H17.4157ZM25.8141 22.7273L27.2807 25.206H27.3375L28.8113 22.7273H30.5478L28.3283 26.3636L30.5975 30H28.829L27.3375 27.5178H27.2807L25.7892 30H24.0279L26.3042 26.3636L24.0705 22.7273H25.8141Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/psd.svg b/web/src/assets/svg/file-icon/psd.svg
new file mode 100644
index 0000000000000000000000000000000000000000..0aa30c0cf55410b1075d919c8199c6e858ddcabf
--- /dev/null
+++ b/web/src/assets/svg/file-icon/psd.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="27" height="16" rx="2" fill="#155EEF" />
+    <path
+        d="M4.98074 30V22.7273H7.85005C8.40166 22.7273 8.8716 22.8326 9.25985 23.0433C9.64811 23.2517 9.94404 23.5417 10.1476 23.9134C10.3536 24.2827 10.4566 24.7088 10.4566 25.1918C10.4566 25.6747 10.3524 26.1009 10.1441 26.4702C9.93575 26.8395 9.63391 27.1271 9.23855 27.3331C8.84556 27.5391 8.3697 27.642 7.81099 27.642H5.98216V26.4098H7.56241C7.85834 26.4098 8.10218 26.3589 8.29395 26.2571C8.48807 26.1529 8.63249 26.0097 8.72718 25.8274C8.82425 25.6428 8.87278 25.4309 8.87278 25.1918C8.87278 24.9503 8.82425 24.7396 8.72718 24.5597C8.63249 24.3774 8.48807 24.2365 8.29395 24.1371C8.09982 24.0353 7.8536 23.9844 7.55531 23.9844H6.51838V30H4.98074ZM15.4007 24.8189C15.3722 24.5324 15.2503 24.3099 15.0349 24.1513C14.8195 23.9927 14.5271 23.9134 14.1578 23.9134C13.9068 23.9134 13.6949 23.9489 13.5221 24.0199C13.3493 24.0885 13.2167 24.1844 13.1244 24.3075C13.0344 24.4306 12.9894 24.5703 12.9894 24.7266C12.9847 24.8568 13.0119 24.9704 13.0711 25.0675C13.1327 25.1645 13.2167 25.2486 13.3232 25.3196C13.4298 25.3883 13.5529 25.4486 13.6926 25.5007C13.8322 25.5504 13.9814 25.593 14.14 25.6286L14.7934 25.7848C15.1106 25.8558 15.4018 25.9505 15.667 26.0689C15.9321 26.1873 16.1618 26.3329 16.3559 26.5057C16.55 26.6785 16.7004 26.8821 16.8069 27.1165C16.9158 27.3509 16.9714 27.6196 16.9738 27.9226C16.9714 28.3677 16.8578 28.7536 16.6329 29.0803C16.4104 29.4046 16.0884 29.6567 15.667 29.8366C15.248 30.0142 14.7425 30.103 14.1507 30.103C13.5635 30.103 13.0522 30.013 12.6166 29.8331C12.1833 29.6532 11.8448 29.3868 11.6009 29.0341C11.3595 28.679 11.2328 28.2398 11.221 27.7166H12.7089C12.7255 27.9605 12.7953 28.1641 12.9184 28.3274C13.0439 28.4884 13.2108 28.6103 13.4191 28.6932C13.6298 28.7737 13.8677 28.8139 14.1329 28.8139C14.3933 28.8139 14.6194 28.776 14.8112 28.7003C15.0053 28.6245 15.1556 28.5192 15.2622 28.3842C15.3687 28.2493 15.422 28.0942 15.422 27.919C15.422 27.7557 15.3734 27.6184 15.2764 27.5071C15.1817 27.3958 15.042 27.3011 14.8573 27.223C14.675 27.1449 14.4513 27.0739 14.1862 27.0099L13.3943 26.8111C12.7811 26.6619 12.297 26.4287 11.9419 26.1115C11.5867 25.7943 11.4104 25.367 11.4127 24.8295C11.4104 24.3892 11.5276 24.0045 11.7643 23.6754C12.0034 23.3464 12.3313 23.0895 12.748 22.9048C13.1646 22.7202 13.6381 22.6278 14.1684 22.6278C14.7082 22.6278 15.1793 22.7202 15.5818 22.9048C15.9866 23.0895 16.3015 23.3464 16.5264 23.6754C16.7513 24.0045 16.8673 24.3857 16.8744 24.8189H15.4007ZM20.5862 30H18.0081V22.7273H20.6075C21.339 22.7273 21.9688 22.8729 22.4967 23.1641C23.0247 23.4529 23.4307 23.8684 23.7148 24.4105C24.0012 24.9527 24.1444 25.6013 24.1444 26.3565C24.1444 27.1141 24.0012 27.7652 23.7148 28.3097C23.4307 28.8542 23.0223 29.272 22.4896 29.5632C21.9593 29.8544 21.3248 30 20.5862 30ZM19.5457 28.6825H20.5223C20.9768 28.6825 21.3592 28.602 21.6693 28.4411C21.9818 28.2777 22.2162 28.0256 22.3724 27.6847C22.531 27.3414 22.6104 26.8987 22.6104 26.3565C22.6104 25.8191 22.531 25.38 22.3724 25.0391C22.2162 24.6982 21.983 24.4472 21.6729 24.2862C21.3627 24.1252 20.9804 24.0447 20.5258 24.0447H19.5457V28.6825Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/rss.svg b/web/src/assets/svg/file-icon/rss.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b4114c7b2d5e6fe38a0564f005b116c89e924d68
--- /dev/null
+++ b/web/src/assets/svg/file-icon/rss.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="26" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M4.79812 30V22.7273H7.66744C8.21668 22.7273 8.68543 22.8255 9.07369 23.022C9.46431 23.2161 9.76142 23.492 9.96502 23.8494C10.171 24.2045 10.274 24.6224 10.274 25.103C10.274 25.5859 10.1698 26.0014 9.96147 26.3494C9.75314 26.6951 9.45129 26.9602 9.05593 27.1449C8.66294 27.3295 8.18709 27.4219 7.62837 27.4219H5.70721V26.1861H7.37979C7.67335 26.1861 7.9172 26.1458 8.11133 26.0653C8.30546 25.9848 8.44987 25.8641 8.54457 25.7031C8.64163 25.5421 8.69016 25.3421 8.69016 25.103C8.69016 24.8615 8.64163 24.6579 8.54457 24.4922C8.44987 24.3265 8.30427 24.201 8.10778 24.1158C7.91365 24.0282 7.66862 23.9844 7.37269 23.9844H6.33576V30H4.79812ZM8.72567 26.6903L10.5332 30H8.83576L7.06729 26.6903H8.72567ZM15.3059 24.8189C15.2775 24.5324 15.1556 24.3099 14.9402 24.1513C14.7247 23.9927 14.4324 23.9134 14.063 23.9134C13.8121 23.9134 13.6002 23.9489 13.4274 24.0199C13.2546 24.0885 13.122 24.1844 13.0297 24.3075C12.9397 24.4306 12.8947 24.5703 12.8947 24.7266C12.89 24.8568 12.9172 24.9704 12.9764 25.0675C13.0379 25.1645 13.122 25.2486 13.2285 25.3196C13.335 25.3883 13.4582 25.4486 13.5978 25.5007C13.7375 25.5504 13.8867 25.593 14.0453 25.6286L14.6987 25.7848C15.0159 25.8558 15.3071 25.9505 15.5723 26.0689C15.8374 26.1873 16.0671 26.3329 16.2612 26.5057C16.4553 26.6785 16.6056 26.8821 16.7122 27.1165C16.8211 27.3509 16.8767 27.6196 16.8791 27.9226C16.8767 28.3677 16.7631 28.7536 16.5382 29.0803C16.3156 29.4046 15.9937 29.6567 15.5723 29.8366C15.1532 30.0142 14.6478 30.103 14.0559 30.103C13.4688 30.103 12.9574 30.013 12.5218 29.8331C12.0886 29.6532 11.7501 29.3868 11.5062 29.0341C11.2647 28.679 11.1381 28.2398 11.1262 27.7166H12.6142C12.6307 27.9605 12.7006 28.1641 12.8237 28.3274C12.9492 28.4884 13.1161 28.6103 13.3244 28.6932C13.5351 28.7737 13.773 28.8139 14.0382 28.8139C14.2986 28.8139 14.5247 28.776 14.7164 28.7003C14.9106 28.6245 15.0609 28.5192 15.1674 28.3842C15.274 28.2493 15.3272 28.0942 15.3272 27.919C15.3272 27.7557 15.2787 27.6184 15.1816 27.5071C15.0869 27.3958 14.9473 27.3011 14.7626 27.223C14.5803 27.1449 14.3566 27.0739 14.0914 27.0099L13.2995 26.8111C12.6864 26.6619 12.2022 26.4287 11.8471 26.1115C11.492 25.7943 11.3156 25.367 11.318 24.8295C11.3156 24.3892 11.4328 24.0045 11.6696 23.6754C11.9087 23.3464 12.2366 23.0895 12.6532 22.9048C13.0699 22.7202 13.5434 22.6278 14.0737 22.6278C14.6135 22.6278 15.0846 22.7202 15.487 22.9048C15.8919 23.0895 16.2067 23.3464 16.4316 23.6754C16.6565 24.0045 16.7725 24.3857 16.7797 24.8189H15.3059ZM21.8587 24.8189C21.8303 24.5324 21.7083 24.3099 21.4929 24.1513C21.2775 23.9927 20.9851 23.9134 20.6158 23.9134C20.3648 23.9134 20.1529 23.9489 19.9801 24.0199C19.8073 24.0885 19.6747 24.1844 19.5824 24.3075C19.4924 24.4306 19.4474 24.5703 19.4474 24.7266C19.4427 24.8568 19.4699 24.9704 19.5291 25.0675C19.5907 25.1645 19.6747 25.2486 19.7812 25.3196C19.8878 25.3883 20.0109 25.4486 20.1506 25.5007C20.2902 25.5504 20.4394 25.593 20.598 25.6286L21.2514 25.7848C21.5687 25.8558 21.8598 25.9505 22.125 26.0689C22.3902 26.1873 22.6198 26.3329 22.8139 26.5057C23.008 26.6785 23.1584 26.8821 23.2649 27.1165C23.3738 27.3509 23.4295 27.6196 23.4318 27.9226C23.4295 28.3677 23.3158 28.7536 23.0909 29.0803C22.8684 29.4046 22.5464 29.6567 22.125 29.8366C21.706 30.0142 21.2005 30.103 20.6087 30.103C20.0215 30.103 19.5102 30.013 19.0746 29.8331C18.6413 29.6532 18.3028 29.3868 18.0589 29.0341C17.8175 28.679 17.6908 28.2398 17.679 27.7166H19.1669C19.1835 27.9605 19.2533 28.1641 19.3764 28.3274C19.5019 28.4884 19.6688 28.6103 19.8771 28.6932C20.0878 28.7737 20.3258 28.8139 20.5909 28.8139C20.8513 28.8139 21.0774 28.776 21.2692 28.7003C21.4633 28.6245 21.6136 28.5192 21.7202 28.3842C21.8267 28.2493 21.88 28.0942 21.88 27.919C21.88 27.7557 21.8314 27.6184 21.7344 27.5071C21.6397 27.3958 21.5 27.3011 21.3153 27.223C21.133 27.1449 20.9093 27.0739 20.6442 27.0099L19.8523 26.8111C19.2391 26.6619 18.755 26.4287 18.3999 26.1115C18.0447 25.7943 17.8684 25.367 17.8707 24.8295C17.8684 24.3892 17.9856 24.0045 18.2223 23.6754C18.4614 23.3464 18.7893 23.0895 19.206 22.9048C19.6226 22.7202 20.0961 22.6278 20.6264 22.6278C21.1662 22.6278 21.6373 22.7202 22.0398 22.9048C22.4446 23.0895 22.7595 23.3464 22.9844 23.6754C23.2093 24.0045 23.3253 24.3857 23.3324 24.8189H21.8587Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/sql.svg b/web/src/assets/svg/file-icon/sql.svg
new file mode 100644
index 0000000000000000000000000000000000000000..0368a502cd712bcc9c5de1c5390aad53b87e98cf
--- /dev/null
+++ b/web/src/assets/svg/file-icon/sql.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="27" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M9.053 24.8189C9.02459 24.5324 8.90267 24.3099 8.68723 24.1513C8.4718 23.9927 8.17942 23.9134 7.8101 23.9134C7.55916 23.9134 7.34727 23.9489 7.17445 24.0199C7.00163 24.0885 6.86905 24.1844 6.77672 24.3075C6.68676 24.4306 6.64178 24.5703 6.64178 24.7266C6.63704 24.8568 6.66427 24.9704 6.72346 25.0675C6.78501 25.1645 6.86905 25.2486 6.97559 25.3196C7.08212 25.3883 7.20523 25.4486 7.3449 25.5007C7.48458 25.5504 7.63373 25.593 7.79235 25.6286L8.44576 25.7848C8.76299 25.8558 9.05418 25.9505 9.31934 26.0689C9.58449 26.1873 9.81413 26.3329 10.0083 26.5057C10.2024 26.6785 10.3527 26.8821 10.4593 27.1165C10.5682 27.3509 10.6238 27.6196 10.6262 27.9226C10.6238 28.3677 10.5102 28.7536 10.2852 29.0803C10.0627 29.4046 9.74074 29.6567 9.31934 29.8366C8.9003 30.0142 8.39486 30.103 7.803 30.103C7.21588 30.103 6.70452 30.013 6.26891 29.8331C5.83567 29.6532 5.49713 29.3868 5.25328 29.0341C5.01181 28.679 4.88515 28.2398 4.87331 27.7166H6.36124C6.37781 27.9605 6.44765 28.1641 6.57076 28.3274C6.69623 28.4884 6.86313 28.6103 7.07147 28.6932C7.28217 28.7737 7.52009 28.8139 7.78525 28.8139C8.04566 28.8139 8.27175 28.776 8.46351 28.7003C8.65764 28.6245 8.80797 28.5192 8.91451 28.3842C9.02104 28.2493 9.07431 28.0942 9.07431 27.919C9.07431 27.7557 9.02578 27.6184 8.92871 27.5071C8.83401 27.3958 8.69434 27.3011 8.50968 27.223C8.32739 27.1449 8.10366 27.0739 7.83851 27.0099L7.04661 26.8111C6.43345 26.6619 5.94931 26.4287 5.59419 26.1115C5.23908 25.7943 5.06271 25.367 5.06507 24.8295C5.06271 24.3892 5.17989 24.0045 5.41664 23.6754C5.65575 23.3464 5.98364 23.0895 6.4003 22.9048C6.81697 22.7202 7.29045 22.6278 7.82076 22.6278C8.36053 22.6278 8.83165 22.7202 9.23411 22.9048C9.63894 23.0895 9.95381 23.3464 10.1787 23.6754C10.4036 24.0045 10.5196 24.3857 10.5267 24.8189H9.053ZM14.4055 27.4716H15.7123L16.3692 28.3168L17.0155 29.0696L18.2336 30.5966H16.7989L15.9608 29.5668L15.5312 28.956L14.4055 27.4716ZM18.3437 26.3636C18.3437 27.1567 18.1933 27.8314 17.8927 28.3878C17.5944 28.9441 17.1872 29.3691 16.6711 29.6626C16.1573 29.9538 15.5797 30.0994 14.9381 30.0994C14.2918 30.0994 13.7118 29.9527 13.1981 29.6591C12.6843 29.3655 12.2783 28.9406 11.98 28.3842C11.6817 27.8279 11.5326 27.1544 11.5326 26.3636C11.5326 25.5705 11.6817 24.8958 11.98 24.3395C12.2783 23.7831 12.6843 23.3594 13.1981 23.0682C13.7118 22.7746 14.2918 22.6278 14.9381 22.6278C15.5797 22.6278 16.1573 22.7746 16.6711 23.0682C17.1872 23.3594 17.5944 23.7831 17.8927 24.3395C18.1933 24.8958 18.3437 25.5705 18.3437 26.3636ZM16.7847 26.3636C16.7847 25.8499 16.7078 25.4167 16.5539 25.0639C16.4024 24.7112 16.1881 24.4437 15.9111 24.2614C15.6341 24.0791 15.3098 23.9879 14.9381 23.9879C14.5664 23.9879 14.2421 24.0791 13.9651 24.2614C13.6881 24.4437 13.4727 24.7112 13.3188 25.0639C13.1673 25.4167 13.0915 25.8499 13.0915 26.3636C13.0915 26.8774 13.1673 27.3106 13.3188 27.6634C13.4727 28.0161 13.6881 28.2836 13.9651 28.4659C14.2421 28.6482 14.5664 28.7393 14.9381 28.7393C15.3098 28.7393 15.6341 28.6482 15.9111 28.4659C16.1881 28.2836 16.4024 28.0161 16.5539 27.6634C16.7078 27.3106 16.7847 26.8774 16.7847 26.3636ZM19.4827 30V22.7273H21.0203V28.7322H24.1382V30H19.4827Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/svg.svg b/web/src/assets/svg/file-icon/svg.svg
new file mode 100644
index 0000000000000000000000000000000000000000..0957124cfcee59cf590477ad6d3e3d34dd69f0db
--- /dev/null
+++ b/web/src/assets/svg/file-icon/svg.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="28" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M8.96218 24.8189C8.93377 24.5324 8.81185 24.3099 8.59641 24.1513C8.38098 23.9927 8.0886 23.9134 7.71928 23.9134C7.46834 23.9134 7.25645 23.9489 7.08363 24.0199C6.91081 24.0885 6.77823 24.1844 6.6859 24.3075C6.59594 24.4306 6.55096 24.5703 6.55096 24.7266C6.54622 24.8568 6.57345 24.9704 6.63263 25.0675C6.69419 25.1645 6.77823 25.2486 6.88477 25.3196C6.9913 25.3883 7.11441 25.4486 7.25408 25.5007C7.39376 25.5504 7.54291 25.593 7.70153 25.6286L8.35494 25.7848C8.67217 25.8558 8.96336 25.9505 9.22852 26.0689C9.49367 26.1873 9.72331 26.3329 9.91744 26.5057C10.1116 26.6785 10.2619 26.8821 10.3684 27.1165C10.4773 27.3509 10.533 27.6196 10.5353 27.9226C10.533 28.3677 10.4193 28.7536 10.1944 29.0803C9.97189 29.4046 9.64992 29.6567 9.22852 29.8366C8.80948 30.0142 8.30404 30.103 7.71218 30.103C7.12506 30.103 6.6137 30.013 6.17809 29.8331C5.74485 29.6532 5.40631 29.3868 5.16246 29.0341C4.92099 28.679 4.79433 28.2398 4.78249 27.7166H6.27042C6.28699 27.9605 6.35683 28.1641 6.47994 28.3274C6.60541 28.4884 6.77231 28.6103 6.98065 28.6932C7.19135 28.7737 7.42927 28.8139 7.69442 28.8139C7.95484 28.8139 8.18093 28.776 8.37269 28.7003C8.56682 28.6245 8.71715 28.5192 8.82369 28.3842C8.93022 28.2493 8.98349 28.0942 8.98349 27.919C8.98349 27.7557 8.93496 27.6184 8.83789 27.5071C8.74319 27.3958 8.60352 27.3011 8.41886 27.223C8.23656 27.1449 8.01284 27.0739 7.74769 27.0099L6.95579 26.8111C6.34263 26.6619 5.85849 26.4287 5.50337 26.1115C5.14826 25.7943 4.97189 25.367 4.97425 24.8295C4.97189 24.3892 5.08907 24.0045 5.32582 23.6754C5.56493 23.3464 5.89281 23.0895 6.30948 22.9048C6.72615 22.7202 7.19963 22.6278 7.72994 22.6278C8.26971 22.6278 8.74083 22.7202 9.14329 22.9048C9.54812 23.0895 9.86299 23.3464 10.0879 23.6754C10.3128 24.0045 10.4288 24.3857 10.4359 24.8189H8.96218ZM12.8835 22.7273L14.6413 28.2528H14.7088L16.4702 22.7273H18.1747L15.6676 30H13.6861L11.1754 22.7273H12.8835ZM23.4624 25.0781C23.4126 24.9053 23.3428 24.7526 23.2528 24.62C23.1629 24.4851 23.0528 24.3714 22.9226 24.2791C22.7947 24.1844 22.648 24.1122 22.4822 24.0625C22.3189 24.0128 22.1378 23.9879 21.9389 23.9879C21.5672 23.9879 21.2405 24.0803 20.9588 24.2649C20.6795 24.4496 20.4616 24.7183 20.3054 25.071C20.1491 25.4214 20.071 25.8499 20.071 26.3565C20.071 26.8632 20.148 27.294 20.3018 27.6491C20.4557 28.0043 20.6735 28.2753 20.9553 28.4624C21.237 28.647 21.5696 28.7393 21.9531 28.7393C22.3011 28.7393 22.5982 28.6778 22.8445 28.5547C23.093 28.4292 23.2824 28.2528 23.4126 28.0256C23.5452 27.7983 23.6115 27.5296 23.6115 27.2195L23.924 27.2656H22.049V26.108H25.0923V27.0241C25.0923 27.6634 24.9574 28.2126 24.6875 28.6719C24.4176 29.1288 24.0459 29.4815 23.5724 29.7301C23.099 29.9763 22.5568 30.0994 21.946 30.0994C21.2642 30.0994 20.6652 29.9491 20.1491 29.6484C19.633 29.3454 19.2306 28.9157 18.9418 28.3594C18.6553 27.8007 18.5121 27.1378 18.5121 26.3707C18.5121 25.7812 18.5973 25.2557 18.7678 24.794C18.9406 24.33 19.1821 23.937 19.4922 23.6151C19.8023 23.2931 20.1634 23.0481 20.5753 22.88C20.9872 22.7119 21.4335 22.6278 21.9141 22.6278C22.326 22.6278 22.7095 22.6882 23.0646 22.8089C23.4197 22.9273 23.7346 23.0954 24.0092 23.3132C24.2862 23.531 24.5123 23.7902 24.6875 24.0909C24.8627 24.3892 24.9751 24.7183 25.0249 25.0781H23.4624Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/tiff.svg b/web/src/assets/svg/file-icon/tiff.svg
new file mode 100644
index 0000000000000000000000000000000000000000..de818515a6cc673c1868d4ace245d27be66486bd
--- /dev/null
+++ b/web/src/assets/svg/file-icon/tiff.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="28" height="16" rx="2" fill="#7F56D9" />
+    <path
+        d="M4.76429 23.995V22.7273H10.7373V23.995H8.51074V30H6.99086V23.995H4.76429ZM13.2586 22.7273V30H11.721V22.7273H13.2586ZM14.5237 30V22.7273H19.339V23.995H16.0613V25.728H19.0194V26.9957H16.0613V30H14.5237ZM20.3733 30V22.7273H25.1887V23.995H21.911V25.728H24.8691V26.9957H21.911V30H20.3733Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/txt.svg b/web/src/assets/svg/file-icon/txt.svg
new file mode 100644
index 0000000000000000000000000000000000000000..0a4fe6fae031ec6e3231c542426138a672af1daa
--- /dev/null
+++ b/web/src/assets/svg/file-icon/txt.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="27" height="16" rx="2" fill="#475467" />
+    <path
+        d="M4.60121 23.995V22.7273H10.5742V23.995H8.34766V30H6.82777V23.995H4.60121ZM12.9996 22.7273L14.4663 25.206H14.5231L15.9968 22.7273H17.7333L15.5138 26.3636L17.783 30H16.0146L14.5231 27.5178H14.4663L12.9748 30H11.2134L13.4897 26.3636L11.256 22.7273H12.9996ZM18.4293 23.995V22.7273H24.4023V23.995H22.1758V30H20.6559V23.995H18.4293Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/wav.svg b/web/src/assets/svg/file-icon/wav.svg
new file mode 100644
index 0000000000000000000000000000000000000000..d2b018eef1cb8089598fd6ad0df8805ba289b83a
--- /dev/null
+++ b/web/src/assets/svg/file-icon/wav.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="30" height="16" rx="2" fill="#DD2590" />
+    <path
+        d="M6.42836 30L4.34739 22.7273H6.02708L7.23091 27.7805H7.29128L8.61941 22.7273H10.0576L11.3822 27.7912H11.4461L12.6499 22.7273H14.3296L12.2487 30H10.7501L9.36515 25.245H9.30833L7.92694 30H6.42836ZM15.6737 30H14.026L16.5367 22.7273H18.5182L21.0253 30H19.3776L17.5558 24.3892H17.499L15.6737 30ZM15.5708 27.1413H19.4628V28.3416H15.5708V27.1413ZM22.3064 22.7273L24.0642 28.2528H24.1317L25.893 22.7273H27.5976L25.0905 30H23.1089L20.5983 22.7273H22.3064Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/webp.svg b/web/src/assets/svg/file-icon/webp.svg
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/web/src/assets/svg/file-icon/xls.svg b/web/src/assets/svg/file-icon/xls.svg
new file mode 100644
index 0000000000000000000000000000000000000000..7fe4a5c705d1c9ddfbdba45aa379debbb3b5d63c
--- /dev/null
+++ b/web/src/assets/svg/file-icon/xls.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="26" height="16" rx="2" fill="#079455" />
+    <path
+        d="M6.38636 22.7273L7.85298 25.206H7.9098L9.38352 22.7273H11.12L8.90057 26.3636L11.1697 30H9.40128L7.9098 27.5178H7.85298L6.36151 30H4.60014L6.87642 26.3636L4.64276 22.7273H6.38636ZM12.093 30V22.7273H13.6307V28.7322H16.7486V30H12.093ZM21.7122 24.8189C21.6838 24.5324 21.5618 24.3099 21.3464 24.1513C21.131 23.9927 20.8386 23.9134 20.4693 23.9134C20.2183 23.9134 20.0065 23.9489 19.8336 24.0199C19.6608 24.0885 19.5282 24.1844 19.4359 24.3075C19.3459 24.4306 19.301 24.5703 19.301 24.7266C19.2962 24.8568 19.3234 24.9704 19.3826 25.0675C19.4442 25.1645 19.5282 25.2486 19.6348 25.3196C19.7413 25.3883 19.8644 25.4486 20.0041 25.5007C20.1438 25.5504 20.2929 25.593 20.4515 25.6286L21.1049 25.7848C21.4222 25.8558 21.7134 25.9505 21.9785 26.0689C22.2437 26.1873 22.4733 26.3329 22.6674 26.5057C22.8616 26.6785 23.0119 26.8821 23.1184 27.1165C23.2273 27.3509 23.283 27.6196 23.2853 27.9226C23.283 28.3677 23.1693 28.7536 22.9444 29.0803C22.7219 29.4046 22.3999 29.6567 21.9785 29.8366C21.5595 30.0142 21.054 30.103 20.4622 30.103C19.8751 30.103 19.3637 30.013 18.9281 29.8331C18.4949 29.6532 18.1563 29.3868 17.9125 29.0341C17.671 28.679 17.5443 28.2398 17.5325 27.7166H19.0204C19.037 27.9605 19.1068 28.1641 19.2299 28.3274C19.3554 28.4884 19.5223 28.6103 19.7306 28.6932C19.9413 28.7737 20.1793 28.8139 20.4444 28.8139C20.7048 28.8139 20.9309 28.776 21.1227 28.7003C21.3168 28.6245 21.4672 28.5192 21.5737 28.3842C21.6802 28.2493 21.7335 28.0942 21.7335 27.919C21.7335 27.7557 21.685 27.6184 21.5879 27.5071C21.4932 27.3958 21.3535 27.3011 21.1689 27.223C20.9866 27.1449 20.7628 27.0739 20.4977 27.0099L19.7058 26.8111C19.0926 26.6619 18.6085 26.4287 18.2534 26.1115C17.8983 25.7943 17.7219 25.367 17.7243 24.8295C17.7219 24.3892 17.8391 24.0045 18.0758 23.6754C18.3149 23.3464 18.6428 23.0895 19.0595 22.9048C19.4761 22.7202 19.9496 22.6278 20.4799 22.6278C21.0197 22.6278 21.4908 22.7202 21.8933 22.9048C22.2981 23.0895 22.613 23.3464 22.8379 23.6754C23.0628 24.0045 23.1788 24.3857 23.1859 24.8189H21.7122Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/xlsx.svg b/web/src/assets/svg/file-icon/xlsx.svg
new file mode 100644
index 0000000000000000000000000000000000000000..544a1384a82c79095bc45cda9898b42f5d4bee84
--- /dev/null
+++ b/web/src/assets/svg/file-icon/xlsx.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="33" height="16" rx="2" fill="#079455" />
+    <path
+        d="M6.31214 22.7273L7.77876 25.206H7.83558L9.3093 22.7273H11.0458L8.82635 26.3636L11.0955 30H9.32706L7.83558 27.5178H7.77876L6.28729 30H4.52592L6.8022 26.3636L4.56854 22.7273H6.31214ZM12.0188 30V22.7273H13.5565V28.7322H16.6744V30H12.0188ZM21.638 24.8189C21.6096 24.5324 21.4876 24.3099 21.2722 24.1513C21.0568 23.9927 20.7644 23.9134 20.3951 23.9134C20.1441 23.9134 19.9322 23.9489 19.7594 24.0199C19.5866 24.0885 19.454 24.1844 19.3617 24.3075C19.2717 24.4306 19.2267 24.5703 19.2267 24.7266C19.222 24.8568 19.2492 24.9704 19.3084 25.0675C19.37 25.1645 19.454 25.2486 19.5605 25.3196C19.6671 25.3883 19.7902 25.4486 19.9299 25.5007C20.0695 25.5504 20.2187 25.593 20.3773 25.6286L21.0307 25.7848C21.348 25.8558 21.6391 25.9505 21.9043 26.0689C22.1694 26.1873 22.3991 26.3329 22.5932 26.5057C22.7873 26.6785 22.9377 26.8821 23.0442 27.1165C23.1531 27.3509 23.2087 27.6196 23.2111 27.9226C23.2087 28.3677 23.0951 28.7536 22.8702 29.0803C22.6477 29.4046 22.3257 29.6567 21.9043 29.8366C21.4853 30.0142 20.9798 30.103 20.388 30.103C19.8008 30.103 19.2895 30.013 18.8539 29.8331C18.4206 29.6532 18.0821 29.3868 17.8382 29.0341C17.5968 28.679 17.4701 28.2398 17.4583 27.7166H18.9462C18.9628 27.9605 19.0326 28.1641 19.1557 28.3274C19.2812 28.4884 19.4481 28.6103 19.6564 28.6932C19.8671 28.7737 20.1051 28.8139 20.3702 28.8139C20.6306 28.8139 20.8567 28.776 21.0485 28.7003C21.2426 28.6245 21.3929 28.5192 21.4995 28.3842C21.606 28.2493 21.6593 28.0942 21.6593 27.919C21.6593 27.7557 21.6107 27.6184 21.5137 27.5071C21.419 27.3958 21.2793 27.3011 21.0946 27.223C20.9123 27.1449 20.6886 27.0739 20.4235 27.0099L19.6316 26.8111C19.0184 26.6619 18.5343 26.4287 18.1792 26.1115C17.824 25.7943 17.6477 25.367 17.65 24.8295C17.6477 24.3892 17.7649 24.0045 18.0016 23.6754C18.2407 23.3464 18.5686 23.0895 18.9853 22.9048C19.4019 22.7202 19.8754 22.6278 20.4057 22.6278C20.9455 22.6278 21.4166 22.7202 21.8191 22.9048C22.2239 23.0895 22.5388 23.3464 22.7637 23.6754C22.9886 24.0045 23.1046 24.3857 23.1117 24.8189H21.638ZM25.6871 22.7273L27.1538 25.206H27.2106L28.6843 22.7273H30.4208L28.2013 26.3636L30.4705 30H28.7021L27.2106 27.5178H27.1538L25.6623 30H23.9009L26.1772 26.3636L23.9435 22.7273H25.6871Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/assets/svg/file-icon/xml.svg b/web/src/assets/svg/file-icon/xml.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4e61546c2a58b0b9387a4fa4aca6d9d0ef269cd0
--- /dev/null
+++ b/web/src/assets/svg/file-icon/xml.svg
@@ -0,0 +1,10 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+        d="M7.75 4C7.75 2.20508 9.20508 0.75 11 0.75H27C27.1212 0.75 27.2375 0.798159 27.3232 0.883885L38.1161 11.6768C38.2018 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4Z"
+        stroke="#D0D5DD" stroke-width="1.5" />
+    <path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D0D5DD" stroke-width="1.5" />
+    <rect x="1" y="18" width="28" height="16" rx="2" fill="#444CE7" />
+    <path
+        d="M6.08754 22.7273L7.55415 25.206H7.61097L9.08469 22.7273H10.8212L8.60174 26.3636L10.8709 30H9.10245L7.61097 27.5178H7.55415L6.06268 30H4.30131L6.57759 26.3636L4.34393 22.7273H6.08754ZM11.7942 22.7273H13.6905L15.6934 27.6136H15.7786L17.7814 22.7273H19.6777V30H18.1863V25.2663H18.1259L16.2438 29.9645H15.2282L13.3461 25.2486H13.2857V30H11.7942V22.7273ZM20.9446 30V22.7273H22.4822V28.7322H25.6001V30H20.9446Z"
+        fill="white" />
+</svg>
\ No newline at end of file
diff --git a/web/src/components/new-document-link.tsx b/web/src/components/new-document-link.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..84c0c9378db6d668b1740181dcef4b6ad136df68
--- /dev/null
+++ b/web/src/components/new-document-link.tsx
@@ -0,0 +1,20 @@
+import { api_host } from '@/utils/api';
+import React from 'react';
+
+interface IProps extends React.PropsWithChildren {
+  documentId: string;
+}
+
+const NewDocumentLink = ({ children, documentId }: IProps) => {
+  return (
+    <a
+      target="_blank"
+      href={`${api_host}/document/get/${documentId}`}
+      rel="noreferrer"
+    >
+      {children}
+    </a>
+  );
+};
+
+export default NewDocumentLink;
diff --git a/web/src/components/svg-icon.tsx b/web/src/components/svg-icon.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..d7c16f478d2f8bb6429b4c119c0de41a5267f03d
--- /dev/null
+++ b/web/src/components/svg-icon.tsx
@@ -0,0 +1,34 @@
+import {
+  UseDynamicSVGImportOptions,
+  useDynamicSVGImport,
+} from '@/hooks/commonHooks';
+
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+  name: string;
+  onCompleted?: UseDynamicSVGImportOptions['onCompleted'];
+  onError?: UseDynamicSVGImportOptions['onError'];
+}
+
+const SvgIcon: React.FC<IconProps> = ({
+  name,
+  onCompleted,
+  onError,
+  ...rest
+}): React.ReactNode | null => {
+  const { error, loading, SvgIcon } = useDynamicSVGImport(name, {
+    onCompleted,
+    onError,
+  });
+  if (error) {
+    return error.message;
+  }
+  if (loading) {
+    return 'Loading...';
+  }
+  if (SvgIcon) {
+    return <SvgIcon {...rest} />;
+  }
+  return null;
+};
+
+export default SvgIcon;
diff --git a/web/src/constants/common.ts b/web/src/constants/common.ts
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..d315cf17548fcb313aed9de61370ffd197886f8a 100644
--- a/web/src/constants/common.ts
+++ b/web/src/constants/common.ts
@@ -0,0 +1,40 @@
+export const fileIconMap = {
+  aep: 'aep.svg',
+  ai: 'ai.svg',
+  avi: 'avi.svg',
+  css: 'css.svg',
+  csv: 'csv.svg',
+  dmg: 'dmg.svg',
+  doc: 'doc.svg',
+  docx: 'docx.svg',
+  eps: 'eps.svg',
+  exe: 'exe.svg',
+  fig: 'fig.svg',
+  gif: 'gif.svg',
+  html: 'html.svg',
+  indd: 'indd.svg',
+  java: 'java.svg',
+  jpeg: 'jpeg.svg',
+  jpg: 'jpg.svg',
+  js: 'js.svg',
+  json: 'json.svg',
+  mkv: 'mkv.svg',
+  mp3: 'mp3.svg',
+  mp4: 'mp4.svg',
+  mpeg: 'mpeg.svg',
+  pdf: 'pdf.svg',
+  png: 'png.svg',
+  ppt: 'ppt.svg',
+  pptx: 'pptx.svg',
+  psd: 'psd.svg',
+  rss: 'rss.svg',
+  sql: 'sql.svg',
+  svg: 'svg.svg',
+  tiff: 'tiff.svg',
+  txt: 'txt.svg',
+  wav: 'wav.svg',
+  webp: 'webp.svg',
+  xls: 'xls.svg',
+  xlsx: 'xlsx.svg',
+  xml: 'xml.svg',
+};
diff --git a/web/src/hooks/commonHooks.ts b/web/src/hooks/commonHooks.ts
index e4361cd29fe48946573a72e6eecfcf07d3383f02..6cbf10e8974d50eda4daa762cfd306565bcd7a95 100644
--- a/web/src/hooks/commonHooks.ts
+++ b/web/src/hooks/commonHooks.ts
@@ -32,3 +32,39 @@ export const useDeepCompareEffect = (
     };
   }, []);
 };
+
+export interface UseDynamicSVGImportOptions {
+  onCompleted?: (
+    name: string,
+    SvgIcon: React.FC<React.SVGProps<SVGSVGElement>> | undefined,
+  ) => void;
+  onError?: (err: Error) => void;
+}
+
+export function useDynamicSVGImport(
+  name: string,
+  options: UseDynamicSVGImportOptions = {},
+) {
+  const ImportedIconRef = useRef<React.FC<React.SVGProps<SVGSVGElement>>>();
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<Error>();
+
+  const { onCompleted, onError } = options;
+  useEffect(() => {
+    setLoading(true);
+    const importIcon = async (): Promise<void> => {
+      try {
+        ImportedIconRef.current = (await import(name)).ReactComponent;
+        onCompleted?.(name, ImportedIconRef.current);
+      } catch (err: any) {
+        onError?.(err);
+        setError(err);
+      } finally {
+        setLoading(false);
+      }
+    };
+    importIcon();
+  }, [name, onCompleted, onError]);
+
+  return { error, loading, SvgIcon: ImportedIconRef.current };
+}
diff --git a/web/src/interfaces/database/chat.ts b/web/src/interfaces/database/chat.ts
index eb4ec51f370c600471669754315ac0f5db5d8a44..af6b12c902b67a0dd929947f986dc5cf92bcac0c 100644
--- a/web/src/interfaces/database/chat.ts
+++ b/web/src/interfaces/database/chat.ts
@@ -71,7 +71,7 @@ export interface IReference {
   total: number;
 }
 
-interface Docagg {
+export interface Docagg {
   count: number;
   doc_id: string;
   doc_name: string;
diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx
index 89af5283bbace732e5f67626c13c6a95f0df99cf..e509ec0cbadd57a7b9c6dc60728a6c5003120d3a 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx
@@ -1,6 +1,5 @@
 import Image from '@/components/image';
 import { IChunk } from '@/interfaces/database/knowledge';
-import { api_host } from '@/utils/api';
 import { Card, Checkbox, CheckboxProps, Flex, Popover, Switch } from 'antd';
 import { useState } from 'react';
 import styles from './index.less';
@@ -48,11 +47,6 @@ const ChunkCard = ({
                 <Image id={item.img_id} className={styles.imagePreview}></Image>
               }
             >
-              <img
-                src={`${api_host}/document/image/${item.img_id}`}
-                alt=""
-                className={styles.image}
-              />
               <Image id={item.img_id} className={styles.image}></Image>
             </Popover>
           )}
diff --git a/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx b/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx
index ab5d06c9c2b9640d186108b49738861a372407a3..cb80d01750052e6b5f23961c9d3ba63c32088a05 100644
--- a/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx
+++ b/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx
@@ -1,6 +1,6 @@
 import { ReactComponent as NavigationPointerIcon } from '@/assets/svg/navigation-pointer.svg';
+import NewDocumentLink from '@/components/new-document-link';
 import { ITestingDocument } from '@/interfaces/database/knowledge';
-import { api_host } from '@/utils/api';
 import { Table, TableProps } from 'antd';
 import { useDispatch, useSelector } from 'umi';
 
@@ -34,13 +34,9 @@ const SelectFiles = ({ handleTesting }: IProps) => {
       key: 'view',
       width: 50,
       render: (_, { doc_id }) => (
-        <a
-          href={`${api_host}/document/get/${doc_id}`}
-          target="_blank"
-          rel="noreferrer"
-        >
+        <NewDocumentLink documentId={doc_id}>
           <NavigationPointerIcon />
-        </a>
+        </NewDocumentLink>
       ),
     },
   ];
diff --git a/web/src/pages/add-knowledge/index.tsx b/web/src/pages/add-knowledge/index.tsx
index 370d1150fe5f5fe337b1edd1f9aed3a0d076e566..ec4ba5df66b055686ff8892013dff19c2838e7ca 100644
--- a/web/src/pages/add-knowledge/index.tsx
+++ b/web/src/pages/add-knowledge/index.tsx
@@ -2,7 +2,7 @@ import { useKnowledgeBaseId } from '@/hooks/knowledgeHook';
 import { useSecondPathName, useThirdPathName } from '@/hooks/routeHook';
 import { Breadcrumb } from 'antd';
 import { ItemType } from 'antd/es/breadcrumb/Breadcrumb';
-import { useEffect, useMemo } from 'react';
+import { useCallback, useEffect, useMemo } from 'react';
 import { Link, Outlet, useDispatch, useLocation, useNavigate } from 'umi';
 import Siderbar from './components/knowledge-sidebar';
 import {
@@ -25,9 +25,9 @@ const KnowledgeAdding = () => {
   const datasetActiveKey: KnowledgeDatasetRouteKey =
     useThirdPathName() as KnowledgeDatasetRouteKey;
 
-  const gotoList = () => {
+  const gotoList = useCallback(() => {
     navigate('/knowledge');
-  };
+  }, [navigate]);
 
   const breadcrumbItems: ItemType[] = useMemo(() => {
     const items: ItemType[] = [
@@ -54,7 +54,7 @@ const KnowledgeAdding = () => {
     }
 
     return items;
-  }, [activeKey, datasetActiveKey]);
+  }, [activeKey, datasetActiveKey, gotoList, knowledgeBaseId]);
 
   useEffect(() => {
     const search: string = location.search.slice(1);
@@ -71,7 +71,7 @@ const KnowledgeAdding = () => {
         ...map,
       },
     });
-  }, [location]);
+  }, [location, dispatch]);
 
   return (
     <>
diff --git a/web/src/pages/chat/chat-container/index.less b/web/src/pages/chat/chat-container/index.less
index c0ce04b554a41d1706c1191501783f732e9f9bd2..1eba20a51a08afd8a11ca1a4678505d410e2d4fb 100644
--- a/web/src/pages/chat/chat-container/index.less
+++ b/web/src/pages/chat/chat-container/index.less
@@ -39,3 +39,11 @@
 .messageItemRight {
   text-align: right;
 }
+
+.referencePopoverWrapper {
+  width: 50vw;
+}
+
+.referenceChunkImage {
+  width: 10vw;
+}
diff --git a/web/src/pages/chat/chat-container/index.tsx b/web/src/pages/chat/chat-container/index.tsx
index 31d939ff506dfc6c4b066bff950d9ba5a8c49e71..4c0704f7ba467db3c2248e84ba2d809bf080cd90 100644
--- a/web/src/pages/chat/chat-container/index.tsx
+++ b/web/src/pages/chat/chat-container/index.tsx
@@ -3,18 +3,38 @@ import { MessageType } from '@/constants/chat';
 import { useOneNamespaceEffectsLoading } from '@/hooks/storeHooks';
 import { useSelectUserInfo } from '@/hooks/userSettingHook';
 import { IReference, Message } from '@/interfaces/database/chat';
-import { Avatar, Button, Flex, Input, Popover } from 'antd';
+import {
+  Avatar,
+  Button,
+  Flex,
+  Input,
+  List,
+  Popover,
+  Space,
+  Typography,
+} from 'antd';
 import classNames from 'classnames';
 import { ChangeEventHandler, useCallback, useMemo, useState } from 'react';
 import reactStringReplace from 'react-string-replace';
-import { useFetchConversation, useSendMessage } from '../hooks';
+import {
+  useFetchConversation,
+  useGetFileIcon,
+  useScrollToBottom,
+  useSendMessage,
+} from '../hooks';
 import { IClientConversation } from '../interface';
 
+import Image from '@/components/image';
+import NewDocumentLink from '@/components/new-document-link';
 import { InfoCircleOutlined } from '@ant-design/icons';
 import Markdown from 'react-markdown';
 import { visitParents } from 'unist-util-visit-parents';
 import styles from './index.less';
 
+const reg = /(#{2}\d+\${2})/g;
+
+const getChunkIndex = (match: string) => Number(match.slice(2, 3));
+
 const rehypeWrapReference = () => {
   return function wrapTextTransform(tree: any) {
     visitParents(tree, 'text', (node, ancestors) => {
@@ -28,32 +48,69 @@ const rehypeWrapReference = () => {
   };
 };
 
-const MessageItem = ({ item }: { item: Message; references: IReference[] }) => {
+const MessageItem = ({
+  item,
+  reference,
+}: {
+  item: Message;
+  reference: IReference;
+}) => {
   const userInfo = useSelectUserInfo();
 
-  const popoverContent = useMemo(
-    () => (
-      <div>
-        <p>Content</p>
-        <p>Content</p>
-      </div>
-    ),
-    [],
+  const isAssistant = item.role === MessageType.Assistant;
+
+  const getFileIcon = useGetFileIcon();
+
+  const getPopoverContent = useCallback(
+    (chunkIndex: number) => {
+      const chunks = reference?.chunks ?? [];
+      const chunkItem = chunks[chunkIndex];
+      const document = reference?.doc_aggs.find(
+        (x) => x?.doc_id === chunkItem?.doc_id,
+      );
+      const documentId = document?.doc_id;
+      return (
+        <Flex
+          key={chunkItem?.chunk_id}
+          gap={10}
+          className={styles.referencePopoverWrapper}
+        >
+          <Image
+            id={chunkItem?.img_id}
+            className={styles.referenceChunkImage}
+          ></Image>
+          <Space direction={'vertical'}>
+            <div>{chunkItem?.content_with_weight}</div>
+            {documentId && (
+              <NewDocumentLink documentId={documentId}>
+                {document?.doc_name}
+              </NewDocumentLink>
+            )}
+          </Space>
+        </Flex>
+      );
+    },
+    [reference],
   );
 
   const renderReference = useCallback(
     (text: string) => {
-      return reactStringReplace(text, /#{2}\d{1,}\${2}/g, (match, i) => {
+      return reactStringReplace(text, reg, (match, i) => {
+        const chunkIndex = getChunkIndex(match);
         return (
-          <Popover content={popoverContent}>
+          <Popover content={getPopoverContent(chunkIndex)}>
             <InfoCircleOutlined key={i} className={styles.referenceIcon} />
           </Popover>
         );
       });
     },
-    [popoverContent],
+    [getPopoverContent],
   );
 
+  const referenceDocumentList = useMemo(() => {
+    return reference?.doc_aggs ?? [];
+  }, [reference?.doc_aggs]);
+
   return (
     <div
       className={classNames(styles.messageItem, {
@@ -86,9 +143,7 @@ const MessageItem = ({ item }: { item: Message; references: IReference[] }) => {
             <AssistantIcon></AssistantIcon>
           )}
           <Flex vertical gap={8} flex={1}>
-            <b>
-              {item.role === MessageType.Assistant ? 'Resume Assistant' : 'You'}
-            </b>
+            <b>{isAssistant ? 'Resume Assistant' : 'You'}</b>
             <div className={styles.messageText}>
               <Markdown
                 rehypePlugins={[rehypeWrapReference]}
@@ -102,6 +157,22 @@ const MessageItem = ({ item }: { item: Message; references: IReference[] }) => {
                 {item.content}
               </Markdown>
             </div>
+            {isAssistant && referenceDocumentList.length > 0 && (
+              <List
+                bordered
+                dataSource={referenceDocumentList}
+                renderItem={(item) => (
+                  <List.Item>
+                    <Typography.Text mark>
+                      {/* <SvgIcon name={getFileIcon(item.doc_name)}></SvgIcon> */}
+                    </Typography.Text>
+                    <NewDocumentLink documentId={item.doc_id}>
+                      {item.doc_name}
+                    </NewDocumentLink>
+                  </List.Item>
+                )}
+              />
+            )}
           </Flex>
         </div>
       </section>
@@ -117,6 +188,8 @@ const ChatContainer = () => {
     'completeConversation',
     'getConversation',
   ]);
+  const ref = useScrollToBottom();
+  useGetFileIcon();
 
   const handlePressEnter = () => {
     setValue('');
@@ -131,14 +204,24 @@ const ChatContainer = () => {
     <Flex flex={1} className={styles.chatContainer} vertical>
       <Flex flex={1} vertical className={styles.messageContainer}>
         <div>
-          {conversation?.message?.map((message) => (
-            <MessageItem
-              key={message.id}
-              item={message}
-              references={conversation.reference}
-            ></MessageItem>
-          ))}
+          {conversation?.message?.map((message) => {
+            const assistantMessages = conversation?.message
+              ?.filter((x) => x.role === MessageType.Assistant)
+              .slice(1);
+            const referenceIndex = assistantMessages.findIndex(
+              (x) => x.id === message.id,
+            );
+            const reference = conversation.reference[referenceIndex];
+            return (
+              <MessageItem
+                key={message.id}
+                item={message}
+                reference={reference}
+              ></MessageItem>
+            );
+          })}
         </div>
+        <div ref={ref} />
       </Flex>
       <Input
         size="large"
diff --git a/web/src/pages/chat/hooks.ts b/web/src/pages/chat/hooks.ts
index 57ed30d1877c58d0852032a3cf7bcc932fb7f85e..a3edde05c18ba678f58c418691f5732e7190a116 100644
--- a/web/src/pages/chat/hooks.ts
+++ b/web/src/pages/chat/hooks.ts
@@ -1,8 +1,10 @@
 import showDeleteConfirm from '@/components/deleting-confirm';
 import { MessageType } from '@/constants/chat';
+import { fileIconMap } from '@/constants/common';
 import { IConversation, IDialog } from '@/interfaces/database/chat';
+import { getFileExtension } from '@/utils';
 import omit from 'lodash/omit';
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useDispatch, useSearchParams, useSelector } from 'umi';
 import { v4 as uuid } from 'uuid';
 import { ChatSearchParams, EmptyConversationId } from './constants';
@@ -441,4 +443,38 @@ export const useSendMessage = () => {
   return { sendMessage: handleSendMessage };
 };
 
+export const useScrollToBottom = () => {
+  const ref = useRef<HTMLDivElement>(null);
+  let chatModel: ChatModelState = useSelector((state: any) => state.chatModel);
+  const { currentConversation } = chatModel;
+
+  const scrollToBottom = useCallback(() => {
+    if (currentConversation.id) {
+      ref.current?.scrollIntoView({ behavior: 'instant' });
+    }
+  }, [currentConversation]);
+
+  useEffect(() => {
+    scrollToBottom();
+  }, [scrollToBottom]);
+
+  return ref;
+};
+
+export const useGetFileIcon = () => {
+  // const req = require.context('@/assets/svg/file-icon');
+  // const ret = req.keys().map(req);
+  // console.info(ret);
+  // useEffect(() => {}, []);
+
+  const getFileIcon = (filename: string) => {
+    const ext: string = getFileExtension(filename);
+    const iconPath = fileIconMap[ext as keyof typeof fileIconMap];
+    // const x = require(`@/assets/svg/file-icon/${iconPath}`);
+    return `@/assets/svg/file-icon/${iconPath}`;
+  };
+
+  return getFileIcon;
+};
+
 //#endregion
diff --git a/web/src/utils/domUtils.ts b/web/src/utils/domUtils.ts
new file mode 100644
index 0000000000000000000000000000000000000000..8710ec70760565966c09aaad4e03362bca9c8613
--- /dev/null
+++ b/web/src/utils/domUtils.ts
@@ -0,0 +1,3 @@
+export const scrollToBottom = (element: HTMLElement) => {
+  element.scrollTo(0, element.scrollHeight);
+};
diff --git a/web/src/utils/index.ts b/web/src/utils/index.ts
index f278904713069e1774bee4c8cd934ed74d267cba..d0cdcef726387586977d1d4da5fe105e89a8a0f9 100644
--- a/web/src/utils/index.ts
+++ b/web/src/utils/index.ts
@@ -25,3 +25,6 @@ export default {
   getWidth,
   rsaPsw,
 };
+
+export const getFileExtension = (filename: string) =>
+  filename.slice(filename.lastIndexOf('.') + 1).toLowerCase();
diff --git a/web/src/utils/request.ts b/web/src/utils/request.ts
index 2005a821858566bba8af575815c4052072449624..b04bd54dfe3a82b733175f6dc4b3821923ffc3d6 100644
--- a/web/src/utils/request.ts
+++ b/web/src/utils/request.ts
@@ -107,7 +107,6 @@ request.interceptors.request.use((url: string, options: any) => {
  * */
 
 request.interceptors.response.use(async (response: any, request) => {
-  console.log(response, request);
   const data: ResponseType = await response.clone().json();
   // response 拦截