diff --git a/packages/app/src/components/FeaturedEventAnnouncement/index.jsx b/packages/app/src/components/FeaturedEventAnnouncement/index.jsx
index 2d3b3254..33d7628f 100644
--- a/packages/app/src/components/FeaturedEventAnnouncement/index.jsx
+++ b/packages/app/src/components/FeaturedEventAnnouncement/index.jsx
@@ -4,7 +4,16 @@ import { Icons } from "components/Icons"
 import "./index.less"
 
 export default (props) => {
-    const { backgroundImg, backgroundStyle, logoImg, title, description } = props.data ?? {}
+    const { backgroundImg, backgroundStyle, logoImg, title, description } = props.data?.announcement ?? {}
+
+    const onClickEvent = () => {
+        if (!props.data?._id) {
+            console.error("No event ID provided")
+            return false
+        }
+
+        app.setLocation(`/featured-event/${props.data?._id}`)
+    }
 
     return <div
         key={props.index}
@@ -13,6 +22,7 @@ export default (props) => {
             backgroundImage: `url(${backgroundImg})`,
             ...backgroundStyle
         }}
+        onClick={onClickEvent}
     >
         <div className="indicator">
             <Icons.Target /> <span>Featured event</span>
diff --git a/packages/app/src/components/FeaturedEventAnnouncement/index.less b/packages/app/src/components/FeaturedEventAnnouncement/index.less
index b9a69cb7..d2be7faf 100644
--- a/packages/app/src/components/FeaturedEventAnnouncement/index.less
+++ b/packages/app/src/components/FeaturedEventAnnouncement/index.less
@@ -48,9 +48,10 @@
 
     .content {
         display: flex;
-        flex-direction: column;
 
+        flex-direction: column;
         align-items: flex-start;
+
         margin-left: 20px;
         margin-bottom: 10px;