diff --git a/frontend/src/pages/user/messages/Home.vue b/frontend/src/pages/user/messages/Home.vue
index 7aab83b..4472bb1 100644
--- a/frontend/src/pages/user/messages/Home.vue
+++ b/frontend/src/pages/user/messages/Home.vue
@@ -20,7 +20,6 @@
               <span class="conversation-last-update-date">{{
                 getDateFromFulltimeString(conversation.create_time)
               }}</span>
-              <!-- <span v-if="unreadCountMapper" class="conversation-unreadcount">{{unreadCountMapper}}</span> -->
             </div>
             <div class="conversation-summary-highlight-container">
               {{ conversation.last_message?.message_body }}
diff --git a/frontend/src/pages/user/providers/Home.vue b/frontend/src/pages/user/providers/Home.vue
index bec25dd..442bfb2 100644
--- a/frontend/src/pages/user/providers/Home.vue
+++ b/frontend/src/pages/user/providers/Home.vue
@@ -447,11 +447,6 @@ export default {
   border-top: 1px solid #dee2e6;
 }
 
-// .statistics-content-label {
-//   @extend .label-text-light;
-//   @extend .w-100;
-// }
-
 .statistics-content-container {
   @extend .flex-colum-container;
   padding: 0;
diff --git a/frontend/src/pages/user/requests/Home.vue b/frontend/src/pages/user/requests/Home.vue
index aedb0c5..03a4afe 100644
--- a/frontend/src/pages/user/requests/Home.vue
+++ b/frontend/src/pages/user/requests/Home.vue
@@ -77,11 +77,11 @@
                     {{ $t('Propose') }}
                   </button>
                   <div class="request-description-content" v-html="request.content"></div>
-                  <div v-for="(file, index) in request.attached_files" :key="index">
-                    <button @click="previewAttachedFile(request.id, file.document_id)">
+                  <div class="pdf-actions" v-for="(file, index) in request.attached_files" :key="index">
+                    <button class="btn btn-link" data-bs-toggle="modal" data-bs-target="#pdf-viewer" @click="previewAttachedFile(request.id, file.document_id, file.file_name)">
                       {{ $t('Preview') }}{{ file.file_name }}
                     </button>
-                    <button @click="downloadAttachedFile(request.id, file.document_id)">
+                    <button class="btn btn-link" @click="downloadAttachedFile(request.id, file.document_id)">
                       {{ $t('Download') }}{{ file.file_name }}
                     </button>
                   </div>
@@ -179,12 +179,27 @@
       </div>
     </div>
   </div>
+  <div class="modal fade" id="pdf-viewer" tabindex="-1" aria-labelledby="pdf-viewer-label" aria-hidden="true">
+    <div class="modal-dialog modal-xl">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h1 class="modal-title fs-5" id="pdf-viewer-label">{{ pdfDocument.title }}</h1>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <PDFReader :doc="pdfDocument.doc" />
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
 import { RequestHubApi, WorksapceApi, DateUtils, requestHubUtils } from '@/utils/index'
 import { proposingModelEnum } from '@/types/index'
+import PDFReader from '@/components/PDFReader.vue'
 export default {
+  components: { PDFReader },
   name: 'RequestHub',
   props: {},
   mounted() {
@@ -193,7 +208,8 @@ export default {
   data() {
     return {
       requestGroups: [],
-      message: null
+      message: null,
+      pdfDocument: {}
     }
   },
 
@@ -214,17 +230,16 @@ export default {
     getDateFromFulltimeString(fulltime) {
       return DateUtils.FromJsonToDateString(fulltime)
     },
-    previewAttachedFile(request_id, document_id) {
-      // !!! SHOULD NOT use PdfContentViewer which is designed for unlogged in users.
-      // !!! Instead, should have a dedicated pdf viewer which should follow the figma design.
-      // WorksapceApi.fetchAttachedFileAsMediaData(request_id, document_id)
-      //   .then((response) => {
-      //     let media_data = response.data
-      //     console.log(media_data)
-      //   })
-      //   .catch((error) => {
-      //     this.mnx_backendErrorHandler(error)
-      //   })
+    previewAttachedFile(request_id, document_id, title) {
+      this.pdfDocument.title = title
+      WorksapceApi.fetchAttachedFileAsMediaData(request_id, document_id)
+        .then((response) => {
+          let media_data = response.data
+          this.pdfDocument.doc = {url: media_data}
+        })
+        .catch((error) => {
+          this.mnx_backendErrorHandler(error)
+        })
     },
     downloadAttachedFile(request_id, document_id) {
       WorksapceApi.fetchAttachedFileAsDownload(request_id, document_id)
@@ -413,4 +428,15 @@ export default {
   @extend .text-start;
   font-weight: bold;
 }
+
+.pdf-actions {
+  text-align: left;
+  display: flex;
+  align-items: center;
+  margin-top: 12px;
+
+  .btn-link {
+    padding: 0; margin-right: 12px;
+  }
+}
 </style>
diff --git a/frontend/src/pages/user/requests/Propose.vue b/frontend/src/pages/user/requests/Propose.vue
index 81c3666..01c964d 100644
--- a/frontend/src/pages/user/requests/Propose.vue
+++ b/frontend/src/pages/user/requests/Propose.vue
@@ -221,36 +221,6 @@
             <button class="stage-item-delete-button">
               <svg-icon v-if="index != 0" icon="delete" @click="removeStage(index)" />
             </button>
-            <!-- <div class="stage-item-content-container" id="stage-item-content">
-              <div class="stage-payment-container">
-                <label class="stage-content-label" for="stage-payment-content">Payment</label>
-                <div class="stage-payment-content-container" id="stage-payment-content">
-                  <input
-                    type="text"
-                    class="stage-payment-content-text"
-                    id="stage-payment-content-text"
-                    v-model="stage.payment"
-                  />
-                  <span class="stage-payment-content-span"> {{ stage.currency }}</span>
-                </div>
-              </div>
-              <div class="stage-duration-container">
-                <label class="stage-content-label" for="stage-duration-content">Duration</label>
-                <div class="stage-duration-content-container" id="stage-duration-content">
-                  <input
-                    type="text"
-                    class="stage-duration-content-text"
-                    v-model="stage.duration_in_days"
-                  />
-                  <span class="stage-duration-content-span"> day(s)</span>
-                </div>
-              </div>
-              <div class="stage-note-container">
-                <label class="stage-content-label" for="stage-note-content">Notes</label>
-                <input class="stage-note-content-text" id="stage-note-content" v-model="stage.note" />
-              </div>
-              
-            </div> -->
           </div>
           <div class="stage-more-action-container">
             <button class="stage-add-more-button" @click="addStage()">
@@ -350,12 +320,6 @@ export default {
     }
   },
   methods: {
-    // loadTemplates() {
-    //   this.mnx_navToLoadTemplates()
-    // },
-    // copyExisting() {
-    //   this.mnx_navToCopyProposals()
-    // },
     isUserInCNY() {
       return window.location.host.includes('localhost') || window.location.href.includes('com.cn')
     },
diff --git a/frontend/src/pages/user/workspace/requestIssue/Deposit.vue b/frontend/src/pages/user/workspace/requestIssue/Deposit.vue
index 85b5f0d..2146ae8 100644
--- a/frontend/src/pages/user/workspace/requestIssue/Deposit.vue
+++ b/frontend/src/pages/user/workspace/requestIssue/Deposit.vue
@@ -10,10 +10,6 @@
 </template>
 
 <script>
-import {
-  UserProfileApi
-  // requestHubUtils,
-} from '@/utils/index'
 export default {
   name: 'RquestIssueDeposit',
   props: {
diff --git a/frontend/src/pages/user/workspace/requestIssue/Deposited.vue b/frontend/src/pages/user/workspace/requestIssue/Deposited.vue
index 261d34b..8f92b74 100644
--- a/frontend/src/pages/user/workspace/requestIssue/Deposited.vue
+++ b/frontend/src/pages/user/workspace/requestIssue/Deposited.vue
@@ -8,10 +8,6 @@
 </template>
 
 <script>
-import {
-  UserProfileApi
-  // userProfileValidator,
-} from '@/utils/index'
 export default {
   name: 'RquestIssueDeposited',
   props: {
diff --git a/frontend/src/pages/user/workspace/requestManage/Manage.vue b/frontend/src/pages/user/workspace/requestManage/Manage.vue
index 470f504..46e4465 100644
--- a/frontend/src/pages/user/workspace/requestManage/Manage.vue
+++ b/frontend/src/pages/user/workspace/requestManage/Manage.vue
@@ -91,7 +91,7 @@
 
 <script>
 import { WorksapceApi, requestIssueUtils, DateUtils } from '@/utils/index'
-import { requestStatusEnum, convertIntoToRequestStatus } from '@/types/index'
+import { convertIntoToRequestStatus } from '@/types/index'
 export default {
   name: 'RequestManage',
   props: {
diff --git a/frontend/src/plugins/store/basic.js b/frontend/src/plugins/store/basic.js
index 54cc0ff..ffb378c 100644
--- a/frontend/src/plugins/store/basic.js
+++ b/frontend/src/plugins/store/basic.js
@@ -13,7 +13,6 @@ const basicStore = {
       language: 'zh',
       conversations: [],
       unreadConversationCount: 0,
-      // conversation_update_time: null,
       downstream_web_socket: null
     }
   },
@@ -56,12 +55,8 @@ const basicStore = {
             }
           }
 
-          // event = connected 初始化conversation list
-          // 似乎并不需要在获取conversation list的时候，进行时间戳处理
           MessageHubApi.fetchConversations(GWT, token).then((response) => {
             const conversations = response.data.conversations || []
-            // 既然每次都是新消息在第一位，那么只需要对比conversation list的长度，就可以知道是否有新的会话产生。
-            // 消息初始化不做比对
             let updateLength = 0
             if (data.event !== 'connected') {
               updateLength = conversations.length - state.conversations.length