Thread viewer for Bluesky
1<script lang="ts">
2 import { settings } from '../models/settings.svelte.js';
3 import DialogPanel from './DialogPanel.svelte';
4
5 type Props = {
6 onConfirm?: () => void;
7 onReject?: () => void;
8 onClose?: () => void;
9 }
10
11 let { onConfirm = undefined, onReject = undefined, onClose = undefined }: Props = $props();
12
13 function showBiohazard(e: Event) {
14 e.preventDefault();
15 settings.biohazardsEnabled = true;
16
17 onConfirm?.()
18 onClose?.();
19 }
20
21 function hideBiohazard(e: Event) {
22 e.preventDefault();
23 settings.biohazardsEnabled = false;
24
25 onReject?.();
26 onClose?.();
27 }
28</script>
29
30<DialogPanel onClose={() => onClose?.()}>
31 <form method="get">
32 <i class="close fa-circle-xmark fa-regular" onclick={onClose}></i>
33 <h2>☣️ Infohazard Warning</h2>
34
35 <p>“<em>This thread is not a place of honor... no highly esteemed post is commemorated here... nothing valued is here.</em>”</p>
36 <p>This feature allows access to comments in a thread which were hidden because one of the commenters has blocked another. Bluesky currently hides such comments to avoid escalating conflicts.</p>
37 <p>Are you sure you want to enter?<br>(You can toggle this in the menu in top-left corner.)</p>
38
39 <p class="submit">
40 <input type="submit" value="Show me the drama 😈" onclick={showBiohazard}>
41 <input type="submit" value="Nope, I'd rather not 🙈" onclick={hideBiohazard}>
42 </p>
43 </form>
44</DialogPanel>
45
46<style>
47 form {
48 width: 400px;
49 }
50
51 :global(.dialog) p.submit {
52 margin-top: 40px;
53 margin-bottom: 20px;
54 }
55
56 :global(.dialog) input[type="submit"] {
57 width: 180px;
58 margin-left: 5px;
59 margin-right: 5px;
60 }
61</style>