pstream is dead; long live pstream
taciturnaxolotl.github.io/pstream-ng/
dont require account to download data
+67
-82
+67
-82
src/pages/migration/MigrationDownload.tsx
+67
-82
src/pages/migration/MigrationDownload.tsx
···
58
58
<MinimalPageLayout>
59
59
<PageTitle subpage k="global.pages.migration" />
60
60
<CenterContainer>
61
-
{user.account ? (
62
-
<div>
63
-
<Stepper steps={2} current={2} className="mb-12" />
64
-
<Heading2 className="!text-4xl">
65
-
{t("migration.download.title")}
66
-
</Heading2>
67
-
<div className="space-y-6 max-w-3xl mx-auto">
68
-
<Paragraph className="text-lg max-w-md">
69
-
{t("migration.download.description")}
70
-
</Paragraph>
71
-
<SettingsCard>
72
-
<div className="flex justify-between items-center">
73
-
<Heading3 className="!my-0 !text-type-secondary">
74
-
{t("migration.download.items.description")}{" "}
75
-
</Heading3>
61
+
<div>
62
+
<Stepper steps={2} current={2} className="mb-12" />
63
+
<Heading2 className="!text-4xl">
64
+
{t("migration.download.title")}
65
+
</Heading2>
66
+
<div className="space-y-6 max-w-3xl mx-auto">
67
+
<Paragraph className="text-lg max-w-md">
68
+
{t("migration.download.description")}
69
+
</Paragraph>
70
+
<SettingsCard>
71
+
<div className="flex justify-between items-center">
72
+
<Heading3 className="!my-0 !text-type-secondary">
73
+
{t("migration.download.items.description")}{" "}
74
+
</Heading3>
75
+
</div>
76
+
<Divider marginClass="my-6 px-8 box-content -mx-8" />
77
+
78
+
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
79
+
<div className="p-4 bg-background rounded-lg">
80
+
<div className="flex items-center gap-2">
81
+
<Icon icon={Icons.BOOKMARK} className="text-xl" />
82
+
<span className="font-medium">
83
+
{t("migration.download.items.bookmarks")}
84
+
</span>
85
+
</div>
86
+
<div className="text-xl font-bold mt-2">
87
+
{Object.keys(bookmarks).length}
88
+
</div>
76
89
</div>
77
-
<Divider marginClass="my-6 px-8 box-content -mx-8" />
78
90
79
-
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
80
-
<div className="p-4 bg-background rounded-lg">
81
-
<div className="flex items-center gap-2">
82
-
<Icon icon={Icons.BOOKMARK} className="text-xl" />
83
-
<span className="font-medium">
84
-
{t("migration.download.items.bookmarks")}
85
-
</span>
86
-
</div>
87
-
<div className="text-xl font-bold mt-2">
88
-
{Object.keys(bookmarks).length}
89
-
</div>
91
+
<div className="p-4 bg-background rounded-lg">
92
+
<div className="flex items-center gap-2">
93
+
<Icon icon={Icons.CLOCK} className="text-xl" />
94
+
<span className="font-medium">
95
+
{t("migration.download.items.progress")}
96
+
</span>
90
97
</div>
91
-
92
-
<div className="p-4 bg-background rounded-lg">
93
-
<div className="flex items-center gap-2">
94
-
<Icon icon={Icons.CLOCK} className="text-xl" />
95
-
<span className="font-medium">
96
-
{t("migration.download.items.progress")}
97
-
</span>
98
-
</div>
99
-
<div className="text-xl font-bold mt-2">
100
-
{Object.keys(progress).length}
101
-
</div>
98
+
<div className="text-xl font-bold mt-2">
99
+
{Object.keys(progress).length}
102
100
</div>
103
101
</div>
104
-
</SettingsCard>
105
-
</div>
106
-
<Divider />
107
-
<div className="flex justify-between">
108
-
<Button theme="secondary" onClick={() => navigate("/migration")}>
109
-
{t("migration.back")}
102
+
</div>
103
+
</SettingsCard>
104
+
</div>
105
+
<Divider />
106
+
<div className="flex justify-between">
107
+
<Button theme="secondary" onClick={() => navigate("/migration")}>
108
+
{t("migration.back")}
109
+
</Button>
110
+
{status !== "success" && (
111
+
<Button theme="purple" onClick={handleDownload}>
112
+
{t("migration.download.button.download")}
110
113
</Button>
111
-
{status !== "success" && (
112
-
<Button theme="purple" onClick={handleDownload}>
113
-
{t("migration.download.button.download")}
114
-
</Button>
115
-
)}
114
+
)}
116
115
117
-
{status === "success" && (
118
-
<div>
119
-
<Button theme="purple" onClick={() => navigate("/")}>
120
-
{t("migration.download.button.home")}
121
-
</Button>
122
-
</div>
123
-
)}
124
-
</div>
125
-
<div className="flex justify-center pt-4">
126
-
{status === "success" && (
127
-
<p className="text-green-600 mt-4">
128
-
{t("migration.download.status.success")}
129
-
</p>
130
-
)}
131
-
{status === "error" && (
132
-
<p className="text-red-600 mt-4">
133
-
{t("migration.download.status.error")}
134
-
</p>
135
-
)}
136
-
</div>
116
+
{status === "success" && (
117
+
<div>
118
+
<Button theme="purple" onClick={() => navigate("/")}>
119
+
{t("migration.download.button.home")}
120
+
</Button>
121
+
</div>
122
+
)}
137
123
</div>
138
-
) : (
139
-
<div className="flex flex-col items-center text-center mb-8">
140
-
<Paragraph className="max-w-[320px] text-md">
141
-
{t("migration.loginRequired")}
142
-
</Paragraph>
143
-
<Button
144
-
theme="purple"
145
-
className="mt-4"
146
-
onClick={() => navigate("/")}
147
-
>
148
-
{t("migration.download.button.home")}
149
-
</Button>
124
+
<div className="flex justify-center pt-4">
125
+
{status === "success" && (
126
+
<p className="text-green-600 mt-4">
127
+
{t("migration.download.status.success")}
128
+
</p>
129
+
)}
130
+
{status === "error" && (
131
+
<p className="text-red-600 mt-4">
132
+
{t("migration.download.status.error")}
133
+
</p>
134
+
)}
150
135
</div>
151
-
)}
136
+
</div>
152
137
</CenterContainer>
153
138
</MinimalPageLayout>
154
139
);