Skip to content

Commit

Permalink
add feature to search with Ctrl + k (#1205)
Browse files Browse the repository at this point in the history
* added ctrl k in search

* fix build issue

* added shadcn commandK

* Update src/components/search/SearchBar.tsx

* Update src/components/search/SearchBar.tsx

* add cmd K for macOs

---------

Co-authored-by: Sargam <[email protected]>
  • Loading branch information
AuenKr and devsargam authored Oct 4, 2024
1 parent fd2f5b2 commit 2ea0802
Show file tree
Hide file tree
Showing 32 changed files with 621 additions and 398 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
/.pnp
.pnp.js
.yarn/install-state.gz
bun.lockb

# docker volume
/postgres-data/
Expand Down
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
"@prisma/client": "^5.18.0",
"@radix-ui/react-accordion": "^1.1.2",
"@radix-ui/react-avatar": "^1.0.4",
"@radix-ui/react-dialog": "^1.0.5",
"@radix-ui/react-dialog": "^1.1.1",
"@radix-ui/react-dropdown-menu": "^2.0.6",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-navigation-menu": "^1.1.4",
Expand All @@ -62,6 +62,7 @@
"bcrypt": "^5.1.1",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
"cmdk": "1.0.0",
"date-fns": "^3.6.0",
"dayjs": "^1.11.10",
"discord-oauth2": "^2.11.0",
Expand Down
2 changes: 1 addition & 1 deletion pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 4 additions & 2 deletions src/app/(main)/(pages)/home/page.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { Greeting } from '@/components/Greeting';
import { MyCourses } from '@/components/MyCourses';
import { Redirect } from '@/components/Redirect';
import SearchBar from '@/components/search/SearchBar';
import { SearchBar } from '@/components/search/SearchBar';
import { getServerSession } from 'next-auth';

export default async function MyCoursesPage() {
Expand All @@ -17,7 +17,9 @@ export default async function MyCoursesPage() {
<h1 className="text-wrap text-3xl font-extrabold capitalize tracking-tighter md:text-4xl">
<Greeting /> {session.user.name}
</h1>
<SearchBar />
<div>
<SearchBar />
</div>
</div>

<div className="flex h-full flex-col gap-4 rounded-2xl py-4">
Expand Down
124 changes: 79 additions & 45 deletions src/app/admin/add-course/page.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,7 @@
'use client';

import { Button } from '@/components/ui/button';
import {
Card,
CardContent,
CardHeader,
CardTitle,
} from '@/components/ui/card';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import {
Form,
FormControl,
Expand All @@ -29,7 +24,7 @@ import {
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/accordion";
} from '@/components/ui/accordion';
import { Cuboid, PackagePlus } from 'lucide-react';
import { FaDiscord } from 'react-icons/fa';

Expand Down Expand Up @@ -86,24 +81,32 @@ export default function Courses() {

return (
<div className="wrapper my-16 flex flex-col gap-4">

<section className='flex gap-2 border-2 p-4 bg-primary/5 rounded-lg my-4 items-center'>
<section className="my-4 flex items-center gap-2 rounded-lg border-2 bg-primary/5 p-4">
<Cuboid size={18} />
<h2 className='text-md font-bold'>View Content</h2>
<h2 className="text-md font-bold">View Content</h2>
</section>

<Accordion defaultValue='add-new-course' className='border-2 p-4 rounded-2xl' type="single" collapsible>
<Accordion
defaultValue="add-new-course"
className="rounded-2xl border-2 p-4"
type="single"
collapsible
>
<AccordionItem value="add-new-course">
<AccordionTrigger className='p-6 text-2xl font-bold'>
<div className='flex gap-4 flex-col' >
<PackagePlus size={40} />New course
<AccordionTrigger className="p-6 text-2xl font-bold">
<div className="flex flex-col gap-4">
<PackagePlus size={40} />
New course
</div>
</AccordionTrigger>
<AccordionContent>
<div className='w-full grid grid-cols-1 lg:grid-cols-7'>
<div className='text-sm font-semibold text-gray-400 col-span-1 lg:col-span-2 p-6'>Create new course for 100xdevs community and let user explore new courses</div>
<div className='col-span-1 lg:col-span-5 p-4'>
<Card className='bg-background border-2'>
<div className="grid w-full grid-cols-1 lg:grid-cols-7">
<div className="col-span-1 p-6 text-sm font-semibold text-gray-400 lg:col-span-2">
Create new course for 100xdevs community and let user explore
new courses
</div>
<div className="col-span-1 p-4 lg:col-span-5">
<Card className="border-2 bg-background">
<CardHeader>
{/* <CardTitle>Create a new course</CardTitle> */}
<CardTitle>Fill in the course details below</CardTitle>
Expand All @@ -121,7 +124,11 @@ export default function Courses() {
<FormItem>
<FormLabel>Title</FormLabel>
<FormControl>
<Input className='h-12 px-3' placeholder="Enter the Course name" {...field} />
<Input
className="h-12 px-3"
placeholder="Enter the Course name"
{...field}
/>
</FormControl>
<FormMessage />
</FormItem>
Expand All @@ -134,7 +141,11 @@ export default function Courses() {
<FormItem>
<FormLabel>Image url</FormLabel>
<FormControl>
<Input className='h-12 px-3' placeholder="Enter the url of Image" {...field} />
<Input
className="h-12 px-3"
placeholder="Enter the url of Image"
{...field}
/>
</FormControl>
<FormMessage />
</FormItem>
Expand All @@ -144,11 +155,12 @@ export default function Courses() {
control={form.control}
name="description"
render={({ field }: { field: any }) => (
<FormItem className='col-span-1 lg:col-span-2'>
<FormItem className="col-span-1 lg:col-span-2">
<FormLabel>Description</FormLabel>
<FormControl>
<Textarea
className='h-12 px-3' placeholder="Enter the Description of course"
className="h-12 px-3"
placeholder="Enter the Description of course"
{...field}
/>
</FormControl>
Expand All @@ -163,7 +175,11 @@ export default function Courses() {
<FormItem>
<FormLabel>Slug</FormLabel>
<FormControl>
<Input className='h-12 px-3' placeholder="Enter the Course slug" {...field} />
<Input
className="h-12 px-3"
placeholder="Enter the Course slug"
{...field}
/>
</FormControl>
<FormMessage />
</FormItem>
Expand All @@ -176,7 +192,11 @@ export default function Courses() {
<FormItem>
<FormLabel>Id</FormLabel>
<FormControl>
<Input className='h-12 px-3' placeholder="Enter the Course ID" {...field} />
<Input
className="h-12 px-3"
placeholder="Enter the Course ID"
{...field}
/>
</FormControl>
<FormMessage />
</FormItem>
Expand All @@ -189,7 +209,11 @@ export default function Courses() {
<FormItem>
<FormLabel>Admin Secret</FormLabel>
<FormControl>
<Input className='h-12 px-3' placeholder="Enter the Admin Secret" {...field} />
<Input
className="h-12 px-3"
placeholder="Enter the Admin Secret"
{...field}
/>
</FormControl>
<FormMessage />
</FormItem>
Expand All @@ -203,7 +227,8 @@ export default function Courses() {
<FormLabel>app x course id</FormLabel>
<FormControl>
<Input
className='h-12 px-3' placeholder="Enter the appx course ID"
className="h-12 px-3"
placeholder="Enter the appx course ID"
{...field}
/>
</FormControl>
Expand Down Expand Up @@ -231,7 +256,9 @@ export default function Courses() {
{isLoading ? (
<Button>Loading...</Button>
) : (
<Button className='w-[20%]' type="submit">Create</Button>
<Button className="w-[20%]" type="submit">
Create
</Button>
)}
</div>
</form>
Expand All @@ -243,24 +270,28 @@ export default function Courses() {
</AccordionContent>
</AccordionItem>

<AccordionItem className='border-none' value="discord-config">
<AccordionTrigger className='p-6 text-2xl font-bold'>
<div className='flex gap-4 flex-col' >
<FaDiscord className='text-5xl' /> Discord Config
<AccordionItem className="border-none" value="discord-config">
<AccordionTrigger className="p-6 text-2xl font-bold">
<div className="flex flex-col gap-4">
<FaDiscord className="text-5xl" /> Discord Config
</div>
</AccordionTrigger>
<AccordionContent>
<div className='w-full grid grid-cols-1 lg:grid-cols-7'>
<div className='text-sm font-semibold text-gray-400col-span-1 lg:col-span-2 p-6'>Mangae discord configuration for the users</div>
<div className='col-span-1 lg:col-span-5 p-4'>
<Card className='bg-background'>
<div className="grid w-full grid-cols-1 lg:grid-cols-7">
<div className="text-gray-400col-span-1 p-6 text-sm font-semibold lg:col-span-2">
Mangae discord configuration for the users
</div>
<div className="col-span-1 p-4 lg:col-span-5">
<Card className="bg-background">
<CardHeader>
<CardTitle>Discord</CardTitle>
</CardHeader>
<CardContent className="flex flex-col gap-5 lg:flex-row">
<Card className="mx-auto border-2 bg-background w-full max-w-3xl overflow-y-auto">
<Card className="mx-auto w-full max-w-3xl overflow-y-auto border-2 bg-background">
<CardHeader>
<CardTitle>Allow user another account in cohort 3</CardTitle>
<CardTitle>
Allow user another account in cohort 3
</CardTitle>
</CardHeader>
<CardContent className="grid gap-4 p-4 pt-0">
<Input
Expand All @@ -280,10 +311,13 @@ export default function Courses() {
<Button
onClick={async () => {
try {
const res = await axios.post('/api/admin/discordReset', {
email,
adminPassword,
});
const res = await axios.post(
'/api/admin/discordReset',
{
email,
adminPassword,
},
);
toast(JSON.stringify(res.data.data));
} catch (error) {
//@ts-ignore
Expand All @@ -295,9 +329,11 @@ export default function Courses() {
</Button>
</CardContent>
</Card>
<Card className="mx-auto border-2 bg-background w-full max-w-3xl overflow-y-auto">
<Card className="mx-auto w-full max-w-3xl overflow-y-auto border-2 bg-background">
<CardHeader>
<CardTitle>Get users discord username in cohort 3</CardTitle>
<CardTitle>
Get users discord username in cohort 3
</CardTitle>
</CardHeader>
<CardContent className="grid gap-4 p-4 pt-0">
<Input
Expand Down Expand Up @@ -340,9 +376,7 @@ export default function Courses() {
</div>
</AccordionContent>
</AccordionItem>

</Accordion>

</div>
);
}
37 changes: 21 additions & 16 deletions src/app/admin/comment/ApproveComment.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import {
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/accordion";
} from '@/components/ui/accordion';
import { ShieldCheck } from 'lucide-react';

const ApproveComment = () => {
Expand Down Expand Up @@ -40,29 +40,37 @@ const ApproveComment = () => {
});
};
return (
<div className='w-full h-full'>
<Accordion defaultValue='approve-comment' className='border-2 p-4 rounded-2xl' type="single" collapsible>
<AccordionItem className='border-none' value="approve-comment">
<AccordionTrigger className='p-6 text-lg lg:text-2xl font-bold'>
<div className='flex gap-4 flex-col' >
<div className="h-full w-full">
<Accordion
defaultValue="approve-comment"
className="rounded-2xl border-2 p-4"
type="single"
collapsible
>
<AccordionItem className="border-none" value="approve-comment">
<AccordionTrigger className="p-6 text-lg font-bold lg:text-2xl">
<div className="flex flex-col gap-4">
<ShieldCheck size={40} /> Approve Comment
</div>
</AccordionTrigger>
<AccordionContent>
<form className='w-full h-full' onSubmit={handleApprove} ref={formRef}>
<div className="grid w-full grid-cols-1 lg:grid-cols-7 p-2 gap-2 rounded-lg border-gray-200 shadow-sm dark:border-gray-800">
<div className="col-span-1 lg:col-span-3 flex flex-col gap-2 p-4">
<form
className="h-full w-full"
onSubmit={handleApprove}
ref={formRef}
>
<div className="grid w-full grid-cols-1 gap-2 rounded-lg border-gray-200 p-2 shadow-sm dark:border-gray-800 lg:grid-cols-7">
<div className="col-span-1 flex flex-col gap-2 p-4 lg:col-span-3">
<div className="text-sm font-medium leading-none text-gray-500 dark:text-gray-400">
Enter the information below to approve the comment
</div>
</div>

<aside className='col-span-1 flex flex-col gap-6 p-4 lg:col-span-4 '>

<aside className="col-span-1 flex flex-col gap-6 p-4 lg:col-span-4">
<div className="flex items-center">
<Label className="sr-only">Comment ID</Label>
<Input
className="w-full h-14 px-2"
className="h-14 w-full px-2"
id="commentId"
name="commentId"
placeholder="Content ID; Comment ID"
Expand All @@ -75,7 +83,7 @@ const ApproveComment = () => {
<div className="flex items-center">
<Label className="sr-only">Admin password</Label>
<Input
className="w-full h-14 px-2"
className="h-14 w-full px-2"
id="adminPassword"
name="adminPassword"
placeholder="Admin password"
Expand All @@ -89,16 +97,13 @@ const ApproveComment = () => {
<div className="">
<Button className="w-full lg:w-[20%]">Approve</Button>
</div>

</aside>

</div>
</form>
</AccordionContent>
</AccordionItem>
</Accordion>
</div>

);
};

Expand Down
Loading

0 comments on commit 2ea0802

Please sign in to comment.