Removed unused modals & kept import conssistency with @
This commit is contained in:
parent
8f7f18e069
commit
0f7fb11f4e
@ -1,139 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import axios from "axios"
|
|
||||||
import { db } from "@/lib/db";
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
|
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
|
|
||||||
import * as z from "zod";
|
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
|
||||||
import { useForm } from "react-hook-form";
|
|
||||||
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
|
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
|
|
||||||
|
|
||||||
const formSchema = z.object({
|
|
||||||
id: z.string().trim().min(12, {
|
|
||||||
message: "Client ID should be at least 12 characters."
|
|
||||||
}),
|
|
||||||
secret: z.string().trim().min(12, {
|
|
||||||
message: "Client secret should be at least 12 characters."
|
|
||||||
})
|
|
||||||
});
|
|
||||||
|
|
||||||
export const ConnectTwitchModal = () => {
|
|
||||||
const [isMounted, setIsMounted] = useState(false);
|
|
||||||
const [twitchError, setTwitchError] = useState("")
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setIsMounted(true);
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const router = useRouter();
|
|
||||||
const form = useForm({
|
|
||||||
resolver: zodResolver(formSchema),
|
|
||||||
defaultValues: {
|
|
||||||
id: "",
|
|
||||||
secret: ""
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const isLoading = form.formState.isSubmitting;
|
|
||||||
|
|
||||||
if (!isMounted) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const onSubmit = async (values: z.infer<typeof formSchema>) => {
|
|
||||||
setTwitchError("");
|
|
||||||
|
|
||||||
try {
|
|
||||||
const response = await axios.post("/api/settings/connections/twitch", values);
|
|
||||||
console.log(response.data);
|
|
||||||
} catch (error) {
|
|
||||||
setTwitchError("Invalid client id and client secret combination.");
|
|
||||||
console.log("[CONNECTIONS/TWITCH/POST]", error);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
form.reset();
|
|
||||||
router.refresh();
|
|
||||||
window.location.reload();
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Dialog>
|
|
||||||
<DialogTrigger>
|
|
||||||
<Button>Connect Twitch</Button>
|
|
||||||
</DialogTrigger>
|
|
||||||
<DialogContent className="bg-white text-black p-0 overflow-hidden">
|
|
||||||
<DialogHeader className="pt-8 px-6">
|
|
||||||
<DialogTitle className="text-2xl text-center">Connect Your Twitch Account</DialogTitle>
|
|
||||||
<DialogDescription className="text-center">Provide permission to access your twitch account & read chat.</DialogDescription>
|
|
||||||
</DialogHeader>
|
|
||||||
<div className={cn("hidden", twitchError.length > 0 && "block px-5 py-2 bg-[#FF0000] text-center items-center justify-center")}>
|
|
||||||
{twitchError}
|
|
||||||
</div>
|
|
||||||
<Form {...form}>
|
|
||||||
<form onSubmit={form.handleSubmit(onSubmit)}
|
|
||||||
className="space-y-8">
|
|
||||||
<div className="space-y-8 px-6">
|
|
||||||
<FormField
|
|
||||||
control={form.control}
|
|
||||||
name="id"
|
|
||||||
render={({ field }) => (
|
|
||||||
<FormItem>
|
|
||||||
<FormLabel
|
|
||||||
className="uppercase text-xs font-bold">
|
|
||||||
Client ID
|
|
||||||
</FormLabel>
|
|
||||||
<FormControl>
|
|
||||||
<Input
|
|
||||||
disabled={isLoading}
|
|
||||||
className="bg-white text-black"
|
|
||||||
placeholder="Enter your client id"
|
|
||||||
{...field}
|
|
||||||
/>
|
|
||||||
</FormControl>
|
|
||||||
<FormMessage />
|
|
||||||
</FormItem>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-8 px-6">
|
|
||||||
<FormField
|
|
||||||
control={form.control}
|
|
||||||
name="secret"
|
|
||||||
render={({ field }) => (
|
|
||||||
<FormItem>
|
|
||||||
<FormLabel
|
|
||||||
className="uppercase text-xs font-bold">
|
|
||||||
Client secret
|
|
||||||
</FormLabel>
|
|
||||||
<FormControl>
|
|
||||||
<Input
|
|
||||||
disabled={isLoading}
|
|
||||||
className="bg-white text-black"
|
|
||||||
placeholder="Enter your client secret"
|
|
||||||
{...field}
|
|
||||||
/>
|
|
||||||
</FormControl>
|
|
||||||
<FormMessage />
|
|
||||||
</FormItem>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<DialogFooter className="bg-gray-100 px-6 py-4">
|
|
||||||
<Button disabled={isLoading}>Connect</Button>
|
|
||||||
</DialogFooter>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</Form>
|
|
||||||
</DialogContent>
|
|
||||||
</Dialog>
|
|
||||||
);
|
|
||||||
}
|
|
@ -1,109 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import axios from "axios"
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
|
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
|
|
||||||
import * as z from "zod";
|
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
|
||||||
import { useForm } from "react-hook-form";
|
|
||||||
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
|
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { Info } from "lucide-react";
|
|
||||||
import { Toggle } from "../ui/toggle";
|
|
||||||
import { TtsBadgeFilter, TwitchConnection } from "@prisma/client";
|
|
||||||
|
|
||||||
const formSchema = z.object({
|
|
||||||
whitelist: z.string().trim().array(),
|
|
||||||
blacklist: z.string().trim().array()
|
|
||||||
});
|
|
||||||
|
|
||||||
export const TTSBadgeFilterModal = () => {
|
|
||||||
const [isMounted, setIsMounted] = useState(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setIsMounted(true);
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const router = useRouter();
|
|
||||||
const form = useForm({
|
|
||||||
resolver: zodResolver(formSchema),
|
|
||||||
defaultValues: {
|
|
||||||
whitelist: z.string().trim().array(),
|
|
||||||
blacklist: z.string().trim().array()
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const isLoading = form.formState.isSubmitting;
|
|
||||||
|
|
||||||
const onSubmit = async (values: z.infer<typeof formSchema>) => {
|
|
||||||
let response = null;
|
|
||||||
|
|
||||||
// try {
|
|
||||||
// response = await axios.post("/api/settings/tts/filter/badges", values);
|
|
||||||
// } catch (error) {
|
|
||||||
// console.log("[CONNECTIONS/TWITCH/POST]", error);
|
|
||||||
// return;
|
|
||||||
// }
|
|
||||||
|
|
||||||
form.reset();
|
|
||||||
router.refresh();
|
|
||||||
window.location.reload();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isMounted) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const badges: TtsBadgeFilter[] = [] //(await axios.get("/api/settings/tts/filter/badges")).data
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Dialog>
|
|
||||||
<DialogTrigger>
|
|
||||||
<Button aria-label="Badge" variant="ttsmessagefilter" className="my-2">
|
|
||||||
<Info className="h-4 w-4 mx-1" />
|
|
||||||
Badge
|
|
||||||
</Button>
|
|
||||||
</DialogTrigger>
|
|
||||||
<DialogContent className="bg-white text-black p-0 overflow-hidden">
|
|
||||||
<DialogHeader className="pt-8 px-6">
|
|
||||||
<DialogTitle className="text-2xl text-center">TTS Badge Filter</DialogTitle>
|
|
||||||
<DialogDescription className="text-center">Limit messages spoken by TTS by badges.</DialogDescription>
|
|
||||||
</DialogHeader>
|
|
||||||
<Form {...form}>
|
|
||||||
<form onSubmit={form.handleSubmit(onSubmit)}
|
|
||||||
className="space-y-10">
|
|
||||||
{badges.map((badge) => (
|
|
||||||
<div className="space-y-8 px-6">
|
|
||||||
<FormField
|
|
||||||
key={badge.badgeId}
|
|
||||||
control={form.control}
|
|
||||||
name={badge.badgeId}
|
|
||||||
render={({ field }) => {
|
|
||||||
return (
|
|
||||||
<FormItem>
|
|
||||||
<Toggle
|
|
||||||
aria-label="Badge"
|
|
||||||
variant="simple"
|
|
||||||
disabled={isLoading}
|
|
||||||
className="my-2"
|
|
||||||
{...field}>
|
|
||||||
{badge.badgeId}
|
|
||||||
</Toggle>
|
|
||||||
</FormItem>
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
<DialogFooter className="bg-gray-100 px-6 py-4">
|
|
||||||
<Button disabled={isLoading}>Save</Button>
|
|
||||||
</DialogFooter>
|
|
||||||
</form>
|
|
||||||
</Form>
|
|
||||||
</DialogContent>
|
|
||||||
</Dialog>
|
|
||||||
);
|
|
||||||
}
|
|
@ -6,10 +6,10 @@ import { useEffect, useState } from "react";
|
|||||||
import { useSession } from "next-auth/react";
|
import { useSession } from "next-auth/react";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
|
import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
|
||||||
import { Button } from "../ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { Check, ChevronsUpDown } from "lucide-react";
|
import { Check, ChevronsUpDown } from "lucide-react";
|
||||||
import { User } from "@prisma/client";
|
import { User } from "@prisma/client";
|
||||||
import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem } from "../ui/command";
|
import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem } from "@/components/ui/command";
|
||||||
|
|
||||||
|
|
||||||
const AdminProfile = () => {
|
const AdminProfile = () => {
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { Button } from "../ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import UserProfile from "./userprofile";
|
import UserProfile from "./userprofile";
|
||||||
import AdminProfile from "./adminprofile";
|
import AdminProfile from "./adminprofile";
|
||||||
import RoleGate from "../auth/role-gate";
|
import RoleGate from "@/components/auth/role-gate";
|
||||||
|
|
||||||
const SettingsNavigation = async () => {
|
const SettingsNavigation = async () => {
|
||||||
return (
|
return (
|
||||||
|
Loading…
Reference in New Issue
Block a user