diff --git a/web/src/App.vue b/web/src/App.vue
index 3549f936b..0945dc4ea 100644
--- a/web/src/App.vue
+++ b/web/src/App.vue
@@ -14,7 +14,7 @@ limitations under the License.
 <template>
   <v-app id="app">
     <nav class="navbar">
-      <v-app-bar flat :elevation="1" >
+      <v-app-bar flat :elevation="1">
         <template v-slot:prepend>
           <v-img src="./turbinia-logo-mark.png" height="50" width="70"></v-img>
         </template>
@@ -60,6 +60,14 @@ import RequestList from './components/RequestList.vue'
 import TaskDetails from './components/TaskDetails.vue'
 import ApiClient from './utils/RestApiClient.js'
 
+export function truncate(text, length, suffix) {
+  if (text.length > length) {
+    return text.substring(0, length) + suffix;
+  } else {
+    return text;
+  }
+}
+
 export default {
   name: 'app',
   components: { RequestList, TaskDetails },
@@ -92,7 +100,7 @@ import { useTheme } from 'vuetify'
 
 const theme = useTheme()
 
-function toggleTheme () {
+function toggleTheme() {
   theme.global.name.value = theme.global.current.value.dark ? 'light' : 'dark'
 }
 </script>
diff --git a/web/src/components/RequestList.vue b/web/src/components/RequestList.vue
index f86faae95..965ddc618 100644
--- a/web/src/components/RequestList.vue
+++ b/web/src/components/RequestList.vue
@@ -98,6 +98,7 @@ limitations under the License.
 import ApiClient from '../utils/RestApiClient.js'
 import TaskList from './TaskList.vue'
 import { mergeProps } from 'vue'
+import { truncate } from '../App.vue'
 
 export default {
   components: { TaskList },
@@ -151,7 +152,7 @@ export default {
               failed_tasks: data[req].failed_tasks,
               outstanding_perc: outstanding_perc,
               status: data[req].status,
-              evidence_name: data[req].evidence_name.substring(0, 64) + '...',
+              evidence_name: truncate(data[req].evidence_name, 64, '...'),
               evidence_id: data[req].evidence_id,
             })
           }