diff --git a/ui/app/components/History.vue b/ui/app/components/History.vue
index 4c3842ab..71a2f8db 100644
--- a/ui/app/components/History.vue
+++ b/ui/app/components/History.vue
@@ -114,11 +114,12 @@
                 </label>
               </td>
               <td class="is-text-overflow is-vcentered">
-                <div class="is-inline is-pulled-right" v-if="item.extras?.duration || item?.download_dir">
+                <div class="is-inline is-pulled-right"
+                  v-if="item.extras?.duration || getPath(config.app.download_path, item)">
                   <span class="tag is-info is-unselectable" v-if="item.extras?.duration">
                     {{ formatTime(item.extras.duration) }}
                   </span>
-                  <span class="icon is-pointer" v-if="item.download_dir"
+                  <span class="icon is-pointer" v-if="getPath(config.app.download_path, item)"
                     v-tooltip="`Path: ${getPath(config.app.download_path, item)}`">
                     <i class="fa-solid fa-folder-open" />
                   </span>
@@ -135,8 +136,8 @@
                           <span class="tag is-info is-unselectable">{{ item.preset }}</span>
                         </strong>
                       </template>
-                      <img v-if="showThumbnails && getImage(config.app.download_path, item)"
-                        :src="getImage(config.app.download_path, item)" class="mt-2 mb-2" />
+                      <img v-if="showThumbnails && getImage(config.app.download_path, item, false)"
+                        :src="getImage(config.app.download_path, item, false)" class="mt-2 mb-2" />
                       <p v-if="item.description">{{ item.description }}</p>
                     </Popover>
                   </div>
@@ -276,7 +277,7 @@
                 </span>
               </div>
 
-              <div class="control" v-if="item.download_dir">
+              <div class="control" v-if="getPath(config.app.download_path, item)">
                 <span class="icon" v-tooltip="`Path: ${getPath(config.app.download_path, item)}`">
                   <i class="fa-solid fa-folder-open" />
                 </span>
diff --git a/ui/app/pages/conditions.vue b/ui/app/pages/conditions.vue
index 744a72a1..0c77a191 100644
--- a/ui/app/pages/conditions.vue
+++ b/ui/app/pages/conditions.vue
@@ -235,9 +235,9 @@
       <div class="message is-info">
         <div class="message-body content pl-0">
           <ul>
-            <li>Filtering is based on yt-dlp’s <b>--match-filter</b> logic. Any expression that works with yt-dlp
+            <li>Filtering is based on yt-dlp’s <code>--match-filter</code> logic. Any expression that works with yt-dlp
               will also work here, including the same boolean operators. We added extended support for the
-              <b>OR</b> ( <b>||</b> ) operator, which yt-dlp does not natively support. This allows you to combine
+              <code>OR</code> ( <code>||</code> ) operator, which yt-dlp does not natively support. This allows you to combine
               multiple conditions more flexibly.
             </li>
             <li>
@@ -245,7 +245,7 @@
             </li>
             <li>
               For example, i follow specific channel that sometimes region lock some videos, by using the following
-              filter i am able to bypass it <b>availability = 'needs_auth' & channel_id = 'channel_id'</b>.
+              filter i am able to bypass it <code>availability = 'needs_auth' & channel_id = 'channel_id'</code>.
               and set proxy for that specific video, while leaving the rest of the videos to be downloaded normally.
             </li>
             <li>
diff --git a/ui/app/pages/notifications.vue b/ui/app/pages/notifications.vue
index 5d643d77..92d058dc 100644
--- a/ui/app/pages/notifications.vue
+++ b/ui/app/pages/notifications.vue
@@ -218,22 +218,22 @@
         <div class="message-body content pl-0">
           <ul>
             <li>
-              When you export notification target, We remove <b>Authorization</b> header key by default,
+              When you export notification target, We remove <code>Authorization</code> header key by default,
               However this might not be enough to remove credentials from the exported data. it's your responsibility
               to ensure that the exported data does not contain any sensitive information for sharing.
             </li>
             <li>
-              When you set the request type as <b>Form</b>, the event data will be JSON encoded and sent as
-              <b>...&data_key=json_string</b>, only the <b>data</b> field will be JSON encoded.
-              The other keys <b>id</b>, <b>event</b> and <b>created_at</b> will be sent as they are.
+              When you set the request type as <code>Form</code>, the event data will be JSON encoded and sent as
+              <code>...&data_key=json_string</code>, only the <code>data</code> field will be JSON encoded.
+              The other keys <code>id</code>, <code>event</code> and <code>created_at</code> will be sent as they are.
             </li>
-            <li>We also send two special headers <b>X-Event-ID</b> and <b>X-Event</b> with the request.</li>
+            <li>We also send two special headers <code>X-Event-ID</code> and <code>X-Event</code> with the request.</li>
             <li>
               If you have selected specific presets or events, this will take priority, For example, if you limited the
-              target to <b>default</b> preset and selected <b>ALL</b> events, only events that reference the
-              <b>default</b> preset will be sent to that target. Like wise, if you have limited both events and
+              target to <code>default</code> preset and selected <code>ALL</code> events, only events that reference the
+              <code>default</code> preset will be sent to that target. Like wise, if you have limited both events and
               presets, then ONLY events that satisfy both conditions will be sent to that target. Only the
-              <b>test</b> events can bypass these conditions.
+              <code>test</code> events can bypass these conditions.
             </li>
           </ul>
         </div>
diff --git a/ui/app/utils/index.ts b/ui/app/utils/index.ts
index af83eddb..af7321f0 100644
--- a/ui/app/utils/index.ts
+++ b/ui/app/utils/index.ts
@@ -792,26 +792,27 @@ const deepIncludes = (
 }
 
 const getPath = (basePath: string, item: StoreItem): string => {
-  if (!item.download_dir) {
-    return ''
+  if (!item.folder && ((!item.filename && item.download_dir === basePath) || !item.download_dir)) {
+    return shortPath(basePath)
   }
 
   if (!item?.filename) {
-    return item.download_dir
+    return stripPath(eTrim(basePath, '/'), '/' + sTrim(eTrim(item.download_dir || item.folder, '/'), '/'))
   }
 
-  return stripPath(basePath, eTrim(item.download_dir, '/') + '/' + sTrim(item.filename, '/'))
+  return stripPath(eTrim(basePath, '/'), '/' + eTrim(item.download_dir, '/') + '/' + sTrim(item.filename, '/'))
 }
-const getImage = (basePath: string, item: StoreItem): string => {
+
+const getImage = (basePath: string, item: StoreItem, fallback: boolean = true): string => {
   if (item.sidecar?.image && item.sidecar.image.length > 0) {
     return uri('/api/download/' + encodeURIComponent(stripPath(basePath, item.sidecar.image[0]?.file || '')))
   }
 
-  if (!item?.extras?.thumbnail) {
-    return '/images/placeholder.png'
+  if (item?.extras?.thumbnail) {
+    return uri('/api/thumbnail?id=' + item._id + '&url=' + encodePath(item.extras.thumbnail))
   }
 
-  return uri('/api/thumbnail?id=' + item._id + '&url=' + encodePath(item.extras.thumbnail))
+  return fallback ? uri('/images/placeholder.png') : ''
 }
 
 export {