Barazo default frontend
barazo.forum
feat(auth): add PDS host options and Bluesky logo to login page (#96)
Show Bluesky (with butterfly logo), Blacksky, and Eurosky as account
creation options instead of only Bluesky. Adds a note that any AT
Protocol PDS host works, supporting the decentralization-first
principle.
authored by
Guido X Jansen
and committed by
GitHub
3a62e20e
72e2eea0
+59
-15
+13
-4
src/__tests__/auth/login-page.test.tsx
+13
-4
src/__tests__/auth/login-page.test.tsx
···
83
83
expect(mockLogin).toHaveBeenCalledWith('test.bsky.social')
84
84
})
85
85
86
-
it('has link to create account', () => {
86
+
it('has links to create accounts on PDS hosts', () => {
87
87
render(<LoginPage />)
88
-
const link = screen.getByRole('link', { name: /create one on bluesky/i })
89
-
expect(link).toHaveAttribute('href', 'https://bsky.app')
90
-
expect(link).toHaveAttribute('target', '_blank')
88
+
89
+
const blueskyLink = screen.getByRole('link', { name: /bluesky/i })
90
+
expect(blueskyLink).toHaveAttribute('href', 'https://bsky.app')
91
+
expect(blueskyLink).toHaveAttribute('target', '_blank')
92
+
93
+
const blackskyLink = screen.getByRole('link', { name: /blacksky/i })
94
+
expect(blackskyLink).toHaveAttribute('href', 'https://blacksky.community')
95
+
expect(blackskyLink).toHaveAttribute('target', '_blank')
96
+
97
+
const euroskyLink = screen.getByRole('link', { name: /eurosky/i })
98
+
expect(euroskyLink).toHaveAttribute('href', 'https://www.eurosky.tech/register')
99
+
expect(euroskyLink).toHaveAttribute('target', '_blank')
91
100
})
92
101
})
+46
-11
src/app/login/page.tsx
+46
-11
src/app/login/page.tsx
···
133
133
</button>
134
134
</form>
135
135
136
-
<p className="text-center text-sm text-muted-foreground">
137
-
Don’t have an account?{' '}
138
-
<a
139
-
href="https://bsky.app"
140
-
target="_blank"
141
-
rel="noopener noreferrer"
142
-
className="text-primary underline decoration-primary/50 hover:text-primary-hover hover:decoration-primary"
143
-
>
144
-
Create one on Bluesky
145
-
</a>
146
-
</p>
136
+
<div className="space-y-2 text-center">
137
+
<p className="text-sm text-muted-foreground">
138
+
Don’t have an account? Create one at
139
+
</p>
140
+
<div className="flex items-center justify-center gap-3 text-sm">
141
+
<a
142
+
href="https://bsky.app"
143
+
target="_blank"
144
+
rel="noopener noreferrer"
145
+
className="inline-flex items-center gap-1.5 text-primary underline decoration-primary/50 hover:text-primary-hover hover:decoration-primary"
146
+
>
147
+
<svg
148
+
viewBox="0 0 568 501"
149
+
className="h-3.5 w-3.5 shrink-0"
150
+
fill="currentColor"
151
+
aria-hidden="true"
152
+
>
153
+
<path d="M123.121 33.664C188.241 82.553 258.281 181.681 284 234.873c25.719-53.192 95.759-152.32 160.879-201.209C491.866-1.612 568-28.906 568 57.947c0 17.345-9.945 131.876-14.624 151.903C537.322 275.855 478.267 293.601 425.672 282.587c-78.544-17.106-101.047 21.172-101.047 21.172s0 37.277 81.625 20.452c78-17.451 106.625 30.5 106.625 30.5s-61.25 111.25-173.625 67.375C298.125 406.711 284 364.711 284 334.211s-14.125 72.5-55.25 87.875c-112.375 43.875-173.625-67.375-173.625-67.375s28.625-47.951 106.625-30.5c81.625 16.825 81.625-20.452 81.625-20.452s-22.503-38.278-101.047-21.172c-52.595 11.014-111.65-6.732-127.704-72.738C9.945 189.823 0 75.292 0 57.947 0-28.906 76.134-1.612 123.121 33.664Z" />
154
+
</svg>
155
+
Bluesky
156
+
</a>
157
+
<span className="text-muted-foreground/50" aria-hidden="true">
158
+
·
159
+
</span>
160
+
<a
161
+
href="https://blacksky.community"
162
+
target="_blank"
163
+
rel="noopener noreferrer"
164
+
className="text-primary underline decoration-primary/50 hover:text-primary-hover hover:decoration-primary"
165
+
>
166
+
Blacksky
167
+
</a>
168
+
<span className="text-muted-foreground/50" aria-hidden="true">
169
+
·
170
+
</span>
171
+
<a
172
+
href="https://www.eurosky.tech/register"
173
+
target="_blank"
174
+
rel="noopener noreferrer"
175
+
className="text-primary underline decoration-primary/50 hover:text-primary-hover hover:decoration-primary"
176
+
>
177
+
Eurosky
178
+
</a>
179
+
</div>
180
+
<p className="text-xs text-muted-foreground">or any other AT Protocol PDS host</p>
181
+
</div>
147
182
</div>
148
183
</div>
149
184
)