Spaces:
Sleeping
Sleeping
Update src/components/deploy-button/deploy-button.tsx
Browse files
src/components/deploy-button/deploy-button.tsx
CHANGED
@@ -1,23 +1,23 @@
|
|
1 |
-
|
2 |
-
|
3 |
-
|
4 |
-
|
5 |
-
|
6 |
-
|
7 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
8 |
const [loading, setLoading] = useState(false);
|
9 |
|
10 |
const handleDownload = () => {
|
11 |
-
if (error) return; // optional check
|
12 |
setLoading(true);
|
13 |
setTimeout(() => {
|
14 |
-
|
15 |
-
const url = URL.createObjectURL(blob);
|
16 |
-
const a = document.createElement("a");
|
17 |
-
a.href = url;
|
18 |
-
a.download = "index.html";
|
19 |
-
a.click();
|
20 |
-
URL.revokeObjectURL(url);
|
21 |
setLoading(false);
|
22 |
}, 300);
|
23 |
};
|
@@ -28,14 +28,16 @@ function DeployButton({
|
|
28 |
className={classNames(
|
29 |
"relative cursor-pointer flex-none flex items-center justify-center rounded-md text-xs lg:text-sm font-semibold leading-5 lg:leading-6 py-2 px-6 hover:bg-pink-400 text-white bg-pink-500 shadow-sm dark:shadow-highlight/20 transition-all duration-100",
|
30 |
{
|
31 |
-
"opacity-50 cursor-not-allowed": loading
|
32 |
}
|
33 |
)}
|
34 |
onClick={handleDownload}
|
35 |
-
disabled={loading
|
36 |
>
|
37 |
{loading ? "Preparing..." : "Download HTML"}
|
38 |
</button>
|
39 |
</div>
|
40 |
);
|
41 |
}
|
|
|
|
|
|
1 |
+
import { useState } from "react";
|
2 |
+
import classNames from "classnames";
|
3 |
+
|
4 |
+
const downloadFile = (filename: string, content: string) => {
|
5 |
+
const blob = new Blob([content], { type: "text/html" });
|
6 |
+
const url = URL.createObjectURL(blob);
|
7 |
+
const a = document.createElement("a");
|
8 |
+
a.href = url;
|
9 |
+
a.download = filename;
|
10 |
+
a.click();
|
11 |
+
URL.revokeObjectURL(url);
|
12 |
+
};
|
13 |
+
|
14 |
+
function DeployButton({ html }: { html: string }) {
|
15 |
const [loading, setLoading] = useState(false);
|
16 |
|
17 |
const handleDownload = () => {
|
|
|
18 |
setLoading(true);
|
19 |
setTimeout(() => {
|
20 |
+
downloadFile("index.html", html);
|
|
|
|
|
|
|
|
|
|
|
|
|
21 |
setLoading(false);
|
22 |
}, 300);
|
23 |
};
|
|
|
28 |
className={classNames(
|
29 |
"relative cursor-pointer flex-none flex items-center justify-center rounded-md text-xs lg:text-sm font-semibold leading-5 lg:leading-6 py-2 px-6 hover:bg-pink-400 text-white bg-pink-500 shadow-sm dark:shadow-highlight/20 transition-all duration-100",
|
30 |
{
|
31 |
+
"opacity-50 cursor-not-allowed": loading,
|
32 |
}
|
33 |
)}
|
34 |
onClick={handleDownload}
|
35 |
+
disabled={loading}
|
36 |
>
|
37 |
{loading ? "Preparing..." : "Download HTML"}
|
38 |
</button>
|
39 |
</div>
|
40 |
);
|
41 |
}
|
42 |
+
|
43 |
+
export default DeployButton;
|