blob: 04f82009562366d90bdc15cb6f2ab69379748a78 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
|
<script>
import { t } from "$lib/translations";
import Icon from "$comp/Icon.svelte";
import { page } from "$app/stores";
let { data } = $props();
let { user } = $derived(data);
let paymentsUrl = $derived(
user.shopifyStore &&
"https://admin.shopify.com/store/" +
user.shopifyStore +
"/settings/payments",
);
let checkoutUrl = $derived(
user.shopifyStore &&
"https://admin.shopify.com/store/" +
user.shopifyStore +
"/settings/checkout",
);
let appsUrl = $derived(
user.shopifyStore &&
"https://admin.shopify.com/store/" +
user.shopifyStore +
"/settings/apps/development",
);
let script = `<script src="${$page.url.protocol}//${$page.url.host}/${user.username}/shopify.js"><\/script>`;
</script>
<div>
<label for="shopifyStore" class="font-bold mb-1 block">Store ID</label>
<div class="flex mb-2">
<div
class="input input-bordered input-lg !border-r-0 rounded-2xl !rounded-r-none flex items-center text-right !pr-1 bg-base-200 border-primary"
>
admin.shopify.com/store/
</div>
<input
type="text"
name="shopifyStore"
bind:value={user.shopifyStore}
class="!border-l-0 !rounded-l-none w-auto min-w-0 !pl-1 grow"
/>
</div>
<p class="text-secondary my-2">
Add Bitcoin under <a
class:active={!!paymentsUrl}
href={paymentsUrl || undefined}>Payments > Manual payment methods</a
> with a description like "Pay with Bitcoin".
</p>
</div>
<div>
<label for="display" class="font-bold mb-1 block">Additional scripts</label>
<p class="text-secondary my-2">
Copy this into <a class:active={!!paymentsUrl} href={checkoutUrl}
>Checkout -> Additional scripts</a
>
</p>
<textarea rows={5} type="text" name="shopifyScripts" readonly
>{script}</textarea
>
</div>
<div>
<label for="shopifyToken" class="font-bold mb-1 block"
>Admin API token <span class="font-normal">(Optional)</span></label
>
<p class="text-secondary my-2">
Coinos can automatically mark orders as Paid if you provide an API token.
<input
class="my-4"
type="text"
name="shopifyToken"
bind:value={user.shopifyToken}
/>
</p>
<p class="text-secondary my-2">
Create a new app in <a class:active={!!appsUrl} href={appsUrl || undefined}
>Apps > App Development</a
>
</p>
<p class="text-secondary my-2">
Edit the Admin API scopes to enable <code class="text-black"
>write_orders</code
> permission then install the app into your store and copy the Admin API access
token here.
</p>
</div>
<style>
@reference "../../../../app.css";
.active {
@apply text-blue-500;
}
</style>
|
