Skip to content

Commit c73fe09

Browse files
authored
Merge pull request #102 from poap-xyz/release/v1.6.5
Release v1.6.5
2 parents 59fb2d9 + d086247 commit c73fe09

File tree

8 files changed

+88
-23
lines changed

8 files changed

+88
-23
lines changed

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@poap-xyz/poap-family",
3-
"version": "1.6.4",
3+
"version": "1.6.5",
44
"author": {
55
"name": "POAP",
66
"url": "https://poap.xyz"

src/components/ButtonGroup.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import '../styles/button-group.css'
22

3-
function ButtonGroup({ children, right = false }) {
3+
function ButtonGroup({ children, right = false, vertical = false }) {
44
return (
5-
<div className={`button-group${right ? ' right' : ''}`}>
5+
<div className={`button-group${right ? ' right' : ''}${vertical ? ' vertical' : ''}`}>
66
{children}
77
</div>
88
)

src/components/ButtonMenu.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import ButtonGroup from './ButtonGroup'
2+
import '../styles/button-menu.css'
3+
4+
function ButtonMenu({ primary, buttons }) {
5+
return (
6+
<div className="button-menu">
7+
<div className="button-menu-primary">{primary}</div>
8+
<div className="button-menu-content">
9+
<ButtonGroup vertical={true}>
10+
{buttons}
11+
</ButtonGroup>
12+
</div>
13+
</div>
14+
)
15+
}
16+
17+
export default ButtonMenu

src/pages/Event.js

Lines changed: 32 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { useCallback, useContext, useEffect, useState } from 'react'
22
import { useLoaderData, useNavigate, useSearchParams } from 'react-router-dom'
3+
import { Upload } from 'iconoir-react'
34
import { formatStat } from '../utils/number'
45
import { formatDateAgo } from '../utils/date'
56
import { HTMLContext } from '../stores/html'
@@ -24,6 +25,7 @@ import Progress from '../components/Progress'
2425
import ButtonExportAddressCsv from '../components/ButtonExportAddressCsv'
2526
import ButtonAdd from '../components/ButtonAdd'
2627
import ButtonExpand from '../components/ButtonExpand'
28+
import ButtonMenu from '../components/ButtonMenu'
2729
import LinkButton from '../components/LinkButton'
2830
import '../styles/event.css'
2931

@@ -275,8 +277,8 @@ function Event() {
275277
'moments': metrics && metrics.momentsUploaded > 0
276278
? {
277279
text: formatStat(metrics.momentsUploaded),
278-
title: `Upload moment on ${event.name}`,
279-
link: `${POAP_MOMENTS_URL}/upload?drop=${event.id}`,
280+
title: `View uploaded moments on ${event.name}`,
281+
link: `${POAP_MOMENTS_URL}/drop/${event.id}`,
280282
external: true,
281283
}
282284
: undefined,
@@ -293,17 +295,36 @@ function Event() {
293295
>
294296
export csv
295297
</ButtonExportAddressCsv>,
296-
<LinkButton
298+
<ButtonMenu
297299
key="moments"
298-
title={`View uploaded moments on ${event.name}`}
299-
href={`${POAP_MOMENTS_URL}/drop/${event.id}`}
300-
external={true}
301-
secondary={true}
302-
icon={(
303-
<svg style={{ height: '16px', width: '16px' }} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
304-
<path d="M13.3069 1.40933H11.9604C11.4851 0.994819 10.9307 0.746114 10.297 0.746114H8.31683C7.84158 0.331606 7.28713 0 6.57426 0H2.53465C1.10891 0.0829016 0 1.24352 0 2.65285V13.3471C0 14.7565 1.10891 16 2.53465 16H6.73267C7.36634 16 8 15.7513 8.47525 15.2539H10.4554C11.0891 15.2539 11.6436 15.0052 12.1188 14.5907H13.4653C14.8119 14.5907 16 13.4301 16 11.9378V4.06218C15.8416 2.65285 14.7327 1.40933 13.3069 1.40933ZM14.3366 12.0207C14.3366 12.601 13.8614 13.0984 13.3069 13.0984H12.8317C12.8317 12.9326 12.9109 12.8497 12.9109 12.6839V3.39896C12.9109 3.23316 12.9109 3.15026 12.8317 2.98446H13.3069C13.8614 2.98446 14.3366 3.48186 14.3366 4.06218V12.0207ZM1.50495 13.4301V2.65285C1.50495 2.07254 1.9802 1.57513 2.53465 1.57513H5.14851H6.57426H6.73267C7.20792 1.57513 7.52475 1.90674 7.68317 2.32124C7.68317 2.40414 7.76238 2.56995 7.76238 2.65285V13.3471C7.76238 13.4301 7.76238 13.5959 7.68317 13.6788C7.52475 14.0933 7.20792 14.4249 6.73267 14.4249H6.49505H5.14851H2.53465C1.90099 14.4249 1.50495 14.0104 1.50495 13.4301ZM9.18812 13.4301V13.1813V2.90155V2.65285C9.18812 2.56995 9.18812 2.40414 9.18812 2.32124H9.9802H10.3762C10.7723 2.32124 11.1683 2.56995 11.3267 2.98446C11.4059 3.15026 11.4059 3.23316 11.4059 3.39896V12.6839C11.4059 12.8497 11.4059 13.0155 11.3267 13.0984C11.1683 13.513 10.7723 13.7617 10.3762 13.7617H9.9802H9.18812C9.18812 13.5959 9.18812 13.513 9.18812 13.4301Z" />
305-
</svg>
300+
primary={(
301+
<LinkButton
302+
key="view-moments"
303+
title={`View uploaded moments on ${event.name}`}
304+
href={`${POAP_MOMENTS_URL}/drop/${event.id}`}
305+
external={true}
306+
secondary={true}
307+
icon={(
308+
<svg style={{ height: '16px', width: '16px' }} viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
309+
<path d="M13.3069 1.40933H11.9604C11.4851 0.994819 10.9307 0.746114 10.297 0.746114H8.31683C7.84158 0.331606 7.28713 0 6.57426 0H2.53465C1.10891 0.0829016 0 1.24352 0 2.65285V13.3471C0 14.7565 1.10891 16 2.53465 16H6.73267C7.36634 16 8 15.7513 8.47525 15.2539H10.4554C11.0891 15.2539 11.6436 15.0052 12.1188 14.5907H13.4653C14.8119 14.5907 16 13.4301 16 11.9378V4.06218C15.8416 2.65285 14.7327 1.40933 13.3069 1.40933ZM14.3366 12.0207C14.3366 12.601 13.8614 13.0984 13.3069 13.0984H12.8317C12.8317 12.9326 12.9109 12.8497 12.9109 12.6839V3.39896C12.9109 3.23316 12.9109 3.15026 12.8317 2.98446H13.3069C13.8614 2.98446 14.3366 3.48186 14.3366 4.06218V12.0207ZM1.50495 13.4301V2.65285C1.50495 2.07254 1.9802 1.57513 2.53465 1.57513H5.14851H6.57426H6.73267C7.20792 1.57513 7.52475 1.90674 7.68317 2.32124C7.68317 2.40414 7.76238 2.56995 7.76238 2.65285V13.3471C7.76238 13.4301 7.76238 13.5959 7.68317 13.6788C7.52475 14.0933 7.20792 14.4249 6.73267 14.4249H6.49505H5.14851H2.53465C1.90099 14.4249 1.50495 14.0104 1.50495 13.4301ZM9.18812 13.4301V13.1813V2.90155V2.65285C9.18812 2.56995 9.18812 2.40414 9.18812 2.32124H9.9802H10.3762C10.7723 2.32124 11.1683 2.56995 11.3267 2.98446C11.4059 3.15026 11.4059 3.23316 11.4059 3.39896V12.6839C11.4059 12.8497 11.4059 13.0155 11.3267 13.0984C11.1683 13.513 10.7723 13.7617 10.3762 13.7617H9.9802H9.18812C9.18812 13.5959 9.18812 13.513 9.18812 13.4301Z" />
310+
</svg>
311+
)}
312+
>
313+
Moments
314+
</LinkButton>
306315
)}
316+
buttons={[
317+
<LinkButton
318+
key="upload-moment"
319+
title={`Upload a moment on ${event.name}`}
320+
href={`${POAP_MOMENTS_URL}/upload?drop=${event.id}`}
321+
external={true}
322+
secondary={true}
323+
icon={<Upload />}
324+
>
325+
Publish
326+
</LinkButton>,
327+
]}
307328
/>,
308329
]}
309330
>

src/styles/button-group.css

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
flex-direction: row-reverse;
1111
}
1212

13-
.button-group .button-expand a {
14-
position: relative;
15-
top: 0;
13+
.button-group.vertical {
14+
flex-direction: column;
15+
gap: .5rem;
1616
}

src/styles/button-menu.css

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
.button-menu {
2+
background-color: white;
3+
}
4+
5+
.button-menu .button-menu-content {
6+
position: absolute;
7+
height: 0;
8+
opacity: 0;
9+
transform: scaleY(0);
10+
transform-origin: top center;
11+
overflow: hidden;
12+
}
13+
14+
.button-menu:hover .button-menu-content {
15+
height: auto;
16+
opacity: 1;
17+
transform: scaleY(1);
18+
animation: fade .5s linear forwards;
19+
}
20+
21+
@keyframes fade {
22+
from {
23+
height: 0;
24+
opacity: 0;
25+
transform: scaleY(0);
26+
}
27+
to {
28+
height: auto;
29+
opacity: 1;
30+
transform: scaleY(1);
31+
}
32+
}

src/styles/event-buttons.css

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
.event-buttons {
22
display: flex;
33
justify-content: flex-start;
4-
align-items: baseline;
4+
align-items: center;
55
gap: .5rem;
66
}
77

@@ -17,7 +17,3 @@
1717
display: flex;
1818
gap: .5rem;
1919
}
20-
21-
.event-buttons .buttons a.link-button.secondary {
22-
margin-top: -.4rem;
23-
}

src/styles/link-button.css

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,6 @@
6161

6262
.link-button.secondary {
6363
margin: 0;
64-
top: .4rem;
6564
}
6665

6766
.link-button.secondary::before {

0 commit comments

Comments
 (0)