diff --git a/src/client/assets/scss/App.scss b/src/client/assets/scss/App.scss
index 5fa15d7..62cb11f 100644
--- a/src/client/assets/scss/App.scss
+++ b/src/client/assets/scss/App.scss
@@ -50,7 +50,6 @@ $size-8: 0.9rem;
   }
 }
 .volumes-container {
-  margin-top: 3rem;
 
   .stack {
     max-width: 200px;
diff --git a/src/client/components/VolumeGroups.tsx b/src/client/components/VolumeGroups.tsx
index 0a8fc38..e25af14 100644
--- a/src/client/components/VolumeGroups.tsx
+++ b/src/client/components/VolumeGroups.tsx
@@ -21,7 +21,9 @@ export const VolumeGroups = (): ReactElement => {
   );
   return (
     <section className="volumes-container">
-      <h2 className="subtitle">Volumes</h2>
+      <div className="content">
+        <div className="subtitle">Volumes</div>
+      </div>
       <Masonry
         breakpointCols={breakpointColumnsObj}
         className="volumes-grid"
diff --git a/src/client/context/socket/socket.context.tsx b/src/client/context/socket/socket.context.tsx
index c9c78c6..211387a 100644
--- a/src/client/context/socket/socket.context.tsx
+++ b/src/client/context/socket/socket.context.tsx
@@ -3,6 +3,7 @@ import io, { Socket } from "socket.io-client";
 import { SOCKET_BASE_URI } from "../../constants/endpoints";
 import { useDispatch } from "react-redux";
 import { RMQ_SOCKET_CONNECTED } from "../../constants/action-types";
+import { success } from "react-notification-system-redux";
 
 const WebSocketContext = createContext(null);
 export const WebSocketProvider = ({ children }): ReactElement => {
@@ -16,6 +17,20 @@ export const WebSocketProvider = ({ children }): ReactElement => {
       socketId: socket.id,
     });
   });
+  // on cover extraction
+  socket.on("coverExtracted", (data) => {
+    console.log("shaket", data);
+    dispatch(
+      success({
+        // uid: 'once-please', // you can specify your own uid if required
+        title: "Cover Extracted",
+        message: `<span class="icon-text has-text-success"><i class="fas fa-plug"></i></span> Socket <span class="has-text-info">${socket.id}</span> connected. <strong>${data}</strong>`,
+        dismissible: "click",
+        position: "tr",
+        autoDismiss: 0,
+      }),
+    );
+  })
   socket.on("disconnect", () => {
     console.log(`disconnect`);
   });
diff --git a/src/client/shared/utils/filenameparser.utils.ts b/src/client/shared/utils/filenameparser.utils.ts
index 29b0f31..f61fb9f 100644
--- a/src/client/shared/utils/filenameparser.utils.ts
+++ b/src/client/shared/utils/filenameparser.utils.ts
@@ -163,9 +163,7 @@ export const extractNumerals = (inputString: string): MatchArray[string] => {
 };
 
 export const refineQuery = (inputString: string) => {
-  
   const queryObj = tokenize(inputString);
-  console.log(queryObj)
   const removedYears = xor(
     queryObj.sentence_tokens.normalized,
     queryObj.years.yearMatches,
diff --git a/src/server/index.ts b/src/server/index.ts
index 61630f7..63cc067 100644
--- a/src/server/index.ts
+++ b/src/server/index.ts
@@ -56,8 +56,8 @@ amqp.connect("amqp://localhost", (error0, connection) => {
       durable: false,
     });
 
-    console.log(`Connected to ${queue} queue.`);
-    console.log(`Waiting for comic book cover data in ${queue}`);
+    console.log(`RabbitMQ: Connected to ${queue} queue.`);
+    console.log(`RabbitMQ: Waiting for comic book cover data in ${queue}`);
 
     channel.consume(
       queue,