Skip to content

Commit 477d3d9

Browse files
noobGnoobG
committed
Merge branch 'main' of github.com:efdevcon/monorepo
2 parents 80af64e + de2ed0e commit 477d3d9

6 files changed

Lines changed: 326 additions & 57 deletions

File tree

‎devconnect-app/public/images/icons/star-completed.svg‎

Lines changed: 24 additions & 0 deletions
Loading

‎devconnect-app/public/images/icons/star.svg‎

Lines changed: 11 additions & 0 deletions
Loading

‎devconnect-app/src/app/map/venue-map/VenueMap2.tsx‎

Lines changed: 153 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import { Pin } from './components/Pin';
1919
import cn from 'classnames';
2020
import css from './map.module.scss';
2121
import { X } from 'lucide-react';
22-
import { useSearchParams } from 'next/navigation';
22+
import { useSearchParams, useRouter } from 'next/navigation';
2323
import { getViewportPosition } from './utils/svgToLookup';
2424

2525
const MapPane = (props: {
@@ -28,16 +28,31 @@ const MapPane = (props: {
2828
elementLookup: SVGLookup;
2929
}) => {
3030
const { selection, elementLookup } = props;
31+
const router = useRouter();
3132

3233
const element = selection ? elementLookup[selection] : null;
3334

35+
// Data from supporters.ts for AAVE
36+
const elementData = {
37+
title: 'AAVE',
38+
description: 'Decentralized lending protocol',
39+
hasQuest: true,
40+
image: 'https://storage.googleapis.com/zapper-fi-assets/apps%2Faave-v3.png',
41+
};
42+
3443
return (
3544
<div
3645
className={cn(
37-
'flex justify-between absolute z-[1] bottom-0 left-0 right-0 border-t border-t-solid border-gray-200 p-4 transition-all duration-300 translate-y-[100%] opacity-0',
46+
'absolute z-[1] bottom-0 left-0 right-0 transition-all duration-300 translate-y-[100%] opacity-0',
3847
selection && '!translate-y-[0%] opacity-100',
3948
css['map']
4049
)}
50+
style={{
51+
borderTop: '1px solid rgba(255, 255, 255, 0.70)',
52+
background:
53+
'linear-gradient(0deg, rgba(255, 255, 255, 0.70) 0%, rgba(255, 255, 255, 0.70) 100%), linear-gradient(0deg, #AAA7FF 0%, #F6B40E 100%)',
54+
boxShadow: '0 -2px 4px 0 rgba(54, 54, 76, 0.10)',
55+
}}
4156
// Don't let the click/touch events bubble up to the panzoom container
4257
onClick={(e) => {
4358
e.stopPropagation();
@@ -46,15 +61,142 @@ const MapPane = (props: {
4661
e.stopPropagation();
4762
}}
4863
>
49-
<div className={cn('text-sm font-bold', !selection && 'text-white')}>
50-
{element?.id || selection || 'no-selection'}
51-
</div>
52-
<div className="flex items-center justify-center">
53-
<X
54-
className="h-4 w-4"
55-
onClick={() => props.setCurrentFilters(initialFilters)}
56-
onTouchEnd={() => props.setCurrentFilters(initialFilters)}
57-
/>
64+
<div className="flex flex-col gap-4 p-5 pt-5">
65+
{/* Header with back button and close button */}
66+
<div className="flex justify-between items-center">
67+
{/* Back button - hardcoded navigation to /quests/app-showcase#14 */}
68+
<button
69+
onClick={(e) => {
70+
console.log('Back button clicked');
71+
e.preventDefault();
72+
e.stopPropagation();
73+
window.location.href = '/quests/app-showcase#14';
74+
}}
75+
onTouchEnd={(e) => {
76+
console.log('Back button touched');
77+
e.preventDefault();
78+
e.stopPropagation();
79+
window.location.href = '/quests/app-showcase#14';
80+
}}
81+
className="flex gap-1 items-center hover:opacity-80 transition-opacity"
82+
>
83+
<div className="w-4 h-4 flex items-center justify-center">
84+
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
85+
<path
86+
d="M10 12L6 8L10 4"
87+
stroke="#36364c"
88+
strokeWidth="1.5"
89+
strokeLinecap="round"
90+
strokeLinejoin="round"
91+
/>
92+
</svg>
93+
</div>
94+
<div className="text-sm font-semibold text-[#36364c]">Back</div>
95+
</button>
96+
97+
{/* Close button - navigates to /map and closes MapPane */}
98+
<button
99+
onClick={(e) => {
100+
console.log('Close button clicked');
101+
e.preventDefault();
102+
e.stopPropagation();
103+
props.setCurrentFilters(initialFilters);
104+
window.location.href = '/map';
105+
}}
106+
onTouchEnd={(e) => {
107+
console.log('Close button touched');
108+
e.preventDefault();
109+
e.stopPropagation();
110+
props.setCurrentFilters(initialFilters);
111+
window.location.href = '/map';
112+
}}
113+
className="w-6 h-6 flex items-center justify-center hover:opacity-80 transition-opacity"
114+
>
115+
<X className="w-4 h-4 text-[#36364c]" />
116+
</button>
117+
</div>
118+
119+
{/* Main content */}
120+
<div className="flex gap-3 items-start">
121+
{/* Image */}
122+
<div className="w-11 h-11 bg-gray-200 rounded flex-shrink-0">
123+
<img
124+
src={elementData.image}
125+
alt={elementData.title}
126+
className="w-full h-full object-cover rounded"
127+
/>
128+
</div>
129+
130+
{/* Content */}
131+
<div className="flex flex-col gap-1.5 flex-1 min-w-0">
132+
{/* Title and AI badge */}
133+
<div className="flex gap-1.5 items-center">
134+
<div className="text-base font-bold text-[#242436]">
135+
{elementData.title}
136+
</div>
137+
<div className="px-1 py-0.5 border border-[#4b4b66] rounded">
138+
<div className="text-[10px] font-semibold text-[#36364c] tracking-[0.2px]">
139+
DeFi
140+
</div>
141+
</div>
142+
</div>
143+
144+
{/* Quest info */}
145+
{elementData.hasQuest && (
146+
<div className="flex gap-1 items-center">
147+
<div className="w-4 h-4 flex items-center justify-center">
148+
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
149+
<path
150+
d="M8 1L10.09 5.26L15 6L11 9.74L11.82 15L8 12.27L4.18 15L5 9.74L1 6L5.91 5.26L8 1Z"
151+
fill="#36364c"
152+
/>
153+
</svg>
154+
</div>
155+
<div className="text-xs font-medium text-[#36364c] tracking-[-0.1px]">
156+
Quest available
157+
</div>
158+
</div>
159+
)}
160+
</div>
161+
</div>
162+
163+
{/* Description */}
164+
<div className="text-sm text-[#36364c] tracking-[-0.1px] leading-[1.3]">
165+
{elementData.description}
166+
</div>
167+
168+
{/* Action buttons */}
169+
<div className="flex gap-3">
170+
<button
171+
onClick={(e) => e.stopPropagation()}
172+
onTouchEnd={(e) => e.stopPropagation()}
173+
className="flex-1 bg-[#eaf3fa] border border-white rounded px-3 py-3 shadow-[0px_4px_0px_0px_#595978] hover:bg-[#ddeaf5] transition-colors"
174+
>
175+
<div className="text-sm font-bold text-[#36364c] text-center">
176+
Learn more
177+
</div>
178+
</button>
179+
{/* View Quest button - hardcoded navigation to /quests/app-showcase#14 */}
180+
<button
181+
onClick={(e) => {
182+
console.log('View Quest button clicked');
183+
e.preventDefault();
184+
e.stopPropagation();
185+
window.location.href = '/quests/app-showcase#14';
186+
}}
187+
onTouchEnd={(e) => {
188+
console.log('View Quest button touched');
189+
e.preventDefault();
190+
e.stopPropagation();
191+
window.location.href = '/quests/app-showcase#14';
192+
}}
193+
className="flex-1 bg-[#1b6fae] rounded px-3 py-3 shadow-[0px_4px_0px_0px_#125181] hover:bg-[#155a8a] transition-colors"
194+
>
195+
<div className="text-sm font-bold text-white text-center">
196+
View Quest
197+
</div>
198+
</button>
199+
</div>
58200
</div>
59201
</div>
60202
);

0 commit comments

Comments
 (0)