look at the exangeables as well

components/content/SystemOperonStructure.vue

@@ -48,10 +48,15 @@ const sanitizedHits = computed<StructureOperonGeneWithImg[]>(() => {
             // get structure information for this prot
             const monomerStructuresVal = toValue(monomerStructures)
             const sanitizedGene = hit.gene.split("__")[1]
+            const sanitizedExangeableGenes = hit.exchangeables.map(g => g.split("__")[1])
+            const genesAndSynonymous = new Set([sanitizedGene, ...sanitizedExangeableGenes])
             if (monomerStructuresVal) {
                 const struct = monomerStructuresVal.find((struct) => {
-                    return struct.proteins_in_the_prediction[0] === sanitizedGene
+                    return genesAndSynonymous.has(struct.proteins_in_the_prediction[0])
                 })
+                if (struct === undefined) {
+                    console.log(hit)
+                }
                 const rawImgUrl = joinURL(`/${system.toLowerCase()}`, struct?.structImg ?? '')
                 const rawStructUrl = joinURL(`/${system.toLowerCase()}`, struct?.structPath ?? '')
                 const { refinedUrl: structImgHref } = useRefinedUrl(rawImgUrl)

types/structure.ts

@@ -4,6 +4,8 @@ export interface StructureOperonGene {
     subsystem: string
     version: string
     system: string
+    exchangeables: string[]
+
 }
 
 export interface StructureOperonGeneWithImg extends StructureOperonGene {