Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 12b432f

Browse files
[fix]: Fixed app breaking issue and failure to start
1 parent 96b3087 commit 12b432f

File tree

15 files changed

+688
-353
lines changed

15 files changed

+688
-353
lines changed

‎README.md‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66

77
Upload. Optimize. Share
88

9-
109
[Documentation](https://post-io.gitbook.io/stashblob-docs) [Changelog](https://stashblobweb.vercel.app/changelog)
1110

1211
</div>
@@ -31,9 +30,8 @@ For every files you upload, we have the power to share them with your friends an
3130

3231
You feel eager to contribute on this? Seek our [Contributing Guidelines](/CONTRIBUTING.md) for more details.
3332

34-
3533
## Reference
3634

3735
- [Code of Conduct](/CODE_OF_CONDUCT.md)
3836
- [Contributing Guidelines](/CONTRIBUTING.md)
39-
- [MIT License](/LICENSE)
37+
- [MIT License](/LICENSE)

‎components/app/Header.tsx‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
import Link from "next/link";
2+
import Image from "next/image";
3+
import { Input } from "@/components/ui/input";
4+
import { Label } from "@/components/ui/label";
5+
import { Button } from "@/components/ui/button";
6+
import { UploadCloud } from "lucide-react";
7+
import { UserButton } from "@clerk/nextjs";
8+
import { ChangeEvent, Dispatch, SetStateAction } from "react";
9+
import { typeUpldState } from "@/types/appx";
10+
11+
type HeaderProp = {
12+
uploadFile: (event: ChangeEvent<HTMLInputElement>) => Promise<void>;
13+
setOpen: Dispatch<SetStateAction<boolean>>
14+
open: boolean
15+
uploadState: typeUpldState
16+
}
17+
18+
export default function Header({ uploadFile, setOpen, open, uploadState }:HeaderProp) {
19+
return (
20+
<header className="fixed top-0 w-full z-10 md:p-3 md:px-10 lg:p-3 lg:px-10 p-4 bg-darkestbg/70 backdrop-blur-md border border-transparent border-b-borderbtm flex items-center justify-between">
21+
<div className="">
22+
<Link href="/dashboard">
23+
<Image
24+
src="/assets/TransparentBlob White.png"
25+
width={150}
26+
height={42}
27+
placeholder="blur"
28+
className="md:w-[150px] lg:w-[150px] w-[120px]"
29+
blurDataURL="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8Xw8AAoMBgDTD2qgAAAAASUVORK5CYII="
30+
alt="forget logo"
31+
/>
32+
</Link>
33+
</div>
34+
<nav className="flex items-center md:gap-4 lg:gap-4 gap-1">
35+
{/* account */}
36+
<Input
37+
id="upload-file"
38+
name="mega"
39+
type="file"
40+
accept="image/png, image/jpg, image/jpeg, image/avif, video/mp4"
41+
className="hidden"
42+
onChange={uploadFile}
43+
/>
44+
<Label
45+
htmlFor="upload-file"
46+
className={`${
47+
uploadState.isUploading
48+
? "bg-royalblue/30 p-2 px-4 pointer-events-none border border-blueborder rounded text-white flex items-center gap-1"
49+
: "md:bg-royalblue lg:bg-royalblue bg-transparent md:transition-colors lg:transition-colors md:hover:bg-royalblue/60 lg:hover:bg-royalblue/60 p-2 px-4 cursor-pointer border md:border-blueborder/20 lg:border-blueborder/20 border-transparent rounded text-white flex items-center gap-1"
50+
}`}
51+
>
52+
<UploadCloud className="md:w-auto md:h-auto lg:w-auto lg:h-auto w-6 h-6" />{" "}
53+
<span className="md:block lg:block hidden">
54+
{uploadState.isUploading
55+
? uploadState.props.uploading
56+
: uploadState.props.upload}
57+
</span>
58+
</Label>
59+
<Button
60+
className="bg-white hover:bg-midwhite text-darkestbg rounded md:flex lg:flex hidden items-center gap-1"
61+
onClick={() => setOpen(!open)}
62+
>
63+
Menu
64+
</Button>
65+
<UserButton />
66+
</nav>
67+
</header>
68+
);
69+
}

‎components/app/modalUI.tsx‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
import axios from "axios";
2+
import { useUser } from "@clerk/nextjs";
3+
import { Input } from "@/components/ui/input";
4+
import { Button } from "@/components/ui/button";
5+
import { Copy, X } from "lucide-react";
6+
import { extension } from "@/types/appx";
7+
import { Dispatch, SetStateAction } from "react";
8+
import { useToast } from "@/components/ui/use-toast";
9+
10+
type ModalProp = {
11+
show: boolean;
12+
setShow: Dispatch<SetStateAction<boolean>>;
13+
extension: extension;
14+
};
15+
16+
export default function ModalUI({ show, setShow, extension }:ModalProp) {
17+
const { isLoaded, isSignedIn, user } = useUser();
18+
const { toast } = useToast();
19+
const getShareLink = async () => {
20+
if (!isSignedIn) {
21+
return;
22+
} else {
23+
const id = user.id;
24+
const filename = extension.filename;
25+
const uploadID = extension.uploadID;
26+
toast({
27+
description: "Please wait...",
28+
});
29+
axios
30+
.get(`http://localhost:8080/share/${filename}/${uploadID}/${id}`, {
31+
headers: {
32+
"Content-Type": "application/json",
33+
apikey: process.env.NEXT_PUBLIC_API_KEY,
34+
},
35+
})
36+
.then(async function (response) {
37+
// console.log(response.data);
38+
const url: string = response.data.message;
39+
await copyTextToClipboard(url)
40+
.then(async function (data) {
41+
console.log(data);
42+
toast({
43+
title: "Success",
44+
description: data,
45+
});
46+
})
47+
.catch(async function (error) {
48+
console.error(error);
49+
toast({
50+
variant: "destructive",
51+
title: "Error",
52+
description: error.message,
53+
});
54+
});
55+
})
56+
.catch(async function (error) {
57+
console.error(error.response);
58+
});
59+
}
60+
};
61+
62+
async function copyTextToClipboard(url: string) {
63+
try {
64+
await navigator.clipboard.writeText(url);
65+
setShow(false);
66+
return "Copied share link";
67+
} catch (error) {
68+
console.error(error);
69+
setShow(false);
70+
throw new Error("failed to copy");
71+
}
72+
}
73+
74+
return (
75+
<div
76+
className={
77+
show
78+
? "fixed w-full h-full bg-darkmxbtn/50 backdrop-blur-md top-0 right-0 flex items-center justify-center min-h-screen transition-all opacity-1 pointer-events-auto"
79+
: "fixed w-full h-full bg-darkmxbtn/50 backdrop-blur-md top-0 right-0 flex items-center justify-center min-h-screen transition-all opacity-0 pointer-events-none"
80+
}
81+
>
82+
<div
83+
className={
84+
show
85+
? "w-full max-w-md rounded-lg p-4 bg-[#101013] flex flex-col gap-5 transition-all scale-1 shadow-xl"
86+
: "w-full max-w-md rounded-lg p-4 bg-[#101013] flex flex-col gap-5 transition-all scale-0"
87+
}
88+
>
89+
<header className="flex items-center justify-between">
90+
<h4 className="text-white text-2xl">Share</h4>
91+
<X
92+
className="text-midwhite2 cursor-pointer"
93+
onClick={() => setShow(false)}
94+
/>
95+
</header>
96+
<section className="flex flex-col gap-2">
97+
<span className="text-hashtext">Invite</span>
98+
<div className="flex items-center gap-3">
99+
<Input
100+
type="email"
101+
placeholder="Type emails here..."
102+
className="border border-darkbtn/30 bg-thirdprop focus:bg-darkmxbtn text-hashtext"
103+
disabled
104+
/>
105+
<Button
106+
className="bg-royalblue hover:bg-royalglue px-7 text-white"
107+
disabled
108+
>
109+
Share
110+
</Button>
111+
</div>
112+
</section>
113+
<section className="mt-8 flex flex-col gap-2">
114+
<span className="text-hashtext">Get Link</span>
115+
<div className="">
116+
<Button
117+
variant="link"
118+
className="flex items-center gap-2 text-fileicon"
119+
onClick={getShareLink}
120+
>
121+
<Copy className="w-6 h-6" /> Copy link
122+
</Button>
123+
</div>
124+
</section>
125+
</div>
126+
</div>
127+
);
128+
}

‎components/studio/Files.tsx‎

Lines changed: 57 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ import { MoreHorizontal, Forward, Trash2 } from "lucide-react";
2424
import { useUser } from "@clerk/nextjs";
2525
import { useToast } from "../ui/use-toast";
2626
import { Dispatch, SetStateAction } from "react";
27+
import { extension } from "@/types/appx";
2728

2829
type typeFile = {
2930
date: string;
@@ -37,15 +38,19 @@ type typeFile = {
3738
type FileProp = {
3839
files: never[];
3940
dataLoading: boolean;
41+
isErr: boolean;
4042
fetchFiles(): Promise<void>;
4143
setShow: Dispatch<SetStateAction<boolean>>;
44+
setExtension: Dispatch<SetStateAction<extension>>;
4245
};
4346

4447
export default function Files({
4548
files,
4649
dataLoading,
50+
isErr,
4751
fetchFiles,
4852
setShow,
53+
setExtension,
4954
}: FileProp) {
5055
const { toast } = useToast();
5156
const { isSignedIn, user } = useUser();
@@ -54,6 +59,10 @@ export default function Files({
5459
const deleteFile = async (filename: string, uploadID: string) => {
5560
if (isSignedIn) {
5661
const id = user.id;
62+
const username = user.username;
63+
toast({
64+
description: "Please wait...",
65+
});
5766
axios
5867
.delete(`http://localhost:8080/delete/${filename}/${uploadID}`, {
5968
headers: {
@@ -68,7 +77,7 @@ export default function Files({
6877
title: "Success",
6978
description: response.data.message,
7079
});
71-
await fetchFiles();
80+
await resetBilling(id,username);
7281
})
7382
.catch(async function (error) {
7483
console.error(error.response);
@@ -81,6 +90,41 @@ export default function Files({
8190
}
8291
};
8392

93+
async function resetBilling(userid: string, username: string | null) {
94+
axios
95+
.post(
96+
"http://localhost:8080/reset/billing",
97+
{
98+
userid: userid,
99+
username: username,
100+
},
101+
{
102+
headers: {
103+
"Content-Type": "application/json",
104+
apikey: process.env.NEXT_PUBLIC_API_KEY,
105+
},
106+
}
107+
)
108+
.then(async function (response) {
109+
console.log(response.data);
110+
await fetchFiles();
111+
})
112+
.catch(async function (error) {
113+
console.error(error);
114+
});
115+
}
116+
117+
const OpenModal = async (filename: string, uploadID: string) => {
118+
setShow(true);
119+
setExtension((prev) => {
120+
return {
121+
...prev,
122+
filename: filename,
123+
uploadID: uploadID,
124+
};
125+
});
126+
};
127+
84128
return (
85129
<section className="flex flex-col gap-8 mt-8">
86130
<article>
@@ -92,9 +136,11 @@ export default function Files({
92136
<Loader />
93137
) : (
94138
<Table>
95-
<TableCaption className="text-lightgrey/70">
96-
A list of your uploaded files.
97-
</TableCaption>
139+
{files.length !== 0 && isErr && (
140+
<TableCaption className="text-lightgrey/70">
141+
A list of your uploaded files.
142+
</TableCaption>
143+
)}
98144
<TableHeader>
99145
<TableRow className="border border-transparent border-b-borderbtm/80 bg-[#282c34]/50 hover:bg-[#282c34]/50">
100146
<TableHead className="text-white">Name</TableHead>
@@ -115,15 +161,15 @@ export default function Files({
115161
<TableCell
116162
className="text-midwhite2"
117163
onClick={() =>
118-
router.push(`/file/${item.filename}/${item.uploadID}`)
164+
router.push(`/file/${item.uploadID}`)
119165
}
120166
>
121167
{item.filename.substring(0, 10) + "..."}
122168
</TableCell>
123169
<TableCell
124170
className="text-midwhite2"
125171
onClick={() =>
126-
router.push(`/file/${item.filename}/${item.uploadID}`)
172+
router.push(`/file/${item.uploadID}`)
127173
}
128174
>
129175
{item.filetype}
@@ -132,15 +178,15 @@ export default function Files({
132178
<TableCell
133179
className="text-midwhite2"
134180
onClick={() =>
135-
router.push(`/file/${item.filename}/${item.uploadID}`)
181+
router.push(`/file/${item.uploadID}`)
136182
}
137183
>
138184
{item.filesize}
139185
</TableCell>
140186
<TableCell
141187
className="text-midwhite2"
142188
onClick={() =>
143-
router.push(`/file/${item.filename}/${item.uploadID}`)
189+
router.push(`/file/${item.uploadID}`)
144190
}
145191
>
146192
{item.date}
@@ -157,7 +203,9 @@ export default function Files({
157203
<nav className="flex flex-col gap-2">
158204
<DropdownMenuItem
159205
className="p-3 bg-transparent transition-colors hover:bg-hovergrey cursor-pointer select-none rounded-md text-midwhite border-none outline-none flex items-center justify-between gap-2"
160-
onClick={() => setShow(true)}
206+
onClick={() =>
207+
OpenModal(item.filename, item.uploadID)
208+
}
161209
>
162210
Share{" "}
163211
{/* <ArrowDownToLine className="w-4 h-4" /> */}

‎components/studio/uploadSection.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,12 +21,12 @@ export default function UploadSection({ uploadFile }:upxType) {
2121
id="upload-file"
2222
name="mega"
2323
type="file"
24-
accept="image/png, image/jpg, image/jpeg, image/avif"
24+
accept="image/png, image/jpg, image/jpeg, image/avif, video/mp4"
2525
className="hidden"
2626
onChange={uploadFile}
2727
/>
2828
<Label htmlFor="upload-file">
29-
<div className="cursor-pointer flex flex-col gap-4 items-center justify-center text-center border-2 border-dashed border-containerBG p-4 rounded-lg mt-4">
29+
<div className="cursor-pointer flex flex-col gap-4 items-center justify-center text-center border-2 border-dashed border-containerBG p-4 transition-all rounded-lg hover:rounded mt-4">
3030
<div className="w-12 h-12 flex items-center justify-center rounded-full bg-fileicon">
3131
<FileUp className="w-9 h-9 text-darkerblue" />
3232
</div>
@@ -36,7 +36,7 @@ export default function UploadSection({ uploadFile }:upxType) {
3636
<span className="text-gradedtext">Browse</span> File
3737
</p>
3838
<span className="md:text-sm lg:text-sm text-xs text-hashtext">
39-
Max: 20MB, Supports: PNG, JPEG, JPG, AVIF
39+
Max: 20MB, Supports: PNG, JPEG, JPG, AVIF, MP4
4040
</span>
4141
</article>
4242
</div>

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /