diff --git a/src/viewer/src/components/CostMatrixComponent.tsx b/src/viewer/src/components/CostMatrixComponent.tsx
index 0801219..4a93bef 100644
--- a/src/viewer/src/components/CostMatrixComponent.tsx
+++ b/src/viewer/src/components/CostMatrixComponent.tsx
@@ -15,14 +15,14 @@ import {
 
 function getMatchingResultInZoomBlock(
   results: MatchingResultElement[],
-  zoomParams: ZoomBlockParams
+  zoomParams: ZoomBlockParams,
 ) {
   return results.filter(
     (result) =>
       result.queryId >= zoomParams.topLeftY &&
       result.queryId < zoomParams.topLeftY + zoomParams.windowHeightPx &&
       result.refId >= zoomParams.topLeftX &&
-      result.refId < zoomParams.topLeftX + zoomParams.windowWidthPx
+      result.refId < zoomParams.topLeftX + zoomParams.windowWidthPx,
   );
 }
 
@@ -70,7 +70,7 @@ function CostMatrixComponent(props: CostMatrixProps): React.ReactElement {
     }
     readProtoFromFile(
       props.matchingResultProtoFile,
-      ProtoMessageType.MatchingResult
+      ProtoMessageType.MatchingResult,
     )
       .then((matchingResultProto) => {
         setMatchingResult(readMatchingResultFromProto(matchingResultProto));
@@ -88,8 +88,8 @@ function CostMatrixComponent(props: CostMatrixProps): React.ReactElement {
       costMatrix.getSubMatrix(
         zoomParams.topLeftX,
         zoomParams.topLeftY,
-        zoomParams.windowHeightPx
-      )
+        zoomParams.windowHeightPx,
+      ),
     );
   }, [zoomParams, costMatrix]);
 
@@ -132,7 +132,7 @@ function CostMatrixComponent(props: CostMatrixProps): React.ReactElement {
           flexDirection: "row",
           flexWrap: "wrap",
           justifyContent: "center",
-          backgroundColor: "ghostwhite"
+          backgroundColor: "ghostwhite",
         }}
       >
         <div>
diff --git a/src/viewer/src/components/DataLoader.tsx b/src/viewer/src/components/DataLoader.tsx
index e69e1ee..caf2f52 100644
--- a/src/viewer/src/components/DataLoader.tsx
+++ b/src/viewer/src/components/DataLoader.tsx
@@ -14,7 +14,9 @@ function DataLoader(props: DataLoaderProps): React.ReactElement {
     const files = Array.from(fileList);
 
     const costMatrixProtoFile = files.find((file) => {
-      return file.webkitRelativePath.split("/")[1].endsWith(".CostMatrix.pb");
+      return file.webkitRelativePath
+        .split("/")[1]
+        .endsWith(".SimilarityMatrix.pb");
     });
     if (costMatrixProtoFile == null) {
       console.warn("CostMatrix proto file was not found");
diff --git a/src/viewer/src/resources/readers.ts b/src/viewer/src/resources/readers.ts
index 7651931..16030e0 100644
--- a/src/viewer/src/resources/readers.ts
+++ b/src/viewer/src/resources/readers.ts
@@ -21,7 +21,7 @@ function readImageAsync(file: Blob) {
 }
 
 enum ProtoMessageType {
-  CostMatrix = "CostMatrix",
+  CostMatrix = "SimilarityMatrix",
   MatchingResult = "MatchingResult",
 }
 
@@ -52,7 +52,7 @@ async function readProtoFromFile(file: File, messageType: ProtoMessageType) {
     }
     let protoMessage = await readProtoFromBuffer(
       new Uint8Array(contentBuffer),
-      "image_sequence_localizer." + messageType.toString()
+      "image_sequence_localizer." + messageType.toString(),
     );
     console.log("Read proto message", protoMessage);
     return protoMessage;
@@ -68,7 +68,7 @@ type MatchingResultElement = {
 };
 
 function readMatchingResultFromProto(
-  matchingResultProto?: any
+  matchingResultProto?: any,
 ): MatchingResultElement[] | undefined {
   if (matchingResultProto == null) {
     return undefined;