jeanmachine.dev
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
added interactivity for the pds badge based upon context; fixed pixel weirdness via rounding.
+40
-12
+36
-8
src/components/PdsBadge.tsx
+36
-8
src/components/PdsBadge.tsx
···
13
13
import {FaviconOrGlobe, PdsDialog} from '#/components/PdsDialog'
14
14
import {IS_WEB} from '#/env'
15
15
16
-
export function PdsBadge({did, size}: {did: string; size: 'lg' | 'md' | 'sm'}) {
16
+
export function PdsBadge({
17
+
did,
18
+
size,
19
+
interactive = true,
20
+
}: {
21
+
did: string
22
+
size: 'lg' | 'md' | 'sm'
23
+
interactive?: boolean
24
+
}) {
17
25
const enabled = usePdsLabelEnabled()
18
26
const hideBskyPds = usePdsLabelHideBskyPds()
19
27
const {data, isLoading} = usePdsLabelQuery(enabled ? did : undefined)
···
30
38
isBsky={data.isBsky}
31
39
isBridged={data.isBridged}
32
40
size={size}
41
+
interactive={interactive}
33
42
/>
34
43
)
35
44
}
···
61
70
isBsky,
62
71
isBridged,
63
72
size,
73
+
interactive,
64
74
}: {
65
75
pdsUrl: string
66
76
faviconUrl: string
67
77
isBsky: boolean
68
78
isBridged: boolean
69
79
size: 'lg' | 'md' | 'sm'
80
+
interactive: boolean
70
81
}) {
71
82
const {_} = useLingui()
72
83
const {gtPhone} = useBreakpoints()
···
79
90
dimensions = 14
80
91
}
81
92
93
+
const icon = (
94
+
<FaviconOrGlobe
95
+
faviconUrl={faviconUrl}
96
+
isBsky={isBsky}
97
+
isBridged={isBridged}
98
+
size={dimensions}
99
+
borderRadius={dimensions / 4}
100
+
/>
101
+
)
102
+
103
+
if (!interactive) {
104
+
return (
105
+
<View
106
+
style={[
107
+
a.justify_center,
108
+
a.align_center,
109
+
{width: dimensions, height: dimensions},
110
+
]}>
111
+
{icon}
112
+
</View>
113
+
)
114
+
}
115
+
82
116
return (
83
117
<>
84
118
<Button
···
103
137
transform: [{scale: hovered ? 1.1 : 1}],
104
138
},
105
139
]}>
106
-
<FaviconOrGlobe
107
-
faviconUrl={faviconUrl}
108
-
isBsky={isBsky}
109
-
isBridged={isBridged}
110
-
size={dimensions}
111
-
borderRadius={dimensions / 4}
112
-
/>
140
+
{icon}
113
141
</View>
114
142
)}
115
143
</Button>
+1
-1
src/components/PdsDialog.tsx
+1
-1
src/components/PdsDialog.tsx
+2
-2
src/state/queries/pds-label.ts
+2
-2
src/state/queries/pds-label.ts
···
40
40
// Match <link rel="icon"> or <link rel="shortcut icon"> in either attribute order
41
41
const match =
42
42
html.match(
43
-
/<link[^>]+rel=["'](?:shortcut icon|icon)["'][^>]*href=["']([^"']+)["']/i,
43
+
/<link[^>]+rel=["'][^"']*\bicon\b[^"']*["'][^>]*href=["']([^"']+)["']/i,
44
44
) ||
45
45
html.match(
46
-
/<link[^>]+href=["']([^"']+)["'][^>]*rel=["'](?:shortcut icon|icon)["']/i,
46
+
/<link[^>]+href=["']([^"']+)["'][^>]*rel=["'][^"']*\bicon\b[^"']*["']/i,
47
47
)
48
48
if (match) {
49
49
const href = match[1]
+1
-1
src/view/com/util/PostMeta.tsx
+1
-1
src/view/com/util/PostMeta.tsx