Skip to content

Commit 1a3fdda

Browse files
committed
new bolt
1 parent 7989e38 commit 1a3fdda

File tree

17 files changed

+855
-63
lines changed

17 files changed

+855
-63
lines changed

api/resolvers/item.js

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -374,10 +374,7 @@ export default {
374374

375375
return sats || 0
376376
},
377-
mine: async (item, args, { me, models }) => {
378-
return me?.id === item.userId
379-
},
380-
meBoost: async (item, args, { me, models }) => {
377+
meSats: async (item, args, { me, models }) => {
381378
if (!me) return 0
382379

383380
const { sum: { sats } } = await models.itemAct.aggregate({
@@ -387,12 +384,22 @@ export default {
387384
where: {
388385
itemId: item.id,
389386
userId: me.id,
390-
act: 'BOOST'
387+
OR: [
388+
{
389+
act: 'TIP'
390+
},
391+
{
392+
act: 'VOTE'
393+
}
394+
]
391395
}
392396
})
393397

394398
return sats || 0
395399
},
400+
mine: async (item, args, { me, models }) => {
401+
return me?.id === item.userId
402+
},
396403
meTip: async (item, args, { me, models }) => {
397404
if (!me) return 0
398405

api/typeDefs/item.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export default gql`
5656
tips: Int!
5757
mine: Boolean!
5858
meVote: Int!
59-
meBoost: Int!
59+
meSats: Int!
6060
meTip: Int!
6161
ncomments: Int!
6262
comments: [Item!]!

components/comment.module.css

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
.item {
22
align-items: flex-start;
3+
margin-bottom: 0 !important;
34
}
45

56
.upvote {
@@ -40,7 +41,7 @@
4041

4142
.children {
4243
margin-top: 0;
43-
margin-left: 24px;
44+
margin-left: 28px;
4445
}
4546

4647
.comments {

components/header.js

Lines changed: 10 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import Nav from 'react-bootstrap/Nav'
33
import Link from 'next/link'
44
import styles from './header.module.css'
55
import { useRouter } from 'next/router'
6-
import { Button, Container, NavDropdown, SplitButton, Dropdown } from 'react-bootstrap'
6+
import { Button, Container, NavDropdown } from 'react-bootstrap'
77
import Price from './price'
88
import { useMe } from './me'
99
import Head from 'next/head'
@@ -30,18 +30,12 @@ export default function Header () {
3030
const router = useRouter()
3131
const path = router.asPath.split('?')[0]
3232
const me = useMe()
33-
const [sort, setSort] = useState('recent')
3433
const [within, setWithin] = useState()
3534

3635
useEffect(() => {
37-
setSort(localStorage.getItem('sort') || 'recent')
3836
setWithin(localStorage.getItem('topWithin'))
3937
}, [])
4038

41-
const otherSort = sort === 'recent' ? 'top' : 'recent'
42-
const sortLink = `/${sort}${sort === 'top' && within ? `/${within}` : ''}`
43-
const otherSortLink = `/${otherSort}${otherSort === 'top' && within ? `/${within}` : ''}`
44-
4539
const Corner = () => {
4640
if (me) {
4741
return (
@@ -147,22 +141,15 @@ export default function Header () {
147141
<Link href='/' passHref>
148142
<Navbar.Brand className={`${styles.brand} d-block d-sm-none`}>SN</Navbar.Brand>
149143
</Link>
150-
<Nav.Item className='d-md-flex d-none nav-dropdown-toggle'>
151-
<SplitButton
152-
title={
153-
<Link href={sortLink} passHref>
154-
<Nav.Link className={styles.navLink}>{sort}</Nav.Link>
155-
</Link>
156-
}
157-
key={`/${sort}`}
158-
id='recent-top-button'
159-
variant='link'
160-
className='p-0'
161-
>
162-
<Link href={otherSortLink} passHref>
163-
<Dropdown.Item onClick={() => localStorage.setItem('sort', otherSort)}>{otherSort}</Dropdown.Item>
164-
</Link>
165-
</SplitButton>
144+
<Nav.Item className='d-md-flex d-none'>
145+
<Link href='/recent' passHref>
146+
<Nav.Link className={styles.navLink}>recent</Nav.Link>
147+
</Link>
148+
</Nav.Item>
149+
<Nav.Item className='d-md-flex d-none'>
150+
<Link href={`/top${within ? `/${within}` : ''}`} passHref>
151+
<Nav.Link className={styles.navLink}>top</Nav.Link>
152+
</Link>
166153
</Nav.Item>
167154
<Nav.Item className='d-md-flex d-none'>
168155
{me

components/header.module.css

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,11 @@
55
line-height: 100%;
66
margin-bottom: -.3rem;
77
margin-right: 0;
8-
text-shadow: 0 0 10px #FADA5E;
8+
text-shadow: 0 0 10px var(--primary);
99
color: var(--theme-brandColor) !important;
1010
}
1111

12+
1213
.navLink {
1314
padding: 0.25rem 1rem;
1415
}

components/item.module.css

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,11 @@ a.link:visited {
3535
display: flex;
3636
justify-content: flex-start;
3737
min-width: 0;
38+
margin-bottom: .2rem;
39+
}
40+
41+
.item .cover {
42+
top: 4px;
3843
}
3944

4045
.hunk {
@@ -51,7 +56,7 @@ a.link:visited {
5156

5257
.children {
5358
margin-top: .25rem;
54-
margin-left: 24px;
59+
margin-left: 28px;
5560
}
5661

5762
.rank {

components/notifications.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ function Notification ({ n }) {
3030
<small className='font-weight-bold text-info ml-2'>you were mentioned in</small>}
3131
<div className={
3232
n.__typename === 'Votification' || n.__typename === 'Mention'
33-
? 'ml-sm-4 ml-3'
33+
? ''
3434
: 'py-2'
3535
}
3636
>

components/price.js

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,10 @@ export default function Price () {
5151

5252
const fixed = (n, f) => Number.parseFloat(n).toFixed(f)
5353
const handleClick = () => {
54-
if (asSats) {
54+
if (asSats === 'yep') {
55+
localStorage.setItem('asSats', '1btc')
56+
setAsSats('1btc')
57+
} else if (asSats === '1btc') {
5558
localStorage.removeItem('asSats')
5659
setAsSats(undefined)
5760
} else {
@@ -60,17 +63,25 @@ export default function Price () {
6063
}
6164
}
6265

63-
if (asSats) {
66+
if (asSats === 'yep') {
6467
return (
6568
<Button className='text-reset px-1 py-0' onClick={handleClick} variant='link'>
6669
{fixed(100000000 / price, 0) + ' sats/$'}
6770
</Button>
6871
)
6972
}
7073

74+
if (asSats === '1btc') {
75+
return (
76+
<Button className='text-reset px-1 py-0' onClick={handleClick} variant='link'>
77+
1sat=1sat
78+
</Button>
79+
)
80+
}
81+
7182
return (
7283
<Button className='text-reset px-1 py-0' onClick={handleClick} variant='link'>
73-
{'$' + fixed(price, 2)}
84+
{'$' + fixed(price, 0)}
7485
</Button>
7586
)
7687
}

components/upvote.js

Lines changed: 34 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { LightningConsumer } from './lightning'
2-
import UpArrow from '../svgs/lightning-arrow.svg'
3-
import BoltAdd from '../svgs/lightning-pplus.svg'
2+
import UpBolt from '../svgs/bolt.svg'
43
import styles from './upvote.module.css'
54
import { gql, useMutation } from '@apollo/client'
65
import { signIn } from 'next-auth/client'
@@ -11,6 +10,7 @@ import Window from '../svgs/window-2-fill.svg'
1110
import { useMe } from './me'
1211
import { useState } from 'react'
1312
import LongPressable from 'react-longpressable'
13+
import Rainbow from '../lib/rainbow'
1414

1515
export default function UpVote ({ item, className }) {
1616
const { setError } = useFundError()
@@ -37,12 +37,6 @@ export default function UpVote ({ item, className }) {
3737
}
3838
return existingMeVote
3939
},
40-
meBoost (existingMeBoost = 0) {
41-
if (act === 'BOOST') {
42-
return existingMeBoost + sats
43-
}
44-
return existingMeBoost
45-
},
4640
meTip (existingMeTip = 0) {
4741
if (act === 'TIP') {
4842
return existingMeTip + sats
@@ -55,6 +49,12 @@ export default function UpVote ({ item, className }) {
5549
}
5650
return existingSats
5751
},
52+
meSats (existingSats = 0) {
53+
if (act === 'VOTE' || act === 'TIP') {
54+
return existingSats + sats
55+
}
56+
return existingSats
57+
},
5858
boost (existingBoost = 0) {
5959
if (act === 'BOOST') {
6060
return existingBoost + sats
@@ -76,17 +76,29 @@ export default function UpVote ({ item, className }) {
7676
const overlayText = () => {
7777
if (item?.meVote) {
7878
if (me?.tipDefault) {
79-
return `tip ${me.tipDefault}`
79+
return `${me.tipDefault} sat${me.tipDefault > 1 ? 's' : ''}`
8080
}
8181
return <Window style={{ fill: '#fff' }} width={18} height={18} />
8282
}
8383

8484
return '1 sat'
8585
}
8686

87-
const noSelfTips = item?.meVote && item?.mine
88-
const Arrow = item?.meVote && !item?.mine ? BoltAdd : UpArrow
87+
const getColor = (meSats) => {
88+
if (!meSats || meSats <= 10) {
89+
return 'var(--secondary)'
90+
}
91+
92+
const idx = Math.min(
93+
Math.floor((Math.log(meSats) / Math.log(100000)) * (Rainbow.length - 1)),
94+
Rainbow.length - 1)
95+
return Rainbow[idx]
96+
}
8997

98+
const noSelfTips = item?.meVote && item?.mine
99+
// 12 px default height
100+
const cover = (item?.meSats < 10 ? ((10 - item.meSats) / 10.0) : 0) * 12
101+
const color = getColor(item?.meSats)
90102
return (
91103
<LightningConsumer>
92104
{({ strike }) =>
@@ -150,8 +162,10 @@ export default function UpVote ({ item, className }) {
150162
}
151163
>
152164
<ActionTooltip notForm disable={noSelfTips} overlayText={overlayText()}>
153-
<div>
154-
<Arrow
165+
<div className={`${noSelfTips ? styles.noSelfTips : ''}
166+
${styles.upvoteWrapper}`}
167+
>
168+
<UpBolt
155169
width={24}
156170
height={24}
157171
className={
@@ -160,10 +174,17 @@ export default function UpVote ({ item, className }) {
160174
${noSelfTips ? styles.noSelfTips : ''}
161175
${item?.meVote ? styles.voted : ''}`
162176
}
177+
style={item?.meVote
178+
? {
179+
fill: color,
180+
filter: `drop-shadow(0 0 6px ${color}90)`
181+
}
182+
: undefined}
163183
onClick={e => {
164184
e.stopPropagation()
165185
}}
166186
/>
187+
<div className={styles.cover} style={{ top: item?.parentId ? '9px' : '4px', height: `${cover}px` }} />
167188
</div>
168189
</ActionTooltip>
169190
</LongPressable>}

components/upvote.module.css

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,35 @@
11
.upvote {
2-
fill: grey;
2+
fill: #a5a5a5;
33
user-select: none;
44
-webkit-user-select: none;
55
-webkit-touch-callout: none;
66
}
77

8-
.upvote:hover {
9-
fill: darkgray;
10-
cursor: pointer;
8+
.upvoteWrapper {
9+
position: relative;
10+
padding-right: .2rem;
1111
}
1212

13-
.noSelfTips:hover {
14-
cursor: default !important;
13+
.noSelfTips .upvote.voted {
14+
fill: transparent !important;
15+
filter: none !important;
16+
}
17+
18+
.upvoteWrapper:not(.noSelfTips):hover {
19+
cursor: pointer;
1520
}
1621

1722
.upvote.voted {
1823
fill: #F6911D;
19-
filter: drop-shadow(0 0 7px #F6911D);
24+
filter: drop-shadow(0 0 6px #f6911d90);
2025
}
2126

22-
.upvote.stimi {
23-
/* fill: #993DF5;
24-
filter: drop-shadow(0 0 7px #C28BF9); */
25-
fill: #F6911D;
26-
filter: drop-shadow(0 0 7px #F6911D);
27+
.cover {
28+
background: var(--theme-body);
29+
width: 100%;
30+
overflow: hidden;
31+
mix-blend-mode: color;
32+
position: absolute;
33+
left: 4px;
34+
width: 17px;
2735
}

0 commit comments

Comments
 (0)