Skip to content

Commit

Permalink
ps: fixed some bugs & added features
Browse files Browse the repository at this point in the history
  • Loading branch information
SkidGod4444 committed Aug 4, 2024
1 parent 20ba4e7 commit 31f5735
Show file tree
Hide file tree
Showing 15 changed files with 206 additions and 77 deletions.
9 changes: 4 additions & 5 deletions app/(pages)/(routes)/browse/page.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,13 @@
import SearchElement from '@/components/global/browse/search.element'
import React from 'react'
import CardsElement from '@/components/global/browse/cards.element'
import { CardItems } from '@/db/constants'

export default function Browse() {
return (
<main className="relative bg-muted/40 flex justify-center items-center flex-col overflow-hidden mx-auto sm:px-8 px-4">
<div className='px-5'>
<CardsElement item={CardItems} />
<main className="relative min-h-screen bg-muted/40 flex justify-center items-center flex-col overflow-hidden mx-auto sm:px-8 px-4">
<div className="px-5">
<CardsElement item={CardItems} />
</div>
</main>
)
}
}
2 changes: 1 addition & 1 deletion app/(pages)/(routes)/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import React from 'react'

export default function UploadPage() {
return (
<div className="h-full bg-muted/40 flex flex-col items-center justify-center space-y-4">
<div className="h-screen bg-muted/40 flex flex-col items-center justify-center space-y-4">
<div className='flex w-full md:w-2/3 px-10 mx-4'>
<UploadElement />
</div>
Expand Down
2 changes: 1 addition & 1 deletion components/global/auth/settings.btn.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ export default function SettingsBtn() {
<div className="flex flex-row gap-2 mt-10">
<div className="flex flex-row items-center py-4 gap-2 bg-secondary rounded-md h-[40px] w-[140px] px-2">
<span className="text-sm font-bold text-primary">NSFW:</span>
<Button variant="default" size="sm" onClick={handleIsNsfw}>
<Button variant={isNsfw ? "default" : "outline"} size="sm" onClick={handleIsNsfw}>
{isNsfw ? "Enabled" : "Disabled"}
</Button>
</div>
Expand Down
1 change: 0 additions & 1 deletion components/global/browse/filter.element.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ export default function FilterElement() {
<SelectGroup>
<SelectLabel>Choose any one</SelectLabel>
<Separator className="mb-2"/>
<SelectItem value="user">USER</SelectItem>
<SelectItem value="title">TITLE</SelectItem>
<SelectItem value="desc">DESCRIPTION</SelectItem>
<SelectItem value="cloud-id">CLOUDBOX ID</SelectItem>
Expand Down
4 changes: 3 additions & 1 deletion components/global/browse/search.element.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,18 @@ import { Search } from "lucide-react";
export default function SearchElement() {
return (
<div className="flex flex-col items-center justify-center w-full">
<Label className="flex flex-row w-full rounded-md gap-2 items-center">
<Label className="flex md:flex-row p-2 bg-black flex-col w-full rounded-xl gap-2 items-center">
<div className="relative w-full">
<Input
placeholder="Browse public files & folders..."
className="pl-10"
/>
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground h-5 w-5" />
</div>
<div className="flex flex-row gap-2">
<FilterByElement />
<FilterElement />
</div>
</Label>
</div>
);
Expand Down
35 changes: 1 addition & 34 deletions components/global/navbar/navbar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,49 +3,16 @@ import React, { useState, useEffect } from "react";
import { cn } from "@/lib/utils";
import AuthBtn from "../auth/auth.btn";
import { Logo } from "../logo";
import SourceBtn from "./source.btn";
import CommunityBtn from "./community.btn";
import SettingsBtn from "../auth/settings.btn";
import { useUser } from "@/context/user.context";
import RulesBtn from "./rules.btn";
import SourceBtn from "./source.btn";
// import { PushUser } from '@/db/functions';

export default function HomeNavbar() {
const [cloudKeyExists, setCloudKeyExists] = useState(false);
const { current } = useUser();

useEffect(() => {
// Check local storage for the presence of 'CloudKey' when the component mounts
if (typeof window !== "undefined") {
const cloudKey = localStorage.getItem("CloudKey");
if (cloudKey) {
setCloudKeyExists(true);
// PushUser(cloudKey.toString());
} else {
setCloudKeyExists(false);
}
}

// Add event listener for changes to local storage
const handleStorageChange = () => {
if (typeof window !== "undefined") {
const updatedCloudKey = localStorage.getItem("CloudKey");
if (updatedCloudKey) {
setCloudKeyExists(true);
} else {
setCloudKeyExists(false);
}
}
};

window.addEventListener("storage", handleStorageChange);

// Clean up the event listener when the component unmounts
return () => {
window.removeEventListener("storage", handleStorageChange);
};
}, []);

return (
<div
className={cn(
Expand Down
14 changes: 7 additions & 7 deletions components/global/navbar/rules.btn.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export default function RulesBtn() {
<DialogTitle className="flex flex-row gap-2 text-primary">
<ShieldCheck className="h-5 w-5" /> TERMS OF SERVICE
</DialogTitle>
<DialogDescription>
<DialogDescription className="text-start">
No matter what you have to follow our{" "}
<strong className="text-primary">(TOS)</strong> inorder to use our
services. By accessing or using cloud-box services you agree to be
Expand All @@ -34,7 +34,7 @@ export default function RulesBtn() {
before using cloud-box services.
</DialogDescription>
<ScrollArea className="flex border-primary border rounded-md h-[120px] top-2 bg-transparent">
<p className="text-white text-sm p-2 mb-1">
<p className="text-white text-start text-sm p-2 mb-1">
<strong className="text-primary">WHAT IS THIS?:</strong> Cloud-box
is a cloud storage service built on top of Telegram. By using our
service, you agree to{" "}
Expand All @@ -44,26 +44,26 @@ export default function RulesBtn() {
& the following written bellow.
</p>

<p className="text-white text-sm px-4 mb-1">
<p className="text-white text-start text-sm px-4 mb-1">
<strong className="text-primary">USAGE-RESTRICTIONS:</strong> You
are not responsible for your use of cloud-box and any content you
upload, share, or store to telegram using our service. But we can
track you and terminate your cloud-box account.
</p>

<p className="text-white text-sm px-4 mb-1">
<p className="text-white text-start text-sm px-4 mb-1">
<strong className="text-primary">CONTENT-RESTRICTIONS:</strong>{" "}
You are free to upload anything (literally anything) you want.
Every data is stored as it is in telegram privately.
</p>

<p className="text-white text-sm px-4 mb-1">
<p className="text-white text-start text-sm px-4 mb-1">
<strong className="text-primary">PUBLISHING-NSFW:</strong>{" "}
Publicly shared files and folders containing 18+ content must be
appropriately censored and enabled NSFW while uploading.
</p>

<p className="text-white text-sm px-4 mb-1">
<p className="text-white text-start text-sm px-4 mb-1">
<strong className="text-primary">LIMITATIONS:</strong> We do not
have any type of limitations upload as much as you can but as per
telegram we do have max file size limitation of 2GB/2000MB.
Expand All @@ -72,7 +72,7 @@ export default function RulesBtn() {
<span className="flex flex-row gap-2 text-primary text-lg font-semibold leading-none tracking-tight pt-4">
<ShieldAlert className="h-5 w-5" /> VIOLATING OUR TOS
</span>
<DialogDescription>
<DialogDescription className="text-start">
We will delete your shared files/folders or may be your whole
account at any time, without notice, for conduct that we believe
violates these <strong className="text-primary">(TOS)</strong> or is
Expand Down
47 changes: 43 additions & 4 deletions components/global/navbar/source.btn.tsx
Original file line number Diff line number Diff line change
@@ -1,21 +1,60 @@
import { Button } from "@/components/ui/button";
import { Github } from "lucide-react";
import NumberTicker from "@/components/ui/number-ticker";
import { Github, Star } from "lucide-react";
import Link from "next/link";
import React from "react";
import React, { useEffect, useState } from "react";
import { useMediaQuery } from "react-responsive";

const fetchStars = async () => {
try {
const response = await fetch(
"https://api.github.com/repos/SkidGod4444/CLOUDBOX",
{
next: {
revalidate: 3600,
},
}
);
if (response.ok) {
const data = await response.json();
return data.stargazers_count || 30; // Default value
} else {
return 30; // Default value
}
} catch (error) {
console.error("Error fetching GitHub stars:", error);
return 30; // Default value
}
};

export default function SourceBtn() {
const isSmallScreen = useMediaQuery({ query: "(max-width: 768px)" });
const [stars, setStars] = useState(30); // Default value

useEffect(() => {
const getStars = async () => {
const stars = await fetchStars();
setStars(stars);
};
getStars();
}, []);

return (
<Link href="https://github.com/SkidGod4444/CLOUDBOX">
<Link href="https://github.com/SkidGod4444/CLOUDBOX" className="group">
<Button variant="outline" size={isSmallScreen ? "icon" : "default"}>
<Github
className={
isSmallScreen ? "h-5 w-5 text-primary" : "h-5 w-5 mr-2 text-primary"
}
/>
<span className="hidden md:inline">Open Source</span>
<span className="hidden md:inline">Star on GitHub</span>{" "}
<div className="hidden ml-2 items-center gap-1 text-sm md:flex">
<Star className="size-4 text-primary transition-all duration-300 group-hover:text-yellow-300" />
<NumberTicker
value={stars}
className="font-display font-medium text-white"
/>
</div>
</Button>
</Link>
);
Expand Down
2 changes: 1 addition & 1 deletion components/global/sidebar/sidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export default function SideNavbar({}: Props) {
}

return (
<div className={cn("z-[20] relative min-w-[80px] border-r-2 border-muted-forground px-2 py-20 bg-muted/60 backdrop-filter backdrop-blur-lg",
<div className={cn("z-[20] relative min-w-[80px] h-full border-r-2 border-muted-forground px-2 py-20 bg-muted/60 backdrop-filter backdrop-blur-lg",
mobileWidth && "hidden")}>
{!mobileWidth && (
<div className="absolute right-[-25px] top-13">
Expand Down
76 changes: 59 additions & 17 deletions components/ui/card-hover-effect.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,8 @@ import {
import { Skeleton } from "./skeleton";
import { useUser } from "@/context/user.context";
import { useToast } from "./use-toast";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";

export const CardHoverEffect = ({
items,
Expand Down Expand Up @@ -130,20 +132,6 @@ export const CardHoverEffect = ({
<CardDescription>{item.description}</CardDescription>
)}
<div className="flex flex-row justify-between items-center mt-2">
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button size="sm" variant="ghost">
<Eye className="h-4 w-4 mr-2" />
120
</Button>
</TooltipTrigger>
<TooltipContent className="bg-white">
<p className="text-black">120 Views</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>

<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
Expand All @@ -157,6 +145,55 @@ export const CardHoverEffect = ({
</TooltipContent>
</Tooltip>
</TooltipProvider>

<Dialog>
<DialogTrigger>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
{current ? (
<Button size="sm" variant="outline">
Send to me
</Button>
) : (
<Button disabled size="sm" variant="outline">
Sign In to access
</Button>
)}
</TooltipTrigger>
<TooltipContent className="bg-white">
<p className="text-black">Send to yourself/others</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</DialogTrigger>
<DialogContent>
<DialogHeader>
<DialogTitle>Share with others</DialogTitle>
<DialogDescription>
Enter the user cloud-key to share this file/folder. This
action cannot be undone.
</DialogDescription>
</DialogHeader>
<div className="flex items-center space-x-2">
<div className="grid flex-1 gap-2">
<Label htmlFor="link" className="sr-only">
Link
</Label>
<Input id="link" placeholder="Enter the user's key" />
</div>
<Button type="submit" size="sm" className="px-3">
<span>Send</span>
</Button>
</div>
<div className="flex flex-col gap-4 justify-center items-center">
<span className="text-sm text-muted-foreground font-bold">OR</span>
</div>
<Button type="submit" size="sm" className="px-3">
<span>Send to me</span>
</Button>
</DialogContent>
</Dialog>
</div>
</Card>
</div>
Expand All @@ -175,7 +212,7 @@ export const Card = ({
return (
<div
className={cn(
"rounded-xl cursor-pointer h-full w-full p-4 overflow-hidden bg-muted border-2 border-transparent group-hover:bg-black group-hover:border-primary relative z-20 flex flex-col",
"rounded-xl cursor-pointer h-[300px] w-full p-4 overflow-hidden bg-muted border-2 border-transparent group-hover:bg-black group-hover:border-primary relative z-20 flex flex-col",
className
)}
>
Expand All @@ -192,7 +229,12 @@ export const CardTitle = ({
children: React.ReactNode;
}) => {
return (
<h4 className={cn("text-zinc-100 font-bold tracking-wide mt-8", className)}>
<h4
className={cn(
"text-zinc-100 font-bold tracking-wide mt-8 text-start",
className
)}
>
{children}
</h4>
);
Expand All @@ -208,7 +250,7 @@ export const CardDescription = ({
return (
<p
className={cn(
"text-zinc-400 tracking-wide leading-relaxed text-sm mt-5",
"text-zinc-400 tracking-wide leading-relaxed text-sm mt-5 text-start",
className
)}
>
Expand Down
Loading

0 comments on commit 31f5735

Please sign in to comment.