Upload 42 files

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

.gitignore

@@ -0,0 +1,38 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+.vercel

README.md

@@ -1,11 +1,37 @@
----
-title: Ts Api
-emoji: 📚
-colorFrom: green
-colorTo: red
-sdk: docker
-pinned: false
-license: mit
----
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.
+
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+"# ts-api" 

app/api/page.jsx

@@ -0,0 +1,44 @@
+"use client"
+
+import React from 'react'
+
+import PerChatCard from '../components/PerChatCard'
+
+import axios from 'axios'
+
+import data from '@/public/apiList.json'
+
+import Link from 'next/link'
+import ApiModal from '../components/ApiModal'
+
+
+const page =  () => {
+
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const [open, setOpen] = React.useState(false)
+
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const [api, setData] = React.useState({})
+
+
+  return (<>
+  {open &&        <ApiModal open={open} setOpen={setOpen} api={api}/>}
+    <div className="col" style={{display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', width: '100%'}}>
+        
+        <h1 className="gradient-text" style={{fontSize: '50px'}}>API Hub</h1>
+       
+        <div className="row" style={{marginTop: '20px', width: '100%', justifyContent: 'center', alignItems: 'center', flexWrap: 'wrap' }}>
+        {
+            data.map((data, index)=>{
+                return <PerChatCard data={data} key={index} open={open} setOpen={setOpen} setData={setData}/>
+            })
+        }
+        </div>
+        
+    </div>
+    </>
+    
+  )
+}
+
+export default page

app/components/ApiModal.css

@@ -0,0 +1,26 @@
+.row::-webkit-scrollbar{
+    width: 2px;
+    background-color: transparent;
+    border-radius: 10px;
+    cursor: pointer;
+    height: 90%;
+}
+
+.row::-webkit-scrollbar-thumb{
+    background: linear-gradient(to bottom, #00c8ff, #2635c1);
+    border-radius: 10px;
+    cursor: pointer;
+}
+
+.fade-in {
+    animation: fadeIn 0.3s ease;
+  }
+  
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }

app/components/ApiModal.jsx

@@ -0,0 +1,23 @@
+import React from 'react'
+import Link from 'next/link'
+import '@/app/components/ApiModal.css'
+const ApiModal = ({open, setOpen, api}) => {
+  return (
+    <div className="fade-in" style={{width: '100vw', height: '100vh', display: 'flex', justifyContent: 'center', alignItems: 'center', position: 'fixed', zIndex: '1000', top: '0', left: '0', backgroundColor: 'rgba(0, 0, 0, 0.8)', backdropFilter: 'blur(10px)'}}>
+        <div className="row" style={{justifyContent: 'space-between', alignItems: 'center', display: 'flex', flexWrap: 'wrap', position: 'fixed', zIndex: '1000', top: '50%', left: '50%', transform: 'translate(-50%, -50%)', backgroundColor: 'rgba(0, 10, 20, 0.8)', borderRadius: '10px', backdropFilter: 'blur(10px)', padding: '20px', width: '90%', maxHeight: '500px', overflowY: 'auto', maxWidth: '700px'}}>
+<div className="modal-body">
+    <div className="close gradient-text" style={{cursor: 'pointer', position: 'absolute', right: '10px', top: '10px', backgroundImage: 'linear-gradient(to right, #ff0000, #ffaaaa)'}} onClick={()=>setOpen(false)}>Close</div>
+                <h3>URL: </h3><p>{api.url}</p>
+                <h3>Description: </h3><p>{api.description}</p>
+                <h3>Query: </h3><p>{api.query}</p>
+                <h3>Response: </h3><p>{api.response}</p>
+                <h3>Method: </h3><p>{api.method || 'GET'}</p>
+                <h3>Test URL: </h3><Link href={api.testURL|| '#'}>Try it</Link>
+            </div>
+        </div>
+    </div>
+    
+  )
+}
+
+export default ApiModal

app/components/Footer.css

@@ -0,0 +1,81 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+.footer{
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    padding: 10px;
+    align-items: flex-start;
+    width: 100%;
+    }
+
+.col{
+    display: flex;
+    flex-direction: column;
+    padding: 20px;
+    width: max-content;
+    align-items: left;
+    justify-content: left;
+    text-align: left;
+    max-width: 100%;
+}
+.row a:hover{
+    padding: 0;
+    color : linear-gradient(to right, #00c8ff, #2635c1);
+    -webkit-background-clip: text; /* Clip the gradient to the text */
+    background-clip: text;
+    -webkit-text-fill-color: transparent; /* Make the text transparent */
+}
+.footer a{
+    margin-top: 20px;
+    margin-left: 3px;
+    font-size: small;
+}
+
+.footer a:hover{
+
+}
+
+h3{
+    font-size: large;
+    font-weight: bold;
+}
+
+.footcontainer{
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0);
+    color: rgba(255, 255, 255, 0.751);
+    backdrop-filter: blur(10px);
+    border:none;
+    border-top: 2px solid rgba(255, 255, 255, 0.233); /* Changed border-bottom style to solid and specified border-color */
+    width: 100%;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+}
+
+.row{
+    display: flex;
+    flex-direction: row;
+}
+
+.row a{
+    margin-right: 12px;
+}
+
+.row a:hover{
+    padding: 0;
+    background-color: transparent;
+    color: rgba(250, 235, 215, 0.459);
+}
+
+.line{
+    width: 100%;
+    height: 2px;
+    background-color: rgba(255, 255, 255, 0.251);
+    margin: 10px 0;
+}

app/components/Footer.jsx

@@ -0,0 +1,62 @@
+import '@/app/components/Footer.css';
+import React from 'react';
+import Link from 'next/link';
+import { BsFacebook } from "react-icons/bs";
+import { SiGmail } from "react-icons/si";
+import { FaFacebookMessenger } from "react-icons/fa";
+const Footer = () => {
+
+
+  return (
+    <div className='col footcontainer' style={{}}>
+    <div className='footer'>
+        <div className="col">
+            <h3 className='gradient-text'>Company</h3>
+            <Link href='/About'>About Us</Link>
+            <Link href='/Contact'>Contact Us</Link>
+            <Link href='/Login'>Login</Link>
+            <Link href='/Signup'>Signup</Link>
+        </div>
+        <div className="col">
+            <h3 className='gradient-text'>AI</h3>
+            <Link href='#'>Open AI</Link>
+            <Link href='#'>Liner</Link>
+            <Link href='#'>Herc</Link>
+        </div>
+        <div className="col">
+            <h3 className='gradient-text'>Social Media</h3>
+            <Link href='/'>Facebook</Link>
+            <Link href='/'>Twitter</Link>
+            <Link href='/'>Instagram</Link>
+            <Link href='/'>LinkedIn</Link>
+        </div>
+        <div className="col">
+            <h3 className='gradient-text'>Programming</h3>
+            <Link href='#'>Javascript</Link>
+            <Link href='#'>React JS</Link>
+            <Link href='#'>Next JS</Link>
+            <Link href='#'>Node JS</Link>
+        </div>
+
+        <div className="col">
+            <h3 className='gradient-text'>Contact</h3>
+            <Link href='#'>Contact Page</Link>
+            <span className="row">
+                
+            <Link href='#'><BsFacebook size={25}/></Link>
+            <Link href='#'><SiGmail size={25}/></Link>
+            <Link href='#'><FaFacebookMessenger size={25}/></Link>
+            </span>
+ 
+            
+        </div>
+    </div>
+    <div className="line"></div>
+    <div className="copyright gradient-text">
+        <p style={{fontSize: '12px'}}>&copy; 2024 TS API. All rights reserved.</p>
+    </div>
+    </div>
+  );
+};
+
+export default Footer;

app/components/Header.css

@@ -0,0 +1,75 @@
+.header{
+    background-color: rgba(0, 0, 0, 0);
+    color: white;
+
+    border:none;
+    border-bottom: 2px solid rgba(255, 255, 255, 0.233); /* Changed border-bottom style to solid and specified border-color */
+}
+
+@media screen and (max-width: 600px) {
+    .links{
+        display: none;
+    }
+}
+
+a{
+    margin-left: 20px;
+    transition-duration: 300ms;
+    font-size: medium;
+  }
+  
+  a:hover{
+    background: linear-gradient(to right, #00c8ff, #2635c1);
+
+    color: white;
+    padding: 10px;
+    border-radius: 10px;
+  }
+
+  
+
+.sidenav {
+    height: 100%;
+    width: 0;
+    position: fixed;
+    z-index: 1;
+    top: 0;
+    right: 0;
+    background-color: rgba(0, 0, 0, 0.5);
+    backdrop-filter: blur(10px);
+    overflow-x: hidden;
+    transition: 0.5s;
+    padding-top: 60px;
+  }
+  
+  .sidenav a {
+    padding: 8px 8px 8px 32px;
+    text-decoration: none;
+    font-size: 25px;
+    color: #ffffff;
+    display: block;
+    transition: 0.3s;
+  }
+  
+  .sidenav a:hover {
+    color: #808080;
+  }
+  
+  .sidenav .closebtn {
+    position: absolute;
+    top: 0;
+    right: 25px;
+    font-size: 36px;
+    margin-left: 50px;
+  }
+  
+  
+.menubtn{
+  display: none;
+}  
+
+@media screen and (max-width: 600px) {
+  .menubtn{
+    display: block;
+  }
+}

app/components/Header.jsx

@@ -0,0 +1,40 @@
+"use client"
+
+import React from 'react'
+import Link from 'next/link'
+import { GiRobotGrab } from "react-icons/gi";
+import '@/app/components/Header.css'
+import Navbar from '@/app/components/Navbar'
+import Cookies from 'js-cookie';
+const Header = () => {
+  const [open, setOpen] = React.useState(false)
+  const [loggedIn, setLoggedIn] = React.useState(false)
+
+  React.useEffect(() => {
+    Cookies.get('UserID') ? setLoggedIn(true) : setLoggedIn(false)
+  }, [])
+  function openNav() {
+    setOpen(true)
+    document.getElementById("mySidenav").style.width = "250px";
+  }
+  return (
+    
+    <div className='flex-row header' style={{ width: '100%',justifyContent: 'space-between', alignItems: 'center', padding: '10px'}}>
+        <span onClick={()=>window.location.href = '/'} className='gradient-text' style={{display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center', fontSize: '20px'}}><GiRobotGrab size={25} color='#00c8ff'/>TS API</span>
+        <div className="menubtn gradient-text" style={{cursor: 'pointer'}} onClick={openNav}>&#9776; Menu</div>
+        <Navbar open={open} />
+        <div className="links" style={{justifyContent: 'space-between', padding: '10px'}}>
+        <Link href='/About'>About</Link>
+        <Link href='/About'>Docs</Link>
+        <Link href='/api'>API</Link>
+          <Link href='/Contact'>Contact</Link>
+        </div>
+        <div className="links" style={{justifyContent: 'space-between', padding: '10px'}}>
+          {loggedIn?<Link className='btn2' href='/api' style={{marginLeft: '10px' ,padding: '10px', borderRadius: '10px'}}><i className="animation"></i>DASHBOARD<i className="animation"></i></Link> :<Link className='btn2' href='/api' style={{marginLeft: '10px' ,padding: '10px', borderRadius: '10px'}}><i className="animation"></i>Get started<i className="animation"></i></Link>}
+        </div>
+    </div>
+  )
+}
+
+
+export default Header

app/components/Navbar.css

@@ -0,0 +1,24 @@
+.sidenav a{
+    font-size: small;
+    width: min-content;
+}
+
+.sidenav h3{
+    margin-left: 10px;
+}
+
+.sidenav{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+}
+
+.sidenav .btn{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    padding: 10px;
+}

app/components/Navbar.jsx

@@ -0,0 +1,33 @@
+import React from 'react'
+import Link from 'next/link'
+import '@/app/components/Navbar.css'
+const Navbar = ({open}) => {
+
+      
+      function closeNav() {
+        document.getElementById("mySidenav").style.width = "0";
+      }
+  return (
+    <div id="mySidenav" className="sidenav" style={{}}>
+        <div className="row" style={{justifyContent: 'space-between', padding: '10px', flexDirection: 'row', alignItems: 'center', display: 'flex'}}>
+            <span>Menu Bar</span>
+        <span href="#" className="closebtn" onClick={closeNav}>×</span>
+            </div>
+        <div className="line"></div>
+        <h3 style={{marginBottom: '10px'}}>Routes</h3>
+        <Link className="btn2" style={{marginBottom: '10px', backgroundColor: 'black', color: 'white'}} href="/"><i className="animation"></i>Home<i className="animation"></i></Link>
+        {/* <!--<Link onclick="scrollDown()">Download</Link>--> */}
+        <Link className='btn2' style={{marginBottom: '10px', backgroundColor: 'black', color: 'white'}}  href="/api"><i className="animation"></i>API<i className="animation"></i></Link>
+        <Link className='btn2' style={{marginBottom: '10px', backgroundColor: 'black', color: 'white'}} href="/Linkbout"><i className="animation"></i>About<i className="animation"></i></Link>
+        <Link className='btn2' style={{marginBottom: '10px', backgroundColor: 'black', color: 'white'}} href="/support"><i className="animation"></i>Support<i className="animation"></i></Link>
+        
+        <div className="line"></div>
+        <h3 style={{marginBottom: '10px'}}>Authenticate</h3>
+        <Link className='btn2' style={{marginBottom: '10px', backgroundColor: 'black', color: 'white'}} href="/login"><i className="animation"></i>Login<i className="animation"></i></Link>
+        <Link className='btn2' style={{marginBottom: '10px', backgroundColor: 'black', color: 'white'}} href="/signup"><i className="animation"></i>Sign UP<i className="animation"></i></Link>
+        <hr></hr>
+      </div>
+  )
+}
+
+export default Navbar;

app/components/PerChatCard.css

@@ -0,0 +1,3 @@
+.apicard{
+    margin: 10px;
+}

app/components/PerChatCard.jsx

@@ -0,0 +1,26 @@
+"use client"
+
+import React from 'react'
+import Link from 'next/link'
+import '@/app/components/PerChatCard.css'
+const PerChatCard = ({data, open, setOpen, setData}) => {
+    //console.log(data)
+
+  const api = data
+    const handleClick = (data)=>{
+      if (!open){
+        setData(data)
+      }
+      setOpen(!open)
+    }
+  return (
+    <div className="apicard">
+      
+      <button className="btn2" style={{width: '100%'}} onClick={()=>handleClick(data)}><i className="animation"></i><span className="">{data.name}</span><i className="animation"></i></button>
+
+    </div>
+
+  )
+}
+
+export default PerChatCard

app/globals.css

@@ -0,0 +1,243 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+body {
+  color: #ffffff;
+  background: #000000;  /* fallback for old browsers */
+
+}
+
+.flex-col {
+  display: flex;
+  flex-direction: column;
+}
+
+.flex-row{
+  display: flex;
+  flex-direction: row;
+}
+
+.fade-in-text {
+  opacity: 0;
+  transition: opacity 0.5s ease-in-out;
+}
+
+.fade-in-text.active {
+  opacity: 1;
+}
+
+.modal{
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.8);
+  backdrop-filter: blur(10px);
+  display: flex;
+  flex-direction: column;
+  border-radius: 20px;
+  justify-content: center;
+  align-items: center;
+  z-index: 9999;
+  padding: 20px;
+  width: 90%;
+  max-width: 800px;
+}
+
+.modal iframe{
+  width: 100%;
+  height: 100%;
+  border-radius: 10px;
+}
+
+.btn{
+  padding: 10px;
+  border-radius: 10px;
+  /* background-color: white; */
+  background: radial-gradient(231.94% 231.94% at 50% 100%, #00c8ff 0, rgba(38, 53, 193, 0) 25.24%), linear-gradient(180deg, rgba(243, 238, 255, 0), rgba(243, 238, 255, .04)), rgba(147, 130, 255, .01);
+  background-image: linear-gradient(to right, #00c8ff, #2635c1);
+
+  color: white;
+  transition: 200ms;
+   box-shadow: 0 0 140px rgb(0, 162, 255); 
+   -webkit-background-clip: text; /* Clip the gradient to the text */
+   background-clip: text;
+   -webkit-text-fill-color: transparent; /* Make the text transparent */
+}
+
+
+input{
+  padding: 10px;
+  border-radius: 10px;
+  border: none;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+  background-color: transparent;
+  color: white;
+  padding: 10px;
+  border: #00c8ff 2px solid;
+  
+
+}
+
+
+.btn:hover {
+  
+  -webkit-background-clip: text; /* Clip the gradient to the text */
+  background-clip: text;
+  background: linear-gradient(to right, #00c8ff, #2635c1);
+  color: white;
+  -webkit-text-fill-color: white;
+  box-shadow: 0 0 100px rgba(255, 255, 255, 0.55);
+}
+
+.gradient-text {
+  background: linear-gradient(to right, #00c8ff, #2635c1);
+  -webkit-background-clip: text; /* Clip the gradient to the text */
+  background-clip: text;
+  -webkit-text-fill-color: transparent; /* Make the text transparent */
+}
+.title{
+  font-size: 70px;
+  font-weight: '300';
+}
+@media screen and (max-width: 510px) {
+  .title{
+    font-size: 30px;
+    font-weight: bold;
+  }
+}
+
+
+.thin-scroll::-webkit-scrollbar {
+  width: 4px;
+  background-color: rgba(0, 89, 255, 0.158); /* make scrollbar transparent */
+  border-radius: 10px;
+  cursor: pointer;
+}
+
+.thin-scroll::-webkit-scrollbar-thumb {
+  background-color: rgba(0, 89, 255, 0.2); /* make scrollbar thumb transparent */
+  border-radius: 10px;
+  cursor: pointer;
+
+  
+}
+
+.row{
+  flex-wrap: wrap;
+}
+
+.card{
+  
+  margin-top: 100px;
+  border-radius: 30px;
+  box-shadow:  0 20px 50px rgba(0, 172, 240, 0.717);
+  background-color: rgba(67, 67, 67, 0.1);
+  backdrop-filter: blur(10px);
+  transition-duration: 300ms;
+}
+
+.card h3{
+  background: linear-gradient(to right, #1c758e, #2635c1);
+  font-size: 30px;
+  padding: 10px;
+  border-radius: 30px 30px 0px 0px;
+  font-weight: 200;
+  margin: 0;
+
+}
+
+.card p{
+  background: linear-gradient(to right, #1c758e, #2635c1);
+  -webkit-background-clip: text; /* Clip the gradient to the text */
+  background-clip: text;
+  -webkit-text-fill-color: transparent; /* Make the text transparent */
+  
+}
+
+.card:hover{
+  box-shadow:  0 30px 50px rgba(0, 172, 240, 0.717);
+  transform: translateY(-10px);
+}
+
+.card p::before{
+  content: "";
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  background: linear-gradient(to right, #00c8ff, #2635c1);
+  border-radius: 50%;
+  margin-right: 20px;
+}
+
+.card p{
+  color: rgba(255, 255, 255, 0.516);
+  font-size: 17px;
+  text-align: left;
+  margin: 10px;
+}
+
+.card .line{
+  background: linear-gradient(to right, #00c8ff, #2635c1);
+
+}
+
+.card .n{
+  background-image: none;
+  border-radius: 0px 0px 30px 30px;
+  background-color: rgb(11, 11, 11);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 10px;
+}
+
+.btn2 {
+  outline: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: space-between;
+  background: linear-gradient(to right, #00c8ff, #2635c1);
+  min-width: 200px;
+  border: 0;
+  border-radius: 30px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
+  box-sizing: border-box;
+  padding: 16px 20px;
+  color: #fff;
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 1.2px;
+  text-transform: uppercase;
+  overflow: hidden;
+  cursor: pointer;
+  transition-duration: 400ms;
+}
+
+.btn2:hover {
+  opacity: .55;
+  padding: 16px 20px;
+
+}
+
+.btn2 .animation {
+  border-radius: 100%;
+  animation: ripple 0.6s linear infinite;
+}
+
+@keyframes ripple {
+  0% {
+    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1), 0 0 0 20px rgba(255, 255, 255, 0.1), 0 0 0 40px rgba(255, 255, 255, 0.1), 0 0 0 60px rgba(255, 255, 255, 0.1);
+  }
+
+  100% {
+    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0.1), 0 0 0 40px rgba(255, 255, 255, 0.1), 0 0 0 60px rgba(255, 255, 255, 0.1), 0 0 0 80px rgba(255, 255, 255, 0);
+  }
+}
+
+.space{
+  height: 100px;
+}

app/layout.jsx

@@ -0,0 +1,24 @@
+import {Inter as Inter } from "next/font/google";
+import "@/app/globals.css";
+import Header from "./components/Header";
+import Footer from "./components/Footer";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export const metadata = {
+  title: "TS Api",
+  description:
+    "Your one stop destination for all Artificial Intelligence Models and APIs. Explore and try out all the models available.",
+};
+
+export default function RootLayout({ children }) {
+  return (
+    <html lang="en">
+      <body className={inter.className}>
+        <Header />
+        {children}
+        <Footer />
+      </body>
+    </html>
+  );
+}

app/others/eidmubarak/[name]/page.jsx

@@ -0,0 +1,61 @@
+
+
+import React from "react";
+import "./style.css";
+import Link from "next/link";
+const page = ( {params} ) => {
+    console.log(params.name)
+  return (
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        width: "100%",
+        minHeight: "100vh",
+        textAlign: "center",
+
+      }}
+    >
+
+      <div
+        className="col"
+        style={{
+          maxWidth: "700px",
+          textAlign: "center",
+          padding: "40px",
+          borderRadius: "30px",
+          boxShadow: "0 0 100px rgba(10, 100, 200, 0.6)",
+          alignItems: "center",
+          justifyContent: "center",
+          width: "90%",
+          marginTop: "50px",
+          marginBottom: "50px",
+        }}
+      >
+        <p style={{color:"cyan"}}>          পবিত্র ইদ-উল-ফিতরের শুভেচ্ছা </p>
+        <h3 className="gradient-text" style={{ marginBottom: "30px",fontSize: "60px" }}>
+         ইদ মুবারক
+        </h3>
+        <p style={{ fontSize: "20px", color: "gray" }}>
+          {" "}
+          <span style={{color:"gray"}}>تقبل الله منا ومنكم</span><br />
+          <span style={{color:"gray"}}>তাক্বাব্বালাল্লাহু মিন্না ওয়া মিনকুম🤗🫂</span>
+          <br />
+          এই বিশেষ দিনটি আপনার জন্য আনন্দ, শান্তি এবং সমৃদ্ধি নিয়ে আসুক। 🎉🌙❤️
+          
+          <br />
+          <span className="gradient-text mt-4" style={{ fontSize: "18px", marginTop: "30px" }}>
+            #ইদ_মুবারক 
+          </span>
+        </p>
+        <p style={{ fontSize: "14px", color: "gray", alignSelf: "flex-end" }}>- {decodeURIComponent(params.name)}</p>
+        
+      </div>
+      <Link style={{marginTop: "50px"}} className="btn2" href="/others/eidmubarak/generate"><i className="animation"></i>এবার আপনিও এরকম একটি টেম্পলেট তৈরি করুন<i className="animation"></i></Link>
+    </div>
+  );
+};
+
+export default page;

app/others/eidmubarak/generate/page.jsx

@@ -0,0 +1,52 @@
+"use client"
+
+import React from "react";
+import "./style.css";
+import Link from "next/link";
+const page = ( {params} ) => {
+
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const [link, setLink] = React.useState('./')
+    console.log(params.name)
+  return (
+    <div
+
+    className="temp"
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        width: "100%",
+        minHeight: "100vh",
+        textAlign: "center",
+
+      }}
+    >
+
+      <div
+        className="col"
+        style={{
+          maxWidth: "700px",
+          textAlign: "center",
+          padding: "40px",
+          borderRadius: "30px",
+          boxShadow: "0 0 100px rgba(10, 100, 200, 0.6)",
+          alignItems: "center",
+          justifyContent: "center",
+          width: "90%",
+          marginTop: "50px",
+          marginBottom: "50px",
+        }}
+      >
+        <p style={{marginBottom:"30px"}}>এখানে আপনার নাম দিনঃ </p>
+        <input style={{width:"100%", padding:"10px", borderRadius:"10px", border:"none", boxShadow:"0 0 10px rgba(0, 0, 0, 0.1)", backgroundColor:"#111111", color:"white", outline:'none', border: "#00c8ff 2px solid"}} onChange={(e)=>{'./others/eidmubarak/'+setLink(e.target.value)}} placeholder="আপনার নাম" onKeyDown={(e)=>{if(e.key === 'Enter'){window.location.href = link || './'}}}></input>
+
+        <Link style={{marginTop: "50px"}} className="btn2" href={link}><i className="animation"></i>লিঙ্ক তৈরি করুন<i className="animation"></i></Link>
+      </div>
+      
+    </div>
+  );
+};
+
+export default page;

app/page.jsx

@@ -0,0 +1,71 @@
+
+
+import Image from "next/image";
+import "@/app/globals.css";
+import Link from "next/link";
+
+
+export default function Home() {
+
+
+  return (
+    <div style={{width: '100%', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center'}}>
+ 
+        <div className="container col" style={{padding: '20px', alignItems: 'center', justifyContent: 'center', backgroundColor: 'black', width: '100%', padding: '20px'}}>
+          <div style={{display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', width: '100%', minHeight: '80vh', textAlign: 'center'}}>
+          <h1 className="title" style={{ margin: '30px'}}>Power up your projects with the most powerful <span className="gradient-text">AI Models</span></h1>
+          <p style={{maxWidth: '700px', textAlign: 'center', fontWeight: '200'}}>Unleash your insights into your messenger chats. Discover the hidden secrets of your conversations and make informed decisions.</p>
+          <Link className="btn2 mt-8 mb-8" href={'/api'}><i className="animation"></i>Get Started<i className="animation"></i></Link>
+          <p style={{maxWidth: '700px', textAlign: 'center', fontSize: '12px', color: 'gray'}}>As we used reverse engineer technology so they all are as fast as the origin websites and more significantly they all are free!</p>
+
+          </div>
+          
+          <div className="col" style={{padding: '20px', alignItems: 'center', justifyContent: 'center', width: '100%', minHeight: 'calc(80vh)', textAlign: 'center'}}>
+            <div className="line mb-10" style={{marginBottom: '30px'}}></div>
+            <h1 className="title gradient-text" style={{marginTop: '100px'}}>
+              Get in touch with AIs like never before
+            </h1>
+            <p className="mt-8" style={{fontSize: '22px', color: 'gray', maxWidth: '70vw'}}>
+              You can literally use the premium AI Models without any api key or any kind of authentication hassel.
+
+            </p>
+            <div className="row" style={{marginTop: '50px', width: '100%', justifyContent: 'space-around', alignItems: 'center'}}>
+              <div className="card">
+                <h3 className="btn2" style={{width: '100%'}}><i className="animation"></i>FREE<i className="animation"></i></h3>
+    <div className="p-6">                <p >No login required</p>
+                <p >No api key required</p>
+                <p >No authentication required</p>
+                <p >No payment required</p></div>
+                <h3 className="n"><button className="btn" style={{fontSize: '12px', margin: '0px'}}>Learn More</button></h3>
+
+              </div>
+              <div className="card">
+              <h3 className="btn2" style={{width: '100%'}}><i className="animation"></i>FAST<i className="animation"></i></h3>
+                <div className="p-6">
+                                  <p >Works as fast as a blitz</p>
+                <p >Faster response in gpt AIs</p>
+                <p >Fast Response Generation</p>
+                <p >Integrated Optimization</p>
+                </div>
+                <h3 className="n"><button className="btn" style={{fontSize: '12px', margin: '0px'}}>Learn More</button></h3>
+
+
+              </div>
+              <div className="card">
+              <h3 className="btn2" style={{width: '100%'}}><i className="animation"></i>SUPPORT<i className="animation"></i></h3>
+<div className="p-6">                <p >Supports all programming languages!</p>
+                <p >Uptime 99.99%</p>
+                <p >Supports MS Copilot, Gemini and more!</p>
+                <p >Elegant Syntax</p></div>
+                <h3 className="n"><button className="btn" style={{fontSize: '12px', margin: '0px'}}>Learn More</button></h3>
+
+              </div>
+            </div>
+          </div>
+
+          <div className="space"></div>
+        </div>
+      
+    </div>
+  );
+}

jsconfig.json

@@ -0,0 +1,7 @@
+{
+  "compilerOptions": {
+    "paths": {
+      "@/*": ["./*"]
+    }
+  }
+}

next.config.mjs

@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {};
+
+export default nextConfig;

package.json

@@ -0,0 +1,32 @@
+{
+  "name": "ts-api",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "@shuddho11288/blackboxai-api": "^1.2.0",
+    "@shuddho11288/llama-api": "^1.1.0",
+    "@shuddho11288/mistral-api": "^1.1.0",
+    "@shuddho11288/sdxl-imagine": "^1.1.0",
+    "axios": "^1.6.8",
+    "js-cookie": "^3.0.5",
+    "next": "14.1.4",
+    "react": "^18",
+    "react-confetti": "^6.1.0",
+    "react-confetti-explosion": "^2.1.2",
+    "react-dom": "^18",
+    "react-icons": "^5.0.1"
+  },
+  "devDependencies": {
+    "autoprefixer": "^10.0.1",
+    "eslint": "^8",
+    "eslint-config-next": "14.1.4",
+    "postcss": "^8",
+    "tailwindcss": "^3.3.0"
+  }
+}

pages/api/apiList.js

@@ -0,0 +1,49 @@
+// pages/api/apiList.js
+
+import fs from 'fs';
+import path from 'path';
+
+export default function handler(req, res) {
+  const apiDir = path.join(process.cwd(), 'pages/api');
+
+  try {
+    // Read the directory synchronously
+    const files = fs.readdirSync(apiDir);
+
+    // Filter out the current file and non-JavaScript files
+    const jsFiles = files.filter(file => file !== 'apiList.js' && file.endsWith('.js'));
+
+    // Initialize an array to store API configurations
+    const apiList = [];
+
+    // Load configurations from each JavaScript file
+    for (const file of jsFiles) {
+      const filePath = path.join(apiDir, file);
+      
+      // Read the file content
+      const fileContent = fs.readFileSync(filePath, 'utf-8');
+      
+      // Extract JSON using regex
+      const jsonMatch = fileContent.match(/export\s+const\s+config\s+=\s+({[\s\S]*?})/);
+
+      // If JSON is found, parse it and add it to the API list
+      if (jsonMatch && jsonMatch[1]) {
+        console.log(jsonMatch[1])
+        const config = JSON.parse(jsonMatch[1]);
+        apiList.push({...config });
+      }
+    }
+
+    // save the json at public/apiList.json (from the root)
+    fs.writeFileSync(
+      path.join(process.cwd(), 'public/apiList.json'),
+      JSON.stringify(apiList, null, 2),
+    );
+
+    // Send the information as a JSON response
+    res.status(200).json(apiList);
+  } catch (error) {
+    console.error('Error reading API directory:', error);
+    res.status(500).json({ error: 'Internal Server Error' });
+  }
+}

pages/api/bing.js

@@ -0,0 +1,50 @@
+import axios from "axios";
+
+export const config = {
+    "name": "bing",
+    "url": "/api/bing",
+    "description": "Get response from Bing. Bing is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/bing?prompt=hello"
+}
+
+export default async function handler(req, res2) {
+let prompt = req.query.prompt;
+
+axios.post('https://niansuhai-bingo.hf.space/api/create', {
+
+}).then((res) => {
+    axios.post('https://niansuhai-bingo.hf.space/api/sydney',{
+        ...res.data,   "invocationId": 0,
+        "conversationStyle": "Balanced",
+        "prompt": prompt,
+        "allowSearch": true,
+        "context": ""
+    }).then((res) => {
+       let jsonString = res.data
+    //    console.log(jsonString)
+    //    require('fs').writeFileSync('output.txt', jsonString)
+       // Define the regex pattern to match the desired text
+const regexPattern = /"message":"(.*?)"/;
+
+// Use the regex pattern to find matches in the JSON string
+const matches = jsonString.match(regexPattern);
+
+// Extract the matched text
+const extractedText = matches ? matches[matches.length-1] : null;
+
+function replaceUnicodeWithEmoji(inputString) {
+    return inputString.replace(/\\u([\d\w]{4})/gi, (match, grp) => {
+        return String.fromCharCode(parseInt(grp, 16));
+    });
+}
+
+const input = extractedText;
+const output = replaceUnicodeWithEmoji(input);
+console.log(output.split('\\n').join('\n'));
+res2.status(200).json({ "status": "Success", "message": output.split('\\n').join('\n') }); // Output: Hello! How can I assist you today? 😊
+
+    })
+})
+}

pages/api/blackbox.js

@@ -0,0 +1,18 @@
+import axios from "axios";
+export const config = {
+    "name": "blackbox",
+    "url": "/api/blackbox",
+    "description": "Get response from Blackbox AI Model. Blackbox AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/blackbox?prompt=hello"
+
+}
+
+const {blackbox} = require('@shuddho11288/blackboxai-api')
+
+export default async function handler(req, res) {
+  const prompt = req.query.prompt;
+  const response = await blackbox(prompt);
+  res.status(200).json({response});
+}

pages/api/chatgpt3.js

@@ -0,0 +1,68 @@
+// pages/api/chat.js
+
+import axios from 'axios';
+
+export const config = {
+    "name": "chatgpt3",
+    "url": "/api/chatgpt3",
+    "description": "Get response from Chatgpt3. Chatgpt3 is a ChatGPT API. It can be used to get responses from ChatGPT. It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/chatgpt3?prompt=hello"
+}
+export default async function handler(req, res) {
+  if (req.method === 'GET') {
+    // Extract prompt from the query parameters
+    const { prompt } = req.query;
+
+    // Define the endpoint URL
+    const url = "https://chatgpt4online.org/wp-json/mwai-ui/v1/chats/submit";
+
+    // Get the HTML content of the chat page to extract the X-Wp-Nonce
+    try {
+      const response = await axios.get('https://chatgpt4online.org/#chat');
+      const string = response.data;
+      const regex = /restNonce":"([^&]+)"/;
+      const match = string.match(regex);
+
+      if (match) {
+        const restNonce = match[1];
+
+        // Define the payload data
+        const payload = {
+          botId: "chatbot-qm966k",
+          newMessage: prompt || "Hi", // Using prompt or "Hi" if prompt is not provided
+          newFileId: null,
+          stream: false
+        };
+
+        // Define the headers
+        const headers = {
+          'X-Wp-Nonce': restNonce
+        };
+
+        // Send POST request with headers
+        const postResponse = await axios.post(url, payload, { headers });
+
+        console.log("Chat message submitted successfully.");
+        // Optionally, you can log the response data
+        console.log("Response data:", postResponse.data);
+
+        res.status(200).json({ message: "Chat message submitted successfully", responseData: postResponse.data });
+      } else {
+        console.log('No match found');
+        res.status(500).json({ message: "Failed to fetch X-Wp-Nonce" });
+      }
+    } catch (error) {
+      console.error("Failed to submit chat message:", error.message);
+      // Optionally, you can log the error response data
+      if (error.response) {
+        console.error("Error response data:", error.response.data);
+      }
+      res.status(error.response?.status || 500).json({ message: "Failed to submit chat message" });
+    }
+  } else {
+    res.setHeader('Allow', ['GET']);
+    res.status(405).end(`Method ${req.method} Not Allowed`);
+  }
+}

pages/api/chatgpt4.js

@@ -0,0 +1,68 @@
+// pages/api/chat.js
+
+import axios from 'axios';
+
+export const config = {
+    "name": "chatgpt4",
+    "url": "/api/chatgpt4",
+    "description": "Get response from Chatgpt4. Chatgpt4 is a ChatGPT API. It can be used to get responses from ChatGPT. It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/chatgpt4?prompt=hello"
+}
+export default async function handler(req, res) {
+  if (req.method === 'GET') {
+    // Extract prompt from the query parameters
+    const { prompt } = req.query;
+
+    // Define the endpoint URL
+    const url = "https://chatgpt4online.org/wp-json/mwai-ui/v1/chats/submit";
+
+    // Get the HTML content of the chat page to extract the X-Wp-Nonce
+    try {
+      const response = await axios.get('https://chatgpt4online.org/#chat');
+      const string = response.data;
+      const regex = /restNonce":"([^&]+)"/;
+      const match = string.match(regex);
+
+      if (match) {
+        const restNonce = match[1];
+
+        // Define the payload data
+        const payload = {
+          botId: "default",
+          newMessage: prompt || "Hi", // Using prompt or "Hi" if prompt is not provided
+          newFileId: null,
+          stream: false
+        };
+
+        // Define the headers
+        const headers = {
+          'X-Wp-Nonce': restNonce
+        };
+
+        // Send POST request with headers
+        const postResponse = await axios.post(url, payload, { headers });
+
+        console.log("Chat message submitted successfully.");
+        // Optionally, you can log the response data
+        console.log("Response data:", postResponse.data);
+
+        res.status(200).json({ message: "Chat message submitted successfully", responseData: postResponse.data });
+      } else {
+        console.log('No match found');
+        res.status(500).json({ message: "Failed to fetch X-Wp-Nonce" });
+      }
+    } catch (error) {
+      console.error("Failed to submit chat message:", error.message);
+      // Optionally, you can log the error response data
+      if (error.response) {
+        console.error("Error response data:", error.response.data);
+      }
+      res.status(error.response?.status || 500).json({ message: "Failed to submit chat message" });
+    }
+  } else {
+    res.setHeader('Allow', ['GET']);
+    res.status(405).end(`Method ${req.method} Not Allowed`);
+  }
+}

pages/api/geminiweb.js

@@ -0,0 +1,23 @@
+import axios from "axios";
+const ENDPOINT = 'https://blackearthauction.com/Bard/api?req='
+export const config =     {
+  "name" : "geminiweb",
+  "url" : "/api/geminiweb",
+  "description" : "Get response from Gemini AI. Gemini AI is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+  "query" : "prompt",
+  "response" : "text",
+  "testURL" : "./api/geminiweb?prompt=hello"
+}
+export default async function handler(req, res) {
+  let prompt = req.query.prompt;
+  let result = await axios.get(ENDPOINT + encodeURIComponent(prompt+' Tone of reply should be  Professional'))
+  console.log(result.data.response)
+
+  result = result.data.response
+  res.status(200).json({
+    reply: result
+  });
+
+  
+}
+ 

pages/api/huggingchat.js

@@ -0,0 +1,80 @@
+// pages/api/chat.js
+
+import axios from 'axios';
+export const config =     {
+    "name" : "huggingchat",
+    "url" : "/api/huggingchat",
+    "description" : "Get response from huggingchat AI. huggingchat AI is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+    "query" : "prompt, web_search",
+    "response" : "text",
+    "testURL" : "./api/huggingchat?prompt=hello&web_search=false"
+  }
+
+const getUUID = async ()=>{
+
+    const headers = {
+        Cookie: '_ga=GA1.1.263364295.1704009324; __stripe_mid=576d7254-9b38-447d-b03a-0455234c85aa028d68; token=HEiBngeHcwmTbeNyMsqghqEbqamhgoGDNPAkFnaLNdUzfcoRqDBFImcbJrZwxXiAcVgxycPcNYLiGLwxAplmnxYpiwSmJzKfeINQjOfOzRRYkceAMEdDMmAmbOvBoJCB; token=HEiBngeHcwmTbeNyMsqghqEbqamhgoGDNPAkFnaLNdUzfcoRqDBFImcbJrZwxXiAcVgxycPcNYLiGLwxAplmnxYpiwSmJzKfeINQjOfOzRRYkceAMEdDMmAmbOvBoJCB; aws-waf-token=d60bed03-062c-4a5e-a13a-6812ec27064f:HgoAbUVRTiMBAAAA:0mDwu8h4MQwINC18fLNSLZa1kT3/1v4svl7RhEX1M8tXwchT/FqCc6fsn9eg88/G2yxHICSo0ab7R71o+rZlYjLDSsKteYXZSbVJyACrSUoE+x0T30pCqCkepaLaiI7jy5bC5DRPEWmpy5TYVpPmfLWf5EA9o3Jp9HYG7qw2i7t350MCdgb0fmDPxP7wnQoAMioXkyL13f3r2rxYAZVw78KlZdE=; __stripe_sid=94dfd71a-ca40-498b-ad9f-6e29b1f8d7c634c758; hf-chat=699d2836-9e8f-482c-9515-3dd214d419ce; _ga_8Q63TH4CSL=GS1.1.1712576098.12.1.1712576109.49.0.0',
+        'Content-Type': 'application/json'
+      };
+    let url = 'https://huggingface.co/chat/conversation/6614111dbb90af362a0d6ab4/__data.json?x-sveltekit-invalidated=11'
+
+    const response = await axios.get(url, { headers });
+    const data = response.data;
+
+
+
+    function findAllUUIDs(data) {
+        const uuids = []; // Array to store UUIDs
+        
+        // Recursive function to traverse nested objects and arrays
+        function traverse(obj) {
+            for (const key in obj) {
+                if (typeof obj[key] === 'string' && obj[key].match(/[0-9a-f]{8}-[0-9a-f]{4}-4[0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}/)) {
+                    uuids.push(obj[key]); // If the value is a UUID, push it to the array
+                } else if (typeof obj[key] === 'object' && obj[key] !== null) {
+                    traverse(obj[key]); // If the value is an object or array, recursively call the function
+                }
+            }
+        }
+        
+        traverse(data); // Start traversal from the root object
+        
+        return uuids;
+    }
+    
+    const allUUIDs = findAllUUIDs(data);
+    console.log(allUUIDs);
+    console.log(allUUIDs[allUUIDs.length - 1]);
+    return allUUIDs[allUUIDs.length - 1];
+}
+export default async function handler(req, res) {
+  if (req.method === 'GET') {
+    const { prompt, web_search } = req.query;
+    const url = 'https://huggingface.co/chat/conversation/6614111dbb90af362a0d6ab4';
+    const headers = {
+      Cookie: '_ga=GA1.1.263364295.1704009324; __stripe_mid=576d7254-9b38-447d-b03a-0455234c85aa028d68; token=HEiBngeHcwmTbeNyMsqghqEbqamhgoGDNPAkFnaLNdUzfcoRqDBFImcbJrZwxXiAcVgxycPcNYLiGLwxAplmnxYpiwSmJzKfeINQjOfOzRRYkceAMEdDMmAmbOvBoJCB; token=HEiBngeHcwmTbeNyMsqghqEbqamhgoGDNPAkFnaLNdUzfcoRqDBFImcbJrZwxXiAcVgxycPcNYLiGLwxAplmnxYpiwSmJzKfeINQjOfOzRRYkceAMEdDMmAmbOvBoJCB; aws-waf-token=d60bed03-062c-4a5e-a13a-6812ec27064f:HgoAbUVRTiMBAAAA:0mDwu8h4MQwINC18fLNSLZa1kT3/1v4svl7RhEX1M8tXwchT/FqCc6fsn9eg88/G2yxHICSo0ab7R71o+rZlYjLDSsKteYXZSbVJyACrSUoE+x0T30pCqCkepaLaiI7jy5bC5DRPEWmpy5TYVpPmfLWf5EA9o3Jp9HYG7qw2i7t350MCdgb0fmDPxP7wnQoAMioXkyL13f3r2rxYAZVw78KlZdE=; __stripe_sid=94dfd71a-ca40-498b-ad9f-6e29b1f8d7c634c758; hf-chat=699d2836-9e8f-482c-9515-3dd214d419ce; _ga_8Q63TH4CSL=GS1.1.1712576098.12.1.1712576109.49.0.0',
+      'Content-Type': 'application/json'
+    };
+    
+    const data = {
+      inputs: prompt || 'hi',
+      id: await getUUID(),
+      is_retry: false,
+      is_continue: false,
+      web_search: web_search=='true',
+      files: []
+    };
+
+    try {
+      const response = await axios.post(url, data, { headers });
+      console.log('API response:', response.data);
+      res.status(response.status).json(JSON.parse(response.data.split('\n')[response.data.split('\n').length - 2]));
+    } catch (error) {
+      console.error('Error:', error);
+      res.status(error.response?.status || 500).json({ message: 'Internal server error' });
+    }
+  } else {
+    res.setHeader('Allow', ['GET']);
+    res.status(405).end(`Method ${req.method} Not Allowed`);
+  }
+}

pages/api/imagine.js

@@ -0,0 +1,18 @@
+import axios from "axios";
+export const config = {
+    "name": "imagine",
+    "url": "/api/imagine",
+    "description": "Get response from imagine AI Model. imagine AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/imagine?prompt=cute+cat"
+
+}
+
+const {imagine} = require('@shuddho11288/sdxl-imagine')
+
+export default async function handler(req, res) {
+  const prompt = req.query.prompt;
+  const response = await imagine(prompt);
+  res.status(200).json({...response});
+}

pages/api/liner.js

@@ -0,0 +1,42 @@
+import axios from "axios";
+
+export const config =     {
+  "name" : "liner",
+  "url" : "/api/liner",
+  "description" : "Get response from liner AI. Liner Ai is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+  "query" : "prompt",
+  "response" : "text",
+  "testURL" : "./api/liner?prompt=hello"
+}
+const headers = {
+  Cookie:
+    "ab180ClientId=d124745c-b8e0-44c9-8712-82056e1571ed; __stripe_mid=ad30335b-6b5e-4340-8ceb-ac91d6b8cc34a0a896; __stripe_sid=18e0d0e2-0b72-4a6c-8859-ee62b3dcfd02c953ea; connect.sid=s%3AZpWUIMuuF7jh09Z7QriboFEE2chRqxxF.VYhAtox3jyd6ECn2tPDci4e4oSNPicTovuHyOJBv4Wo; _ga_9RRDSJXHYC=GS1.1.1709884220.1.1.1709884314.59.0.0; _ga_67C29LFSEM=GS1.1.1709884222.1.1.1709884316.57.0.1264912748; _dd_s=rum=0&expire=null; amp_ac9120=byJG3kKNpv1SoxEYhgl-ki.OTA4MzY3MQ==..1hoeglaf8.1hoegpbgo.1f.3.1i",
+  "Content-Type": "application/json",
+};
+export default function handler(req, res) {
+  let prompt = req.query.prompt;
+  const data = {
+    spaceId: 18572253,
+    threadId: "57117968",
+    userMessageId: 69370497,
+    userId: 9083671,
+    experimentId: 56,
+    query: " " + prompt,
+    agentId: "@liner",
+    platform: "web",
+    regenerate: false,
+    showReferenceChunks: true,
+  };
+
+  // Make POST request
+  axios
+    .post("https://getliner.com/platform/copilot/v3/answer", data, { headers })
+    .then((response) => {
+      let da = response.data.split("\n");
+      console.log(da[da.length - 2]);
+      res.status(200).json( JSON.parse(da[da.length - 2]));
+    });
+
+  
+}
+ 

pages/api/llama.js

@@ -0,0 +1,18 @@
+import axios from "axios";
+export const config = {
+    "name": "llama",
+    "url": "/api/llama",
+    "description": "Get response from llama AI Model. llama AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/llama?prompt=hello"
+
+}
+
+const {llama} = require('@shuddho11288/llama-api')
+
+export default async function handler(req, res) {
+  const prompt = req.query.prompt;
+  const response = await llama(prompt);
+  res.status(200).json({...response});
+}

pages/api/mistral.js

@@ -0,0 +1,18 @@
+import axios from "axios";
+export const config = {
+    "name": "mistral",
+    "url": "/api/mistral",
+    "description": "Get response from Mistral AI Model. Mistral AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/mistral?prompt=hello"
+
+}
+
+const {mistral} = require('@shuddho11288/mistral-api')
+
+export default async function handler(req, res) {
+  const prompt = req.query.prompt;
+  const response = await mistral(prompt);
+  res.status(200).json({...response});
+}

pages/api/pretend.js

@@ -0,0 +1,96 @@
+import axios from "axios";
+export const config = {
+    "name": "pretend",
+    "url": "/api/pretend",
+    "description": "Pretending to be someone, generate response!",
+    "query": "prompt, name",
+    "response": "text",
+    "testURL": "./api/pretend?prompt=hello&name=goku"
+}
+
+const getBotData = async (name) => {
+  const url = `https://api.exh.ai/strapi-secondary/api/bots?filters[name][$containsi]=${name}&pagination[page]=1&sort=messagesCount:desc`;
+
+  let res = await axios.get(url);
+  if (res.data.data.length < 1){
+    res = await axios.get(`https://api.exh.ai/strapi-secondary/api/bots?filters[description][$containsi]=${name}&pagination[page]=1&sort=messagesCount:desc`)
+  }
+  let data = res.data.data[0].attributes.name.toLowerCase().split(' ').includes(name.toLowerCase())? res.data.data[0] : res.data.data[1];
+  if (name.split(' ').length > 1) {
+    data =  res.data.data[0] 
+  }
+  console.log(data)
+  
+  //console.log( res.data.data[0].attributes.name.toLowerCase().split(' ').includes(name.toLowerCase()))
+  return data;
+};
+
+const getResponse = async (prompt, name) => {
+  const botData = await getBotData(name);
+
+  const tokenData = await axios.get(
+    "https://botify.ai/static/js/main.4f49c262.js"
+  );
+  let token = "";
+  //console.log(response.data);
+  const regex = /ks\.setToken\("([^"]+)"\)/;
+  const match = tokenData.data.match(regex);
+
+  if (match && match[1]) {
+    const _sValue = match[1];
+    token = _sValue;
+    //console.log(_sValue);
+  } else {
+    //console.log("No match found.");
+  }
+
+  const url = "https://api.exh.ai/chatbot/v1/get_response";
+  //console.log(botData.attributes.personaFacts.map((element)=>{ return element.content }))
+
+
+  const firstdata = {
+    name: botData.attributes.name,
+    context: [
+      { message: prompt, turn: "user" },
+    ],
+
+    strapi_bot_id: botData.id,
+     persona_facts: botData.attributes.personaFacts.map((element)=>{ return element.content }) || [],
+
+    access_level: "basic",
+  };
+
+  const headers = {
+    Authorization: "Bearer " + token,
+  };
+  const newResponse = await axios.post(url, firstdata, {
+    headers,
+  })
+  const botFirstMessage = newResponse.data.response;
+  console.log(botFirstMessage)
+  const data = {
+    name: botData.attributes.name,
+    context: [
+        { message: botFirstMessage, turn: "bot" },
+      { message: prompt, turn: "user" },
+    ],
+
+    strapi_bot_id: botData.id,
+     persona_facts: botData.attributes.personaFacts.map((element)=>{ return element.content }) || [],
+
+    access_level: "basic",
+  };
+  const response = await axios.post(url, data, {
+    headers,
+  });
+  console.log(response.data.response)
+  return {...response.data, input:data};
+};
+
+export default async function handler(req, res) {
+  const prompt = req.query.prompt;
+  const name = req.query.name;
+  const response = await getResponse(prompt, name);
+
+  res.status(200).json({...response});
+}

pages/api/upscaler.js

@@ -0,0 +1,58 @@
+import axios from "axios";
+export const config = {
+
+    "name": "upscaler",
+    "url": "/api/upscaler",
+    "description": "Get response from Upscaler AI Model. Upscaler AI can restore the image to its original state.",
+    "query": "url",
+    "response": "text",
+    "testURL": "./api/upscaler?url=https%3A%2F%2Fscontent.fdac27-2.fna.fbcdn.net%2Fv%2Ft39.30808-1%2F386334419_843740254146283_32129838220110611_n.jpg%3Fstp%3Dc0.29.100.100a_dst-jpg_p100x100%26_nc_cat%3D105%26ccb%3D1-7%26_nc_sid%3D5f2048%26_nc_eui2%3DAeGirXPT1E56jzWOq3tJatv5HsWuBCzqiQIexa4ELOqJAuncqimdF8tQfaP-IQsyWKB1k2KRJgwsjLnqlMdyG0gS%26_nc_ohc%3Dic3HON0M4RoAb5e2J7a%26_nc_ad%3Dz-m%26_nc_cid%3D0%26_nc_ht%3Dscontent.fdac27-2.fna%26oh%3D00_AfDQQEelZWQ1AL6mhd32t45Lk5ioYN43ZjAj__UW5d_wuQ%26oe%3D661D418E"
+
+}
+
+
+
+export default async function handler(req, res) {
+  const url = req.query.url;
+  
+
+const axios = require("axios");
+
+const postData = async () => {
+  try {
+    const response = await axios.post(
+      "https://replicate-reverse-engineered.vercel.app/post",
+      {dataToPost:{
+        input: {
+          jpeg: 40,
+          image: url,
+          noise: 15,
+          task_type: "Real-World Image Super-Resolution-Large",
+        },
+        stream: false,
+      }, replicateURL: "https://replicate.com/api/models/jingyunliang/swinir/versions/660d922d33153019e8c263a3bba265de882e7f4f70396546b6c9c8f9d47a021a/predictions"}
+    );
+
+    console.log(response.data);
+    let nurl = 'https://replicate.com/api/predictions/' + response.data.id;
+    nurl = 'https://replicate-reverse-engineered.vercel.app/get?url='+nurl
+
+    let isProcessing = true;
+    while (isProcessing) {
+      const { data } = await axios.get(nurl);
+      //console.log(data);
+      if (data.status === "succeeded") {
+        console.log(data._extras.output_files[0]);
+        isProcessing = false;
+        return data._extras.output_files[0];
+      }
+    }
+  } catch (error) {
+    console.error("Error:", error);
+  }
+};
+postData().then((data) => {
+  res.status(200).json({url: data});
+});
+  
+}

postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};

public/apiList.json

@@ -0,0 +1,98 @@
+[
+  {
+    "name": "bing",
+    "url": "/api/bing",
+    "description": "Get response from Bing. Bing is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/bing?prompt=hello"
+  },
+  {
+    "name": "blackbox",
+    "url": "/api/blackbox",
+    "description": "Get response from Blackbox AI Model. Blackbox AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/blackbox?prompt=hello"
+  },
+  {
+    "name": "chatgpt3",
+    "url": "/api/chatgpt3",
+    "description": "Get response from Chatgpt3. Chatgpt3 is a ChatGPT API. It can be used to get responses from ChatGPT. It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/chatgpt3?prompt=hello"
+  },
+  {
+    "name": "chatgpt4",
+    "url": "/api/chatgpt4",
+    "description": "Get response from Chatgpt4. Chatgpt4 is a ChatGPT API. It can be used to get responses from ChatGPT. It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/chatgpt4?prompt=hello"
+  },
+  {
+    "name": "geminiweb",
+    "url": "/api/geminiweb",
+    "description": "Get response from Gemini AI. Gemini AI is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/geminiweb?prompt=hello"
+  },
+  {
+    "name": "huggingchat",
+    "url": "/api/huggingchat",
+    "description": "Get response from huggingchat AI. huggingchat AI is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+    "query": "prompt, web_search",
+    "response": "text",
+    "testURL": "./api/huggingchat?prompt=hello&web_search=false"
+  },
+  {
+    "name": "imagine",
+    "url": "/api/imagine",
+    "description": "Get response from imagine AI Model. imagine AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/imagine?prompt=cute+cat"
+  },
+  {
+    "name": "liner",
+    "url": "/api/liner",
+    "description": "Get response from liner AI. Liner Ai is a very powerful AI that can do a lot of things. It have access to real time internet! It can provide you with the latest news, weather, and more.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/liner?prompt=hello"
+  },
+  {
+    "name": "llama",
+    "url": "/api/llama",
+    "description": "Get response from llama AI Model. llama AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/llama?prompt=hello"
+  },
+  {
+    "name": "mistral",
+    "url": "/api/mistral",
+    "description": "Get response from Mistral AI Model. Mistral AI is a very powerful AI that can do a lot of things.",
+    "query": "prompt",
+    "response": "text",
+    "testURL": "./api/mistral?prompt=hello"
+  },
+  {
+    "name": "pretend",
+    "url": "/api/pretend",
+    "description": "Pretending to be someone, generate response!",
+    "query": "prompt, name",
+    "response": "text",
+    "testURL": "./api/pretend?prompt=hello&name=goku"
+  },
+  {
+    "name": "upscaler",
+    "url": "/api/upscaler",
+    "description": "Get response from Upscaler AI Model. Upscaler AI can restore the image to its original state.",
+    "query": "url",
+    "response": "text",
+    "testURL": "./api/upscaler?url=https%3A%2F%2Fscontent.fdac27-2.fna.fbcdn.net%2Fv%2Ft39.30808-1%2F386334419_843740254146283_32129838220110611_n.jpg%3Fstp%3Dc0.29.100.100a_dst-jpg_p100x100%26_nc_cat%3D105%26ccb%3D1-7%26_nc_sid%3D5f2048%26_nc_eui2%3DAeGirXPT1E56jzWOq3tJatv5HsWuBCzqiQIexa4ELOqJAuncqimdF8tQfaP-IQsyWKB1k2KRJgwsjLnqlMdyG0gS%26_nc_ohc%3Dic3HON0M4RoAb5e2J7a%26_nc_ad%3Dz-m%26_nc_cid%3D0%26_nc_ht%3Dscontent.fdac27-2.fna%26oh%3D00_AfDQQEelZWQ1AL6mhd32t45Lk5ioYN43ZjAj__UW5d_wuQ%26oe%3D661D418E"
+  }
+]

tailwind.config.js

@@ -0,0 +1,18 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
+    "./components/**/*.{js,ts,jsx,tsx,mdx}",
+    "./app/**/*.{js,ts,jsx,tsx,mdx}",
+  ],
+  theme: {
+    extend: {
+      backgroundImage: {
+        "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
+        "gradient-conic":
+          "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
+      },
+    },
+  },
+  plugins: [],
+};