From 0e752dcb89027a5beac33f13d70e2c2cd387ab61 Mon Sep 17 00:00:00 2001
From: Juan M <jm@guide42.com>
Date: Thu, 25 May 2023 14:39:33 +0200
Subject: [PATCH 1/4] Add link to event in in common

---
 src/components/InCommon.js |  1 +
 src/styles/in-common.css   | 12 ++++++++++++
 2 files changed, 13 insertions(+)

diff --git a/src/components/InCommon.js b/src/components/InCommon.js
index db5f70f..97fc56c 100644
--- a/src/components/InCommon.js
+++ b/src/components/InCommon.js
@@ -160,6 +160,7 @@ function InCommon({
                     : <EventCount event={events[eventId]} count={addresses.length} size={64} />
                   }
                 </button>
+                <Link to={`/event/${eventId}`} className="event-id">#{eventId}</Link>
               </div>
             )
           )}
diff --git a/src/styles/in-common.css b/src/styles/in-common.css
index d480080..f74f185 100644
--- a/src/styles/in-common.css
+++ b/src/styles/in-common.css
@@ -30,6 +30,18 @@
   height: 64px;
 }
 
+.in-common .in-common-event .event-id {
+  text-align: center;
+  display: block;
+  cursor: pointer;
+  font-size: 80%;
+  margin: .1rem;
+}
+
+.in-common .in-common-event.selected .event-id {
+  color: white;
+}
+
 .in-common .show-more {
   display: inline-block;
   margin-left: .5rem;

From 9801eebb65976c1399abc67bc3b98b6ed790434c Mon Sep 17 00:00:00 2001
From: Juan M <jm@guide42.com>
Date: Thu, 25 May 2023 14:42:22 +0200
Subject: [PATCH 2/4] Remove link to event in active event image

---
 src/components/EventHeader.js | 12 ++----------
 src/components/InCommon.js    |  2 +-
 2 files changed, 3 insertions(+), 11 deletions(-)

diff --git a/src/components/EventHeader.js b/src/components/EventHeader.js
index 8d32dee..71a701e 100644
--- a/src/components/EventHeader.js
+++ b/src/components/EventHeader.js
@@ -1,19 +1,11 @@
-import { Link } from 'react-router-dom'
 import TokenImage from './TokenImage'
 import '../styles/event-header.css'
 
-function EventHeader({ event, linkToEvent = false }) {
+function EventHeader({ event, size = 48 }) {
   return (
     <div className="event-header">
       <div className="event-header-image">
-        {linkToEvent
-          ? (
-            <Link to={`/event/${event.id}`}>
-              <TokenImage event={event} size={48} resize={true} />
-            </Link>
-          )
-          : <TokenImage event={event} size={48} resize={true} />
-        }
+        <TokenImage event={event} size={size} resize={true} />
       </div>
       <div className="event-header-info">
         <div className="event-id">#{event.id}</div>
diff --git a/src/components/InCommon.js b/src/components/InCommon.js
index db5f70f..b3e0a3b 100644
--- a/src/components/InCommon.js
+++ b/src/components/InCommon.js
@@ -182,7 +182,7 @@ function InCommon({
           {activeEventIds.map((activeEventId) =>
             <div className="active-event" key={activeEventId}>
               <Card>
-                <EventHeader event={events[activeEventId]} linkToEvent={true} />
+                <EventHeader event={events[activeEventId]} size={48} />
                 <div className="active-event-actions">
                   {createActiveTopButtons(activeEventId)}
                   <ButtonClose onClose={() => removeActiveEventId(activeEventId)} />

From 7f99293c83d4f49ca0b78f9867c3e11eaceb0c85 Mon Sep 17 00:00:00 2001
From: Juan M <jm@guide42.com>
Date: Thu, 25 May 2023 14:43:15 +0200
Subject: [PATCH 3/4] Add link to event in event id on active event header

---
 src/components/EventHeader.js | 3 ++-
 src/styles/event-header.css   | 1 +
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/EventHeader.js b/src/components/EventHeader.js
index 71a701e..e8454cf 100644
--- a/src/components/EventHeader.js
+++ b/src/components/EventHeader.js
@@ -1,3 +1,4 @@
+import { Link } from 'react-router-dom'
 import TokenImage from './TokenImage'
 import '../styles/event-header.css'
 
@@ -8,7 +9,7 @@ function EventHeader({ event, size = 48 }) {
         <TokenImage event={event} size={size} resize={true} />
       </div>
       <div className="event-header-info">
-        <div className="event-id">#{event.id}</div>
+        <Link className="event-id">#{event.id}</Link>
         <h2 title={event.name}>{event.name}</h2>
       </div>
     </div>
diff --git a/src/styles/event-header.css b/src/styles/event-header.css
index 60e7854..74184c5 100644
--- a/src/styles/event-header.css
+++ b/src/styles/event-header.css
@@ -6,6 +6,7 @@
 .event-header .event-id {
   font-weight: bold;
   line-height: 1.6;
+  color: black;
 }
 
 .event-header h2 {

From 9a6ba5300a3149f67e7abcac02ba2ae6f16dc295 Mon Sep 17 00:00:00 2001
From: Juan M <jm@guide42.com>
Date: Thu, 25 May 2023 14:47:30 +0200
Subject: [PATCH 4/4] Fix in-common key on div

---
 src/components/InCommon.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/InCommon.js b/src/components/InCommon.js
index db5f70f..950d971 100644
--- a/src/components/InCommon.js
+++ b/src/components/InCommon.js
@@ -143,11 +143,11 @@ function InCommon({
           {inCommonEntries.map(
             ([eventId, addresses]) => (
               <div
+                key={eventId}
                 className={`in-common-event${activeEventIds.indexOf(eventId) !== -1 ? ' selected' : ''}${showCount > 0 && showCount === addresses.length ? ' perfect' : ''}`}
                 title={events[eventId].name}
               >
                 <button
-                  key={eventId}
                   className="event-button"
                   onClick={() => toggleActiveEventId(eventId)}
                 >