From ca628b37de773a5dea52396259d6cd40bb86c557 Mon Sep 17 00:00:00 2001
From: Elio Struyf <elio@struyfconsulting.be>
Date: Fri, 3 Dec 2021 19:15:20 +0100
Subject: [PATCH] #201 - Fix filename overflow

---
 CHANGELOG.md                                   | 1 +
 src/dashboardWebView/components/Media/Item.tsx | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9faad5ce..b4bebf69 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@
 ### 🐞 Fixes
 
 - [#191](https://github.com/estruyf/vscode-front-matter/issues/191): Fix beta settings page
+- [#201](https://github.com/estruyf/vscode-front-matter/issues/201): Overflow issue with the media filename
 
 ## [5.6.0] - 2021-11-23
 
diff --git a/src/dashboardWebView/components/Media/Item.tsx b/src/dashboardWebView/components/Media/Item.tsx
index 8a30926b..fa75ad27 100644
--- a/src/dashboardWebView/components/Media/Item.tsx
+++ b/src/dashboardWebView/components/Media/Item.tsx
@@ -252,7 +252,7 @@ export const Item: React.FunctionComponent<IItemProps> = ({media}: React.PropsWi
             </div>
 
           </div>
-          <p className="text-sm dark:text-whisper-900 font-bold pointer-events-none flex items-center">
+          <p className="text-sm dark:text-whisper-900 font-bold pointer-events-none flex items-center break-all">
             {basename(parseWinPath(media.fsPath) || "")}
           </p>
           {