├── Frontend ├── src │ ├── pages │ │ ├── FAQ.jsx │ │ ├── LogoShowcase.jsx │ │ ├── LogoShowcase.css │ │ ├── CodeMetrics.jsx │ │ ├── CodeGenerator.jsx │ │ ├── CodeComplexity.jsx │ │ ├── NotFound.jsx │ │ ├── notFound.jsx │ │ ├── CodeOptimizer.jsx │ │ ├── AiInsights.jsx │ │ └── DependencyScanner.jsx │ ├── components │ │ ├── PageLoaderWrapper.jsx │ │ ├── ScrollToTop.jsx │ │ ├── CodeExamples.jsx │ │ ├── BackToTopButton.jsx │ │ ├── AIDemo.jsx │ │ ├── css │ │ │ ├── NavBar.css │ │ │ ├── Loader.css │ │ │ └── Chatbot.css │ │ ├── LoaderHandle.jsx │ │ ├── AiNetworkHero.jsx │ │ ├── FeedbackButton.jsx │ │ ├── FeedbackForm.jsx │ │ ├── TextInput.jsx │ │ ├── CodeHistory.jsx │ │ ├── ChatComponent.jsx │ │ ├── YouTubeInput.jsx │ │ ├── SummaryDisplay.jsx │ │ ├── MediaUploader.jsx │ │ ├── Chatbot.jsx │ │ └── Footer.jsx │ ├── main.jsx │ ├── utils │ │ ├── scrollbar.js │ │ └── mobileUtils.js │ ├── store │ │ └── auth.jsx │ ├── App.css │ ├── context │ │ └── ThemeContext.jsx │ ├── index.css │ ├── styles │ │ └── glassmorphism.css │ └── App.jsx ├── netlify.toml ├── public │ ├── bulb.png │ ├── send.png │ ├── gssoc logo.png │ ├── close_small_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.png │ ├── omex-logo-mono.svg │ ├── omex-logo-white.svg │ ├── omex-favicon.svg │ ├── omex-icon.svg │ ├── omex-logo.svg │ ├── omex-text-logo-white.svg │ ├── omex-text-logo.svg │ ├── vite.svg │ ├── omex-logo-transparent.svg │ ├── README-logo.md │ └── logo-guidelines.md ├── .env.example ├── .gitignore ├── vite.config.js ├── README.md ├── eslint.config.js ├── package.json ├── index.html └── MOBILE_TOUCH_FIX_PR.md ├── .gitignore ├── .DS_Store ├── BackEnd ├── eng.traineddata ├── server.js ├── .env.example ├── package.json └── src │ ├── app.js │ ├── routes │ ├── ai.routes.js │ └── media.routes.js │ ├── index.html │ └── controllers │ ├── ai.controller.js │ └── media.controller.js ├── c └── omex-logo.svg ├── package.json ├── .github ├── workflows │ ├── pr-create-automate-message.yml │ └── issue-create-automate-message.yml ├── ISSUE_TEMPLATE │ ├── feature_request.md │ ├── style_enhencement.md │ └── bug_report.md └── PULL_REQUEST_TEMPLATE.md ├── License ├── npm-debug.log ├── CONTRIBUTING.md ├── MOBILE_TOUCH_FIX_DOCUMENTATION.md └── ✨ Contributor Covenant Code of Conduct — GSSoC ✨.md /Frontend/src/pages/FAQ.jsx: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Frontend/src/components/PageLoaderWrapper.jsx: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .env 3 | future_scope.txt -------------------------------------------------------------------------------- /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Roshansuthar1105/Omex/HEAD/.DS_Store -------------------------------------------------------------------------------- /Frontend/netlify.toml: -------------------------------------------------------------------------------- 1 | [[redirects]] 2 | from = "/*" 3 | to = "/index.html" 4 | status = 200 5 | -------------------------------------------------------------------------------- /BackEnd/eng.traineddata: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Roshansuthar1105/Omex/HEAD/BackEnd/eng.traineddata -------------------------------------------------------------------------------- /Frontend/public/bulb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Roshansuthar1105/Omex/HEAD/Frontend/public/bulb.png -------------------------------------------------------------------------------- /Frontend/public/send.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Roshansuthar1105/Omex/HEAD/Frontend/public/send.png -------------------------------------------------------------------------------- /Frontend/public/gssoc logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Roshansuthar1105/Omex/HEAD/Frontend/public/gssoc logo.png -------------------------------------------------------------------------------- /Frontend/.env.example: -------------------------------------------------------------------------------- 1 | VITE_BACKEND_URL="https://ai-code-optimisation.onrender.com" 2 | VITE_BACKEND_URL="http://localhost:5050" 3 | VITE_OPENAI_KEY="sk-your-openAi-key" 4 | 5 | -------------------------------------------------------------------------------- /Frontend/public/close_small_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Roshansuthar1105/Omex/HEAD/Frontend/public/close_small_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.png -------------------------------------------------------------------------------- /BackEnd/server.js: -------------------------------------------------------------------------------- 1 | require('dotenv').config() 2 | const app = require('./src/app') 3 | app.listen(process.env.PORT, () => { 4 | console.log(`Server is running on http://localhost:${process.env.PORT}`) 5 | }) -------------------------------------------------------------------------------- /BackEnd/.env.example: -------------------------------------------------------------------------------- 1 | GOOGLE_GEMINI_KEY="AIzaSyCGr2Y4ZHAoY_gwY79UpLZBsWVhCC1B7cE" 2 | PORT=5050 #Check ports if not working! 3 | # for development 4 | FRONT_END_URL="http://localhost:3000" 5 | # for deployment 6 | FRONT_END_URL="https://omexai.netlify.app/" 7 | -------------------------------------------------------------------------------- /Frontend/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { StrictMode } from 'react' 2 | import { createRoot } from 'react-dom/client' 3 | import './index.css' 4 | import App from './App.jsx' 5 | 6 | createRoot(document.getElementById('root')).render( 7 | 8 | 9 | 10 | ) 11 | -------------------------------------------------------------------------------- /Frontend/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | .env 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | future_scope.txt 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /Frontend/src/components/ScrollToTop.jsx: -------------------------------------------------------------------------------- 1 | import { useEffect } from "react"; 2 | import { useLocation } from "react-router-dom"; 3 | 4 | export default function ScrollToTop() { 5 | const { pathname } = useLocation(); 6 | 7 | useEffect(() => { 8 | window.scrollTo({ 9 | top: 0, 10 | left: 0, 11 | behavior: "instant", // change to "smooth" for animation 12 | }); 13 | }, [pathname]); 14 | 15 | return null; 16 | } 17 | -------------------------------------------------------------------------------- /Frontend/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | import tailwindcss from '@tailwindcss/vite' 4 | // https://vite.dev/config/ 5 | export default defineConfig({ 6 | plugins: [tailwindcss(),react()], 7 | resolve: { 8 | alias: { 9 | path: "path-browserify", 10 | }, 11 | }, 12 | server: { 13 | proxy: { 14 | "/api": "http://localhost:5000" 15 | } 16 | } 17 | }) 18 | -------------------------------------------------------------------------------- /Frontend/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /c/omex-logo.svg: -------------------------------------------------------------------------------- 1 | 3 | </>Omex -------------------------------------------------------------------------------- /BackEnd/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "backend", 3 | "version": "1.0.0", 4 | "main": "server.js", 5 | "scripts": { 6 | "test": "echo \"Error: no test specified\" && exit 1", 7 | "start": "node server.js", 8 | "server": "nodemon server.js" 9 | }, 10 | "keywords": [], 11 | "author": "", 12 | "license": "ISC", 13 | "description": "", 14 | "dependencies": { 15 | "@google/generative-ai": "^0.21.0", 16 | "axios": "^1.6.7", 17 | "cors": "^2.8.5", 18 | "dotenv": "^16.6.1", 19 | "express": "^4.21.2", 20 | "multer": "^1.4.5-lts.1", 21 | "nodemon": "^3.1.9", 22 | "pdf-parse": "^1.1.1", 23 | "tesseract.js": "^5.0.5" 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /Frontend/src/utils/scrollbar.js: -------------------------------------------------------------------------------- 1 | let scrollbarTimeout; 2 | const scrollContainer = document.body; 3 | 4 | function showScrollbar() { 5 | scrollContainer.classList.add("show-scrollbar"); 6 | clearTimeout(scrollbarTimeout); 7 | scrollbarTimeout = setTimeout(() => { 8 | scrollContainer.classList.remove("show-scrollbar"); 9 | }, 2000); // Hide after 2s 10 | } 11 | 12 | // Show only when scrolling 13 | window.addEventListener("scroll", showScrollbar); 14 | 15 | // Show when mouse is near right edge (20px zone) 16 | window.addEventListener("mousemove", (e) => { 17 | const nearRightEdge = window.innerWidth - e.clientX < 20; 18 | if (nearRightEdge) { 19 | showScrollbar(); 20 | } 21 | }); 22 | -------------------------------------------------------------------------------- /Frontend/public/omex-logo-mono.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /Frontend/public/omex-logo-white.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /Frontend/src/pages/LogoShowcase.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { useTheme } from "../context/ThemeContext"; 3 | import "./LogoShowcase.css"; 4 | 5 | const LogoShowcase = () => { 6 | const { isDark } = useTheme(); 7 | return ( 8 |
9 | Omex AI Logo 14 |

Welcome to the Omex Logo Showcase

15 |

This page demonstrates the animated, theme-adaptive Omex logo. Try switching between light and dark mode!

16 |
17 | ); 18 | }; 19 | 20 | export default LogoShowcase; 21 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "code-review", 3 | "version": "1.0.0", 4 | "description": "��#\u0000 \u0000A\u0000i\u0000-\u0000c\u0000o\u0000d\u0000e\u0000-\u0000o\u0000p\u0000t\u0000i\u0000m\u0000i\u0000s\u0000a\u0000t\u0000i\u0000o\u0000n\u0000\r\u0000 \u0000", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "frontend": "cd ./Frontend && npm run dev", 9 | "backend": "cd ./BackEnd && npm run server", 10 | "dev": "npm run frontend && npm run backend" 11 | }, 12 | "keywords": [], 13 | "author": "", 14 | "license": "ISC", 15 | "dependencies": { 16 | "@emailjs/browser": "^4.4.1", 17 | "framer-motion": "^12.23.12", 18 | "react-icons": "^5.5.0" 19 | }, 20 | "devDependencies": { 21 | "vite": "^7.1.5" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /BackEnd/src/app.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const cors = require('cors'); 3 | const path = require('path'); 4 | const aiRoutes = require('./routes/ai.routes'); 5 | const mediaRoutes = require('./routes/media.routes'); 6 | 7 | const app = express(); 8 | 9 | // Middleware 10 | app.use(cors()); 11 | app.use(express.json()); 12 | 13 | // Static files 14 | app.use('/uploads', express.static(path.join(__dirname, '..', 'uploads'))); 15 | 16 | // Routes 17 | app.get('/', (req, res) => { 18 | res.sendFile(__dirname + '/index.html'); 19 | }); 20 | 21 | app.use('/ai', aiRoutes); // -> /ai/code-metrics-analyzer 22 | app.use('/media', mediaRoutes); // -> /media/... 23 | // Using the same /ai prefix for consistency 24 | 25 | // Error handling middleware 26 | app.use((err, req, res, next) => { 27 | console.error(err.stack); 28 | res.status(500).send('Something broke!'); 29 | }); 30 | 31 | module.exports = app; -------------------------------------------------------------------------------- /BackEnd/src/routes/ai.routes.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const aiController = require("../controllers/ai.controller") 3 | 4 | const router = express.Router(); 5 | 6 | router.post("/get-review", aiController.getReview) 7 | router.post("/get-code", aiController.getCode) 8 | router.post("/get-complexity", aiController.getComplexity) 9 | router.post("/compare-code", aiController.compareCode) 10 | 11 | // New routes for code tools 12 | router.post("/generate-test-cases", aiController.getTestCases) 13 | router.post("/beautify-code", aiController.beautifyCode) 14 | router.post("/debug-code", aiController.debugCode) 15 | router.post("/analyze-performance", aiController.analyzePerformance) 16 | router.post("/analyze-security", aiController.analyzeSecurity); 17 | router.post("/dependency-scanner", aiController.scanDependencies); 18 | router.post("/code-metrics-analyzer", aiController.codeMetricsAnalyzer); 19 | router.post("/explain-code", aiController.explainCode); 20 | 21 | 22 | module.exports = router; -------------------------------------------------------------------------------- /.github/workflows/pr-create-automate-message.yml: -------------------------------------------------------------------------------- 1 | name: Auto Comment on PR 2 | 3 | on: 4 | pull_request_target: 5 | types: [opened] 6 | 7 | permissions: 8 | issues: write 9 | pull-requests: write 10 | 11 | jobs: 12 | comment: 13 | runs-on: ubuntu-latest 14 | steps: 15 | - name: Comment on PR 16 | uses: actions/github-script@v6 17 | with: 18 | script: | 19 | const prNumber = context.issue.number; 20 | 21 | const commentBody = `### Thanks for creating a PR for your Issue! ☺️\n\nWe'll review it as soon as possible.\nIn the meantime, please double-check the **file changes** and ensure that **all commits** are accurate.\n\nIf there are any **unresolved review comments**, feel free to resolve them. Thank you. @Roshansuthar1105 🙌🏼`; 22 | 23 | await github.rest.issues.createComment({ 24 | owner: context.repo.owner, 25 | repo: context.repo.repo, 26 | issue_number: prNumber, 27 | body: commentBody 28 | }); 29 | 30 | console.log('Comment added successfully.'); -------------------------------------------------------------------------------- /Frontend/src/store/auth.jsx: -------------------------------------------------------------------------------- 1 | // Frontend/src/store/auth.jsx 2 | 3 | import React, { createContext, useContext, useState } from 'react'; 4 | 5 | // Create AuthContext 6 | const AuthContext = createContext(); 7 | 8 | // Create URLContext 9 | const URLContext = createContext(); 10 | 11 | // AuthProvider component 12 | export const AuthProvider = ({ children }) => { 13 | const [auth, setAuth] = useState(null); // Manage authentication state 14 | 15 | return ( 16 | 17 | {children} 18 | 19 | ); 20 | }; 21 | 22 | // URLProvider component 23 | export const URLProvider = ({ children }) => { 24 | const [url, setUrl] = useState(''); // Manage URL state 25 | 26 | return ( 27 | 28 | {children} 29 | 30 | ); 31 | }; 32 | 33 | // Custom hooks to use the contexts 34 | export const useAuth = () => useContext(AuthContext); 35 | export const useURL = () => useContext(URLContext); 36 | 37 | // ... existing code ... -------------------------------------------------------------------------------- /Frontend/public/omex-favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /.github/workflows/issue-create-automate-message.yml: -------------------------------------------------------------------------------- 1 | name: Auto Comment on Issue 2 | 3 | on: 4 | issues: 5 | types: [opened] 6 | 7 | permissions: 8 | issues: write 9 | 10 | jobs: 11 | comment: 12 | runs-on: ubuntu-latest 13 | steps: 14 | - name: Add Comment to Issue 15 | uses: actions/github-script@v6 16 | with: 17 | script: | 18 | const issueNumber = context.issue.number; 19 | const commentBody = `### Thank you for raising this issue!\n We'll review it as soon as possible. We truly appreciate your contributions! ✨\n\n> Meanwhile make sure you've visited the README.md, CONTRIBUTING.md, and CODE_OF_CONDUCT.md before creating a PR for this. Also, please do NOT create a PR until this issue has been assigned to you. Thank you @Roshansuthar1105 😊`; 20 | 21 | await github.rest.issues.createComment({ 22 | owner: context.repo.owner, 23 | repo: context.repo.repo, 24 | issue_number: issueNumber, 25 | body: commentBody 26 | }); 27 | 28 | console.log('Comment added successfully.'); -------------------------------------------------------------------------------- /License: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | Copyright © 2025 Roshansuthar1105 3 | 4 | 5 | 6 | 7 | 8 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 9 | 10 | 11 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 12 | 13 | 14 | THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 15 | -------------------------------------------------------------------------------- /Frontend/public/omex-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /Frontend/public/omex-logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /Frontend/eslint.config.js: -------------------------------------------------------------------------------- 1 | import js from '@eslint/js' 2 | import globals from 'globals' 3 | import react from 'eslint-plugin-react' 4 | import reactHooks from 'eslint-plugin-react-hooks' 5 | import reactRefresh from 'eslint-plugin-react-refresh' 6 | 7 | export default [ 8 | { ignores: ['dist'] }, 9 | { 10 | files: ['**/*.{js,jsx}'], 11 | languageOptions: { 12 | ecmaVersion: 2020, 13 | globals: globals.browser, 14 | parserOptions: { 15 | ecmaVersion: 'latest', 16 | ecmaFeatures: { jsx: true }, 17 | sourceType: 'module', 18 | }, 19 | }, 20 | settings: { react: { version: '18.3' } }, 21 | plugins: { 22 | react, 23 | 'react-hooks': reactHooks, 24 | 'react-refresh': reactRefresh, 25 | }, 26 | rules: { 27 | ...js.configs.recommended.rules, 28 | ...react.configs.recommended.rules, 29 | ...react.configs['jsx-runtime'].rules, 30 | ...reactHooks.configs.recommended.rules, 31 | 'react/jsx-no-target-blank': 'off', 32 | 'react-refresh/only-export-components': [ 33 | 'warn', 34 | { allowConstantExport: true }, 35 | ], 36 | }, 37 | }, 38 | ] 39 | -------------------------------------------------------------------------------- /Frontend/src/pages/LogoShowcase.css: -------------------------------------------------------------------------------- 1 | .logo-showcase-container { 2 | display: flex; 3 | flex-direction: column; 4 | align-items: center; 5 | justify-content: center; 6 | min-height: 70vh; 7 | background: transparent; 8 | } 9 | 10 | .logo-animated { 11 | height: 200px; 12 | width: auto; 13 | margin-bottom: 24px; 14 | animation: logo-bounce 2s infinite alternate cubic-bezier(0.68, -0.55, 0.27, 1.55); 15 | filter: drop-shadow(0 4px 16px rgba(0,0,0,0.12)); 16 | transition: filter 0.3s; 17 | } 18 | 19 | .logo-animated:hover { 20 | filter: drop-shadow(0 8px 32px rgba(0,0,0,0.18)); 21 | animation-play-state: paused; 22 | } 23 | 24 | @keyframes logo-bounce { 25 | 0% { 26 | transform: translateY(0) scale(1); 27 | } 28 | 60% { 29 | transform: translateY(-18px) scale(1.08); 30 | } 31 | 100% { 32 | transform: translateY(-8px) scale(1.04); 33 | } 34 | } 35 | 36 | .logo-title { 37 | font-size: 2rem; 38 | font-weight: bold; 39 | margin-bottom: 12px; 40 | color: var(--logo-title-color, #2563eb); 41 | text-align: center; 42 | } 43 | 44 | .logo-desc { 45 | font-size: 1.1rem; 46 | color: #666; 47 | max-width: 420px; 48 | text-align: center; 49 | } 50 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: "✨ Feature Request" 3 | about: Suggest an idea for Codify 4 | title: "Feat: [Brief Description]" 5 | labels: "enhancement" 6 | assignees: "" 7 | --- 8 | 9 | ## 🚀 Is your feature request related to a problem? 10 | 11 | - Problem: [Describe the pain point] 12 | 13 | ## 💡 Proposed Solution 14 | 15 | - Solution: [Detailed description] 16 | - Technical Notes (optional): [API changes, database needs, etc.] 17 | 18 | ## 🔍 Alternatives Considered 19 | 20 | 1. Alternative A: [Description + why it's less ideal] 21 | 2. Alternative B: [Description + why it's less ideal] 22 | 23 | ## 📐 Mockups & Examples 24 | 25 | - [ ] Attach sketch/Screenshot 26 | - [ ] Link to similar features in other apps 27 | 28 | ## 🧩 Potential Impact 29 | 30 | - Target Users: [Students/Teachers/Admins] 31 | - Value: [Time saved, improved UX, etc.] 32 | 33 | ## 🌱 Additional Context 34 | 35 | - Related Features: #[issue_number] 36 | - Technical Constraints: [If known] 37 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/style_enhencement.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: "🎨 Style Enhancement" 3 | about: Suggest UI/UX or design improvements for Codify (MERN + TailwindCSS ) 4 | title: "Style: [Brief Description]" 5 | labels: "style enhencement" 6 | assignees: "" 7 | --- 8 | 9 | ## ✨ Current Style Issue 10 | 11 | - Problem: [Describe the UI/UX or styling issue] 12 | 13 | ## 💡 Proposed Style Changes 14 | 15 | - Suggested Change: [Typography, spacing, colors, etc.] 16 | - Technical Notes (optional): [Tailwind classes, JSX components, responsive breakpoints] 17 | - add example (optional) 18 | 19 | ## 🔍 Alternatives Considered 20 | 21 | 22 | 23 | ## 📐 Mockups & Visual References 24 | 25 | - [ ] Attach Figma/Sketch/Screenshot 26 | - [ ] Link to similar UI in other apps 27 | 28 | ## 🧩 Impact on UI/UX 29 | 30 | - Value: [Better readability, smoother navigation, accessibility improvements] 31 | 32 | ## 🌱 Additional Context 33 | 34 | - Related Components: #[issue_number] 35 | - Technical Constraints: [Browser compatibility, Tailwind config, etc.] 36 | -------------------------------------------------------------------------------- /Frontend/src/pages/CodeMetrics.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import CodeMetricsAnalyzer from "../components/CodeMetricsAnalyzer"; 3 | import Loader from "../components/Loader"; 4 | 5 | export default function CodeMetrics() { 6 | 7 | const [scanning, setScanning] = useState(false); 8 | if (loading) { 9 | return ( 10 |
15 | {/* */} 21 |
22 | ); 23 | } 24 | 25 | return ( 26 |
27 |

28 | OMEX - Code Metrics Analyzer 29 |

30 |
31 | 34 |
35 |
36 | ); 37 | } 38 | -------------------------------------------------------------------------------- /Frontend/public/omex-text-logo-white.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | OMEX 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /Frontend/src/pages/CodeGenerator.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { useState, useEffect } from 'react'; 3 | import CodeEditor from '../components/CodeEditor' 4 | import Loader from '../components/Loader' 5 | import FeedbackButton from '../components/FeedbackButton' 6 | import { useTheme } from '../context/ThemeContext'; 7 | 8 | 9 | function CodeGenerator() { 10 | const { isDark } = useTheme(); 11 | 12 | const [loading, setLoading] = useState(true); 13 | const URL=`${import.meta.env.VITE_BACKEND_URL}/ai/get-code` 14 | const prompt=`write a c++ code to find factorial of a given number` 15 | useEffect(() => { 16 | const timer = setTimeout(() => { 17 | setLoading(false); 18 | window.scrollTo(0, 0); 19 | }, 1500); 20 | return () => clearTimeout(timer); 21 | }, []); 22 | if (loading) { 23 | return ( 24 |
25 | {/* */} 26 |
27 | ); 28 | } 29 | return ( 30 | <> 31 |
32 | 33 |
34 | 35 | {/* Feedback Button */} 36 | 37 | 38 | ) 39 | } 40 | // Omex 41 | export default CodeGenerator -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: "📦 Pull Request" 3 | about: Submit changes for review 4 | title: "PR: [Brief Description]" 5 | labels: "" 6 | assignees: "" 7 | --- 8 | 9 | ## 📌 Linked Issue 10 | 11 | - [ ] Connected to #issue_number 12 | --- 13 | 14 | ## 🛠 Changes Made 15 | 16 | - Added: [Description] 17 | - Fixed: [Description] 18 | - Updated: [Description] 19 | 20 | --- 21 | ## 🧪 Testing 22 | 23 | - [ ] Ran unit tests (`npm test`) 24 | - [ ] Tested manually (describe below): 25 | - Test case 1: [Steps + Expected Result] 26 | - Test case 2: [Steps + Expected Result] 27 | 28 | --- 29 | ## 📸 UI Changes (if applicable) 30 | 31 | | Before | After | 32 | |--------|-------| 33 | | [Image] | [Image] | 34 | 35 | --- 36 | ## 📝 Documentation Updates 37 | - [ ] Updated README/docs 38 | - [ ] Added code comments 39 | --- 40 | 41 | ## ✅ Checklist 42 | - [ ] Created a new branch for PR 43 | - [ ] Have stared the repository 44 | - [ ] Follows [JavaScript Styleguide](CONTRIBUTING.md#javascript-styleguide) 45 | - [ ] No console warnings/errors 46 | - [ ] Commit messages follow [Git Guidelines](CONTRIBUTING.md#git-commit-messages) 47 | 48 | ## 💡 Additional Notes (If any) 49 | 50 | -------------------------------------------------------------------------------- /Frontend/public/omex-text-logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | OMEX 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /Frontend/public/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Frontend/src/App.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | @keyframes typing { 3 | from { width: 0 } 4 | to { width: 100% } 5 | } 6 | 7 | @keyframes blink { 8 | 0%, 100% { border-color: transparent } 9 | 50% { border-color: currentColor } 10 | } 11 | 12 | @keyframes hideCursor { 13 | to { border-color: transparent } 14 | } 15 | 16 | 17 | /* * { 18 | margin: 0%; 19 | padding: 0%; 20 | box-sizing: border-box; 21 | } 22 | 23 | html, 24 | body, 25 | #root { 26 | height: 100%; 27 | width: 100%; 28 | } 29 | 30 | main { 31 | height: 100%; 32 | width: 100%; 33 | padding: 1.5rem; 34 | display: flex; 35 | gap: 1rem; 36 | } 37 | 38 | main .left, 39 | main .right { 40 | height: 100%; 41 | flex-basis: 50%; 42 | border-radius: 0.7rem; 43 | } 44 | 45 | main .left { 46 | background-color: #000000; 47 | position: relative; 48 | } 49 | 50 | .left .code, 51 | .code pre, 52 | .code pre code { 53 | height: 100%; 54 | width: 100%; 55 | margin: 0; 56 | border-radius: 0.7rem; 57 | background-color: #0c0c0c; 58 | } 59 | 60 | main .left .review { 61 | position: absolute; 62 | bottom: 1rem; 63 | right: 1rem; 64 | background-color: rgb(219, 219, 255); 65 | color: #000000; 66 | padding: 0.5rem 2rem; 67 | font-weight: 500; 68 | cursor: pointer; 69 | user-select: none; 70 | border-radius: 0.7rem; 71 | } 72 | 73 | 74 | main .right { 75 | background-color: #343434; 76 | padding: 1rem 2rem; 77 | font-size: 1.5rem; 78 | overflow: auto; 79 | } */ -------------------------------------------------------------------------------- /Frontend/public/omex-logo-transparent.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /BackEnd/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | AI Code Optimizer 7 | 37 | 38 | 39 |
40 |
41 |

AI Code Optimizer

42 |
43 |
44 |

This backend app uses AI to optimize the provided code for better performance, readability, and maintainability.

45 |

Simply provide your code, and our AI will review and optimize it for you.

46 |
47 |
48 | 49 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /Frontend/src/pages/CodeComplexity.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { useState, useEffect } from 'react'; 3 | import CodeEditor from '../components/CodeEditor' 4 | import {useTheme} from '../context/ThemeContext'; 5 | import Loader from '../components/Loader'; 6 | import FeedbackButton from '../components/FeedbackButton'; 7 | 8 | function CodeComplexity() { 9 | const {isDark} = useTheme(); 10 | const [loading, setLoading] = useState(true); 11 | useEffect(() => { 12 | const timer = setTimeout(() => { 13 | setLoading(false); 14 | window.scrollTo(0, 0); 15 | }, 1500); 16 | return () => clearTimeout(timer); 17 | }, []); 18 | // const URL = "http://localhost:5000/ai/get-complexity" 19 | const URL=`${import.meta.env.VITE_BACKEND_URL}/ai/get-complexity` 20 | const prompt= 21 | `int fact(int n){ 22 | if(n<=1){ 23 | return 1; 24 | }else{ 25 | return n*fact(n-1); 26 | } 27 | }`; 28 | if (loading) { 29 | return ( 30 |
31 | {/* */} 32 |
33 | ); 34 | } 35 | return ( 36 |
37 | 38 | 39 | {/* Feedback Button */} 40 | 41 |
42 | ) 43 | } 44 | 45 | export default CodeComplexity -------------------------------------------------------------------------------- /Frontend/src/context/ThemeContext.jsx: -------------------------------------------------------------------------------- 1 | import React, { createContext, useState, useContext, useEffect } from 'react'; 2 | 3 | const ThemeContext = createContext(); 4 | 5 | export const ThemeProvider = ({ children }) => { 6 | // Check if theme is stored in localStorage, default to 'dark' 7 | const [theme, setTheme] = useState(() => { 8 | const savedTheme = localStorage.getItem('theme'); 9 | return savedTheme || 'dark'; 10 | }); 11 | 12 | const isDark = theme === 'dark'; 13 | 14 | // Update localStorage when theme changes 15 | useEffect(() => { 16 | localStorage.setItem('theme', theme); 17 | 18 | // Apply theme to document body 19 | if (isDark) { 20 | document.body.classList.add('dark-mode'); 21 | document.body.classList.remove('light-mode'); 22 | } else { 23 | document.body.classList.add('light-mode'); 24 | document.body.classList.remove('dark-mode'); 25 | } 26 | }, [theme, isDark]); 27 | 28 | // Toggle theme function 29 | const toggleTheme = () => { 30 | setTheme(prevTheme => prevTheme === 'dark' ? 'light' : 'dark'); 31 | }; 32 | 33 | return ( 34 | 35 | {children} 36 | 37 | ); 38 | }; 39 | 40 | // Custom hook to use the theme context 41 | export const useTheme = () => { 42 | const context = useContext(ThemeContext); 43 | if (context === undefined) { 44 | throw new Error('useTheme must be used within a ThemeProvider'); 45 | } 46 | return context; 47 | }; 48 | 49 | export default ThemeContext; 50 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: 🐛 Bug Report 3 | about: Report unexpected behavior or errors 4 | title: "Bug: [Short Description]" 5 | labels: bug 6 | assignees: "" 7 | --- 8 | 9 | ### 🐞 Describe the Bug 10 | *A clear, one-sentence summary of the issue.* 11 | Example: "Logged-in users see a 500 error when accessing the dashboard." 12 | 13 | ### 🔍 Steps to Reproduce 14 | 1. Go to '...' 15 | 2. Click on '....' 16 | 3. Scroll to '....' 17 | 4. See error 18 | 19 | **Example:** 20 | 1. Log in as a student 21 | 2. Navigate to /courses/python 22 | 3. Click "Start Exercise" button 23 | 4. Blank screen appears 24 | 25 | ### ✅ Expected vs 🚫 Actual Behavior 26 | - **Expected:** What should happen? 27 | Example: "Exercise instructions should load." 28 | - **Actual:** What happens instead? 29 | Example: "Blank white screen with console error 'TypeError: undefined'." 30 | 31 | ### 📸 Evidence 32 | *(Please attach:)* 33 | - [ ] Screenshot(s) 34 | - [ ] Console errors (F12 → Console) 35 | - [ ] Network logs (F12 → Network) 36 | 37 | ### 💻 Environment 38 | - **Device:** [e.g., iPhone 14, Windows PC] 39 | - **OS:** [e.g., iOS 16.5, Windows 11] 40 | - **Browser:** [e.g., Chrome 116, Safari 16] 41 | - **Codify Version:** [e.g., v2.3.0] 42 | 43 | ### 📦 Additional Context 44 | - Does this happen consistently? [Yes/No] 45 | - Related issues: #[issue-number] 46 | - Workarounds (if any): 47 | 48 | --- 49 | 50 | **Tip:** Use code blocks for errors: 51 | ```bash 52 | Error: Cannot read property 'id' of undefined (main.js:42) 53 | ``` 54 | 55 | 56 | --- 57 | -------------------------------------------------------------------------------- /Frontend/public/README-logo.md: -------------------------------------------------------------------------------- 1 | # Omex AI Branding Assets 2 | 3 | This directory contains the official Omex AI logo in various formats optimized for different use cases. 4 | 5 | ## Logo Files 6 | 7 | | Filename | Format | Purpose | Description | 8 | |----------|--------|---------|-------------| 9 | | `omex-logo.svg` | SVG | Primary logo | Full-color logo with blue background for general use | 10 | | `omex-logo-transparent.svg` | SVG | Versatile use | Transparent background version for use on colored backgrounds | 11 | | `omex-logo-mono.svg` | SVG | Print/special cases | Monochrome (black) version for print or special applications | 12 | | `omex-logo-white.svg` | SVG | Dark backgrounds | White version for use on dark backgrounds | 13 | | `omex-icon.svg` | SVG | Icon-only | Compact icon-only version without text | 14 | | `omex-favicon.svg` | SVG | Browser favicon | Compact icon for browser tabs and bookmarks | 15 | 16 | ## Brand Colors 17 | 18 | The Omex AI brand uses the following colors: 19 | - Primary Blue: `#2563EB` 20 | - Accent Purple: `#8B5CF6` 21 | - White: `#FFFFFF` 22 | - Black: `#000000` 23 | 24 | ## Usage Guidelines 25 | 26 | 1. **Do not modify** the logo files - use them as provided 27 | 2. When scaling, maintain the aspect ratio to avoid distortion 28 | 3. Ensure adequate spacing around the logo 29 | 4. Use the appropriate version for each context (e.g., transparent for dark backgrounds) 30 | 31 | ## Integration Instructions 32 | 33 | For detailed integration instructions, please refer to the `logo-guidelines.md` file in this directory. 34 | 35 | ## Contact 36 | 37 | For questions about logo usage or to request additional formats, please contact the Omex AI design team. 38 | -------------------------------------------------------------------------------- /Frontend/src/components/CodeExamples.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { FaCode } from 'react-icons/fa'; 3 | 4 | const CodeExamples = ({ examples, onSelect, isDark = true }) => { 5 | return ( 6 |
7 |
8 | 9 |

10 | Code Examples 11 |

12 |
13 | 14 |
15 | {examples.map((example, index) => ( 16 |
onSelect(example.code)} 24 | > 25 |

26 | {example.name} 27 |

28 |
31 | {example.code.substring(0, 100)} 32 | {example.code.length > 100 && '...'} 33 |
34 |
35 | ))} 36 |
37 |
38 | ); 39 | }; 40 | 41 | export default CodeExamples; 42 | -------------------------------------------------------------------------------- /Frontend/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "frontend", 3 | "private": true, 4 | "version": "0.0.0", 5 | "type": "module", 6 | "scripts": { 7 | "dev": "vite", 8 | "build": "vite build", 9 | "lint": "eslint .", 10 | "preview": "vite preview" 11 | }, 12 | "dependencies": { 13 | "@emailjs/browser": "^4.4.1", 14 | "@gsap/react": "^2.1.2", 15 | "@monaco-editor/react": "^4.7.0", 16 | "@tailwindcss/vite": "^4.0.6", 17 | "axios": "^1.7.9", 18 | "cors": "^2.8.5", 19 | "dotenv": "^16.6.1", 20 | "framer-motion": "^12.23.12", 21 | "gsap": "^3.13.0", 22 | "highlight.js": "^11.11.1", 23 | "jszip": "^3.10.1", 24 | "lucide-react": "^0.542.0", 25 | "marked": "^15.0.6", 26 | "openai": "^5.23.1", 27 | "path-browserify": "^1.0.1", 28 | "prismjs": "^1.29.0", 29 | "react": "^19.0.0", 30 | "react-dom": "^19.0.0", 31 | "react-dropzone": "^14.3.8", 32 | "react-hot-toast": "^2.5.2", 33 | "react-icons": "^5.4.0", 34 | "react-markdown": "^9.0.3", 35 | "react-router-dom": "^7.2.0", 36 | "react-simple-code-editor": "^0.14.1", 37 | "react-speech-recognition": "^4.0.1", 38 | "recharts": "^3.2.1", 39 | "rehype-highlight": "^7.0.2", 40 | "tailwindcss": "^4.0.6", 41 | "typhonjs-escomplex": "^0.1.0" 42 | }, 43 | "devDependencies": { 44 | "@eslint/js": "^9.19.0", 45 | "@types/react": "^19.0.8", 46 | "@types/react-dom": "^19.0.3", 47 | "@vitejs/plugin-react": "^4.7.0", 48 | "eslint": "^9.19.0", 49 | "eslint-plugin-react": "^7.37.4", 50 | "eslint-plugin-react-hooks": "^5.0.0", 51 | "eslint-plugin-react-refresh": "^0.4.18", 52 | "globals": "^15.14.0", 53 | "tailwindcss-patterns": "^0.1.2", 54 | "vite": "^6.1.0" 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /Frontend/src/components/BackToTopButton.jsx: -------------------------------------------------------------------------------- 1 | // src/components/BackToTopButton.jsx 2 | import React, { useState, useEffect } from "react"; 3 | 4 | const BackToTopButton = () => { 5 | const [isVisible, setIsVisible] = useState(false); 6 | 7 | useEffect(() => { 8 | const handleScroll = () => { 9 | setIsVisible(window.scrollY > 300); 10 | }; 11 | 12 | window.addEventListener("scroll", handleScroll, { passive: true }); 13 | return () => window.removeEventListener("scroll", handleScroll); 14 | }, []); 15 | 16 | const scrollToTop = () => { 17 | window.scrollTo({ 18 | top: 0, 19 | behavior: "smooth", 20 | }); 21 | }; 22 | 23 | return ( 24 | 56 | ); 57 | }; 58 | 59 | export default BackToTopButton; 60 | -------------------------------------------------------------------------------- /Frontend/src/pages/NotFound.jsx: -------------------------------------------------------------------------------- 1 | import { Link } from "react-router-dom"; 2 | 3 | export default function NotFound() { 4 | return ( 5 |
6 |
7 | {/* Big 404 Heading */} 8 |

9 | 404 10 |

11 | 12 | {/* Sub-heading */} 13 |

14 | Oops! Page Not Found 15 |

16 | 17 | {/* Short description */} 18 |

19 | The page you are looking for doesn’t exist or has been moved. 20 | Let’s get you back on track. 21 |

22 | 23 | {/* Action buttons */} 24 |
25 | 29 | ⬅ Go Back Home 30 | 31 | 32 | 36 | 📩 Contact Support 37 | 38 |
39 | 40 | {/* Optional: Search bar (if you want) */} 41 | {/* 42 |
43 | 48 |
49 | */} 50 |
51 |
52 | ); 53 | } 54 | -------------------------------------------------------------------------------- /Frontend/src/pages/notFound.jsx: -------------------------------------------------------------------------------- 1 | import { Link } from "react-router-dom"; 2 | 3 | export default function NotFound() { 4 | return ( 5 |
6 |
7 | {/* Big 404 Heading */} 8 |

9 | 404 10 |

11 | 12 | {/* Sub-heading */} 13 |

14 | Oops! Page Not Found 15 |

16 | 17 | {/* Short description */} 18 |

19 | The page you are looking for doesn’t exist or has been moved. 20 | Let’s get you back on track. 21 |

22 | 23 | {/* Action buttons */} 24 |
25 | 29 | ⬅ Go Back Home 30 | 31 | 32 | 36 | 📩 Contact Support 37 | 38 |
39 | 40 | {/* Optional: Search bar (if you want) */} 41 | {/* 42 |
43 | 48 |
49 | */} 50 |
51 |
52 | ); 53 | } 54 | -------------------------------------------------------------------------------- /BackEnd/src/routes/media.routes.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Media Routes 3 | * This file contains the routes for handling media files 4 | */ 5 | 6 | const express = require('express'); 7 | const multer = require('multer'); 8 | const path = require('path'); 9 | const fs = require('fs'); 10 | const mediaController = require('../controllers/media.controller'); 11 | 12 | // Create uploads directory if it doesn't exist 13 | const uploadsDir = path.join(__dirname, '..', '..', 'uploads'); 14 | if (!fs.existsSync(uploadsDir)) { 15 | fs.mkdirSync(uploadsDir, { recursive: true }); 16 | } 17 | 18 | // Configure multer for file uploads 19 | const storage = multer.diskStorage({ 20 | destination: function (req, file, cb) { 21 | cb(null, uploadsDir); 22 | }, 23 | filename: function (req, file, cb) { 24 | const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9); 25 | cb(null, file.fieldname + '-' + uniqueSuffix + path.extname(file.originalname)); 26 | } 27 | }); 28 | 29 | // File filter to accept only certain file types 30 | const fileFilter = (req, file, cb) => { 31 | // Accept images, PDFs, videos, and text files 32 | if ( 33 | file.mimetype.startsWith('image/') || 34 | file.mimetype === 'application/pdf' || 35 | file.mimetype.startsWith('video/') || 36 | file.mimetype === 'text/plain' || 37 | file.originalname.endsWith('.txt') || 38 | file.originalname.endsWith('.md') 39 | ) { 40 | cb(null, true); 41 | } else { 42 | cb(new Error('Unsupported file type'), false); 43 | } 44 | }; 45 | 46 | // Configure multer upload 47 | const upload = multer({ 48 | storage: storage, 49 | fileFilter: fileFilter, 50 | limits: { 51 | fileSize: 10 * 1024 * 1024 // 10MB limit 52 | } 53 | }); 54 | 55 | const router = express.Router(); 56 | 57 | // Routes for summarizing content 58 | // The upload.single middleware will be skipped if no file is uploaded 59 | router.post('/summarize-content', upload.single('file'), mediaController.summarizeContent); 60 | 61 | // Dedicated routes for specific input types (for clarity and potential future enhancements) 62 | router.post('/summarize-text', mediaController.summarizeTextInput); 63 | router.post('/summarize-youtube', mediaController.summarizeYouTubeUrl); 64 | 65 | module.exports = router; 66 | -------------------------------------------------------------------------------- /Frontend/src/components/AIDemo.jsx: -------------------------------------------------------------------------------- 1 | import { useState } from "react"; 2 | import OpenAI from "openai"; 3 | import SpeechRecognition, { useSpeechRecognition } from "react-speech-recognition"; 4 | 5 | export default function AIDemo() { 6 | const client = new OpenAI({ 7 | apiKey: import.meta.env.VITE_OPENAI_KEY, 8 | dangerouslyAllowBrowser: true, // for quick demo only 9 | }); 10 | 11 | // ---------- State ---------- 12 | 13 | const { transcript, listening, resetTranscript } = useSpeechRecognition(); 14 | 15 | // ---------- Handlers ---------- 16 | const startListening = () => 17 | SpeechRecognition.startListening({ continuous: true, language: "en-US" }); 18 | 19 | // ---------- UI ---------- 20 | return ( 21 |
22 |

23 | 🚀 AI Power Demo 24 |

25 | {/* ===== Speech Recognition ===== */} 26 |
27 |

Speech Recognition

28 |
29 | 35 | 41 | 47 |
48 |

49 | Status: {listening ? "Listening..." : "Stopped"} 50 |

51 |
52 |

Your Text will appear Here

53 |

{transcript}

54 |
55 |
56 |
57 | ); 58 | } 59 | -------------------------------------------------------------------------------- /Frontend/src/components/css/NavBar.css: -------------------------------------------------------------------------------- 1 | @keyframes slideInRight { 2 | from { 3 | opacity: 0; 4 | transform: translateX(20px); 5 | } 6 | to { 7 | opacity: 1; 8 | transform: translateX(0); 9 | } 10 | } 11 | 12 | @keyframes glow { 13 | 0%, 100% { 14 | box-shadow: 0 0 15px rgba(147,51,234,0.5), 15 | 0 0 30px rgba(147,51,234,0.3); 16 | } 17 | 50% { 18 | box-shadow: 0 0 25px rgba(147,51,234,0.8), 19 | 0 0 40px rgba(147,51,234,0.5); 20 | } 21 | } 22 | 23 | .animate-in { 24 | animation: slideInRight 0.3s ease-out forwards; 25 | } 26 | 27 | .slide-in-from-top-2 { 28 | animation: slideInFromTop 0.2s ease-out forwards; 29 | } 30 | 31 | @keyframes slideInFromTop { 32 | from { 33 | opacity: 0; 34 | transform: translateY(-8px); 35 | } 36 | to { 37 | opacity: 1; 38 | transform: translateY(0); 39 | } 40 | } 41 | 42 | /* Ensure backdrop blur works properly */ 43 | .backdrop-blur-xl { 44 | backdrop-filter: blur(24px); 45 | -webkit-backdrop-filter: blur(24px); 46 | } 47 | 48 | .backdrop-blur-md { 49 | backdrop-filter: blur(12px); 50 | -webkit-backdrop-filter: blur(12px); 51 | } 52 | 53 | .backdrop-blur-2xl { 54 | backdrop-filter: blur(40px); 55 | -webkit-backdrop-filter: blur(40px); 56 | } 57 | 58 | .backdrop-blur-sm { 59 | backdrop-filter: blur(4px); 60 | -webkit-backdrop-filter: blur(4px); 61 | } 62 | 63 | /* Custom scrollbar for mobile menu */ 64 | .overflow-y-auto::-webkit-scrollbar { 65 | width: 4px; 66 | } 67 | 68 | .overflow-y-auto::-webkit-scrollbar-track { 69 | background: transparent; 70 | } 71 | 72 | .overflow-y-auto::-webkit-scrollbar-thumb { 73 | background: rgba(156, 163, 175, 0.3); 74 | border-radius: 2px; 75 | } 76 | 77 | .overflow-y-auto::-webkit-scrollbar-thumb:hover { 78 | background: rgba(156, 163, 175, 0.5); 79 | } -------------------------------------------------------------------------------- /Frontend/src/components/LoaderHandle.jsx: -------------------------------------------------------------------------------- 1 | // src/components/LoaderHandler.jsx 2 | import { useEffect, useState } from "react"; 3 | import { useLocation } from "react-router-dom"; 4 | import Loader from "./Loader"; // adjust path if needed 5 | 6 | export default function LoaderHandler({ children }) { 7 | const location = useLocation(); 8 | const [loading, setLoading] = useState(false); 9 | const [loaderText, setLoaderText] = useState("Loading..."); 10 | 11 | // Map route pathnames to their loader texts 12 | const loaderTexts = { 13 | "/": "Loading Home Page...", 14 | "/optimiser": "Code Optimiser...", 15 | "/codegenerator": "Initializing Code Generator...", 16 | "/codecomplexity": "Initializing Code Generator...", 17 | "/codecompare": "Loading Code Compare Tool...", 18 | "/about": "Loading About Section...", 19 | "/contributors": "Meet Our Contributors...", 20 | "/insights": "Fetching AI Insights...", 21 | "/code-tools":"Loading All Tools...", 22 | "/test-case-generator":"Loading Test Case Generator...", 23 | "/code-beautifier":"Loading Code Beautify Tool...", 24 | "/error-debugger":"Loading Error Debugging Tool...", 25 | "/performance-analyzer":"Loading Perfomance Analysing Tool...", 26 | "/content-summarizer": "Loading Summarizing Content Tool...", 27 | "/security-scanner": "Analyzing Security Components...", 28 | "/dependency-scanner": "Loading Dependency Scanner...", 29 | "/contact": "Contact Page is Loading...", 30 | "/team": "Our Team...", 31 | "/contribute": "Want to contribute?...", 32 | "/feedback": "Feedback...", 33 | "/privacy-policy": "Our Privacy Policy...", 34 | "/terms-of-service": "Our Terms of Service...", 35 | "/contributor-guide": "Contribution Guide...", 36 | "/logo-showcase": "Logo Showcase...", 37 | }; 38 | 39 | useEffect(() => { 40 | // pick a loader text based on the current path 41 | setLoaderText(loaderTexts[location.pathname] || "Loading..."); 42 | setLoading(true); 43 | 44 | const timeout = setTimeout(() => setLoading(false), 1000); 45 | return () => clearTimeout(timeout); 46 | }, [location.pathname]); 47 | 48 | return ( 49 | <> 50 | {loading && ( 51 | 57 | )} 58 | {children} 59 | 60 | ); 61 | } 62 | -------------------------------------------------------------------------------- /Frontend/src/components/AiNetworkHero.jsx: -------------------------------------------------------------------------------- 1 | import { useEffect, useRef } from "react"; 2 | import {useTheme} from "../context/ThemeContext"; 3 | export default function AiNetworkHero() { 4 | const {isDark} = useTheme(); 5 | const canvasRef = useRef(null); 6 | 7 | useEffect(() => { 8 | const canvas = canvasRef.current; 9 | const ctx = canvas.getContext("2d"); 10 | let w, h, particles; 11 | 12 | function resize() { 13 | w = canvas.width = window.innerWidth; 14 | h = canvas.height = window.innerHeight; 15 | } 16 | window.addEventListener("resize", resize); 17 | resize(); 18 | 19 | function initParticles(count = 60) { 20 | particles = Array.from({ length: count }, () => ({ 21 | x: Math.random() * w, 22 | y: Math.random() * h, 23 | vx: (Math.random() - 0.5) * 0.6, 24 | vy: (Math.random() - 0.5) * 0.6, 25 | })); 26 | } 27 | initParticles(); 28 | 29 | function animate() { 30 | ctx.clearRect(0, 0, w, h); 31 | ctx.fillStyle = 'rgba(255,255,255,0.6)' ; 32 | particles.forEach((p) => { 33 | p.x += p.vx; 34 | p.y += p.vy; 35 | if (p.x < 0 || p.x > w) p.vx *= -1; 36 | if (p.y < 0 || p.y > h) p.vy *= -1; 37 | 38 | ctx.beginPath(); 39 | ctx.arc(p.x, p.y, 2, 0, Math.PI * 2); 40 | ctx.fill(); 41 | }); 42 | 43 | ctx.strokeStyle = 'rgba(255,255,255,0.15)' ; 44 | for (let i = 0; i < particles.length; i++) { 45 | for (let j = i + 1; j < particles.length; j++) { 46 | const dx = particles[i].x - particles[j].x; 47 | const dy = particles[i].y - particles[j].y; 48 | const dist = Math.sqrt(dx * dx + dy * dy); 49 | if (dist < 120) { 50 | ctx.beginPath(); 51 | ctx.moveTo(particles[i].x, particles[i].y); 52 | ctx.lineTo(particles[j].x, particles[j].y); 53 | ctx.stroke(); 54 | } 55 | } 56 | } 57 | requestAnimationFrame(animate); 58 | } 59 | animate(); 60 | 61 | // Cleanup on unmount 62 | return () => { 63 | window.removeEventListener("resize", resize); 64 | }; 65 | }, []); 66 | 67 | return ( 68 |
69 | {/* Canvas background */} 70 | 71 |
72 | ); 73 | } 74 | -------------------------------------------------------------------------------- /npm-debug.log: -------------------------------------------------------------------------------- 1 | 0 info it worked if it ends with ok 2 | 1 verbose cli [ 3 | 1 verbose cli 'C:\\Program Files\\nodejs\\node.exe', 4 | 1 verbose cli 'C:\\Users\\Drishti Rathod\\node_modules\\npm\\bin\\npm-cli.js', 5 | 1 verbose cli 'run', 6 | 1 verbose cli 'frontend' 7 | 1 verbose cli ] 8 | 2 info using npm@2.15.12 9 | 3 info using node@v22.17.1 10 | 4 verbose run-script [ 'prefrontend', 'frontend', 'postfrontend' ] 11 | 5 info prefrontend code-review@1.0.0 12 | 6 info frontend code-review@1.0.0 13 | 7 verbose unsafe-perm in lifecycle true 14 | 8 verbose stack TypeError [ERR_INVALID_ARG_VALUE]: The property 'options.env['npm_package_description']' must be a string without null bytes. Received '��#\x00 \x00A\x00i\x00-\x00c\x00o\x00d\x00e\x00-\x00o\x00p\x00t\x00i\x00m\x00i\x00s\x00a\x00t\x00i\x00o\x00n\x00\r\x00 \x00' 15 | 8 verbose stack at validateArgumentNullCheck (node:child_process:966:11) 16 | 8 verbose stack at normalizeSpawnArguments (node:child_process:693:7) 17 | 8 verbose stack at spawn (node:child_process:747:13) 18 | 8 verbose stack at spawn (C:\Users\Drishti Rathod\node_modules\npm\lib\utils\spawn.js:7:13) 19 | 8 verbose stack at runCmd_ (C:\Users\Drishti Rathod\node_modules\npm\lib\utils\lifecycle.js:211:14) 20 | 8 verbose stack at runCmd (C:\Users\Drishti Rathod\node_modules\npm\lib\utils\lifecycle.js:176:5) 21 | 8 verbose stack at runPackageLifecycle (C:\Users\Drishti Rathod\node_modules\npm\lib\utils\lifecycle.js:138:3) 22 | 8 verbose stack at Array. (C:\Users\Drishti Rathod\node_modules\npm\node_modules\slide\lib\bind-actor.js:15:8) 23 | 8 verbose stack at LOOP (C:\Users\Drishti Rathod\node_modules\npm\node_modules\slide\lib\chain.js:15:14) 24 | 8 verbose stack at chain (C:\Users\Drishti Rathod\node_modules\npm\node_modules\slide\lib\chain.js:20:5) 25 | 9 verbose cwd C:\Users\Drishti Rathod\omex 26 | 10 error Windows_NT 10.0.26100 27 | 11 error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\Drishti Rathod\\node_modules\\npm\\bin\\npm-cli.js" "run" "frontend" 28 | 12 error node v22.17.1 29 | 13 error npm v2.15.12 30 | 14 error code ERR_INVALID_ARG_VALUE 31 | 15 error The property 'options.env['npm_package_description']' must be a string without null bytes. Received '��#\x00 \x00A\x00i\x00-\x00c\x00o\x00d\x00e\x00-\x00o\x00p\x00t\x00i\x00m\x00i\x00s\x00a\x00t\x00i\x00o\x00n\x00\r\x00 \x00' 32 | 16 error If you need help, you may report this error at: 33 | 16 error 34 | 17 verbose exit [ 1, true ] 35 | -------------------------------------------------------------------------------- /Frontend/src/utils/mobileUtils.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Mobile Touch Utilities for better button interaction on touch devices 3 | * Addresses the common issue where buttons don't respond properly on mobile browsers 4 | */ 5 | 6 | /** 7 | * Creates touch event handlers for better mobile button interaction 8 | * @param {Function} onClick - The click handler function 9 | * @returns {Object} Object containing onTouchStart and onTouchEnd handlers 10 | */ 11 | export const createTouchHandlers = (onClick) => ({ 12 | onTouchStart: (e) => { 13 | // Prevent touch delay and provide visual feedback 14 | e.currentTarget.style.transform = 'scale(0.98)'; 15 | e.currentTarget.style.transition = 'transform 0.1s ease'; 16 | }, 17 | 18 | onTouchEnd: (e) => { 19 | // Reset visual state 20 | e.currentTarget.style.transform = 'scale(1)'; 21 | 22 | // Trigger the click handler for touch devices 23 | if (e.type === 'touchend') { 24 | e.preventDefault(); 25 | e.stopPropagation(); 26 | onClick(e); 27 | } 28 | } 29 | }); 30 | 31 | /** 32 | * Enhanced click handler that works better on mobile devices 33 | * @param {Function} originalHandler - The original click handler 34 | * @returns {Function} Enhanced handler with mobile compatibility 35 | */ 36 | export const createMobileClickHandler = (originalHandler) => { 37 | return (e) => { 38 | // Prevent event bubbling and default behavior for better mobile compatibility 39 | if (e) { 40 | e.preventDefault(); 41 | e.stopPropagation(); 42 | } 43 | 44 | return originalHandler(e); 45 | }; 46 | }; 47 | 48 | /** 49 | * CSS styles for mobile-optimized buttons 50 | */ 51 | export const mobileButtonStyles = { 52 | WebkitTapHighlightColor: 'transparent', 53 | userSelect: 'none', 54 | touchAction: 'manipulation', 55 | WebkitTouchCallout: 'none', 56 | WebkitUserSelect: 'none' 57 | }; 58 | 59 | /** 60 | * CSS classes for mobile-optimized buttons (to be used with Tailwind) 61 | */ 62 | export const mobileButtonClasses = 'min-h-[44px] touch-manipulation transition-all duration-150'; 63 | 64 | /** 65 | * Detects if the device is likely a touch device 66 | * @returns {boolean} True if touch device is detected 67 | */ 68 | export const isTouchDevice = () => { 69 | return (('ontouchstart' in window) || 70 | (navigator.maxTouchPoints > 0) || 71 | (navigator.msMaxTouchPoints > 0)); 72 | }; 73 | 74 | /** 75 | * Detects if the device is likely mobile based on screen size and user agent 76 | * @returns {boolean} True if mobile device is detected 77 | */ 78 | export const isMobileDevice = () => { 79 | return window.innerWidth <= 768 || /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); 80 | }; -------------------------------------------------------------------------------- /Frontend/src/index.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | 3 | /* Global styles */ 4 | body { 5 | margin: 0; 6 | font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", 7 | "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", 8 | sans-serif; 9 | -webkit-font-smoothing: antialiased; 10 | -moz-osx-font-smoothing: grayscale; 11 | transition: background-color 0.3s ease, color 0.3s ease; 12 | } 13 | 14 | /* Dark mode styles */ 15 | body.dark-mode { 16 | background-color: #1a1a2e; 17 | color: #f0f0f0; 18 | } 19 | 20 | /* Light mode styles */ 21 | body.light-mode { 22 | background-color: #f5f5f5; 23 | color: #333333; 24 | } 25 | 26 | /* Scrollbar styling */ 27 | /* Base scrollbar */ 28 | ::-webkit-scrollbar { 29 | width: 10px; 30 | transition: opacity 0.5s ease; 31 | opacity: 0; /* hidden by default */ 32 | } 33 | 34 | /* Enlarge scrollbar width on hover */ 35 | ::-webkit-scrollbar:hover { 36 | width: 14px; 37 | } 38 | 39 | ::-webkit-scrollbar-track { 40 | background: transparent; 41 | transition: opacity 0.5s ease, background-color 0.5s ease; 42 | opacity: 0; 43 | } 44 | 45 | ::-webkit-scrollbar-thumb { 46 | border-radius: 6px; 47 | background-color: transparent; 48 | transition: opacity 0.5s ease, background-color 0.5s ease; 49 | opacity: 0; 50 | } 51 | 52 | /* Show when active */ 53 | body.show-scrollbar::-webkit-scrollbar, 54 | body.show-scrollbar::-webkit-scrollbar-track, 55 | body.show-scrollbar::-webkit-scrollbar-thumb { 56 | opacity: 1; 57 | } 58 | 59 | /* Theme colors */ 60 | body.dark-mode.show-scrollbar::-webkit-scrollbar-track { 61 | background: rgba(255, 255, 255, 0.05); 62 | } 63 | 64 | body.light-mode.show-scrollbar::-webkit-scrollbar-track { 65 | background: rgba(0, 0, 0, 0.05); 66 | } 67 | 68 | body.dark-mode.show-scrollbar::-webkit-scrollbar-thumb { 69 | background-color: #3b3b57; 70 | } 71 | 72 | body.light-mode.show-scrollbar::-webkit-scrollbar-thumb { 73 | background-color: #999; 74 | } 75 | 76 | /* Keep visible while hovering scrollbar */ 77 | ::-webkit-scrollbar:hover, 78 | ::-webkit-scrollbar-track:hover, 79 | ::-webkit-scrollbar-thumb:hover { 80 | opacity: 1 !important; 81 | } 82 | 83 | /* Fix for the gap in the UI */ 84 | .grid { 85 | gap: 1rem !important; 86 | } 87 | 88 | .h-64 { 89 | height: 500px !important; 90 | } 91 | 92 | /* Fix for the code editor layout */ 93 | .flex-col.md\\:flex-row { 94 | gap: 0 !important; 95 | } 96 | 97 | /* Fix for the code comparison layout */ 98 | .grid-cols-1.lg\\:grid-cols-2 { 99 | gap: 0 !important; 100 | } 101 | 102 | /* Mobile touch optimization for buttons */ 103 | @media (pointer: coarse) { 104 | button { 105 | min-height: 44px; 106 | min-width: 44px; 107 | touch-action: manipulation; 108 | -webkit-tap-highlight-color: transparent; 109 | } 110 | } 111 | 112 | /* Touch-friendly button class */ 113 | .touch-manipulation { 114 | touch-action: manipulation; 115 | -webkit-tap-highlight-color: transparent; 116 | -webkit-touch-callout: none; 117 | -webkit-user-select: none; 118 | user-select: none; 119 | } 120 | -------------------------------------------------------------------------------- /Frontend/src/styles/glassmorphism.css: -------------------------------------------------------------------------------- 1 | /* Glassmorphism Effects */ 2 | 3 | .glass { 4 | background: rgba(255, 255, 255, 0.1); 5 | backdrop-filter: blur(10px); 6 | -webkit-backdrop-filter: blur(10px); 7 | border: 1px solid rgba(255, 255, 255, 0.18); 8 | box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15); 9 | } 10 | 11 | .glass-dark { 12 | background: rgba(17, 25, 40, 0.75); 13 | backdrop-filter: blur(10px); 14 | -webkit-backdrop-filter: blur(10px); 15 | border: 1px solid rgba(255, 255, 255, 0.08); 16 | box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37); 17 | } 18 | 19 | .glass-card { 20 | transition: all 0.3s ease; 21 | } 22 | 23 | .glass-card:hover { 24 | transform: translateY(-5px); 25 | box-shadow: 0 12px 40px 0 rgba(31, 38, 135, 0.25); 26 | } 27 | 28 | .glass-dark-card { 29 | transition: all 0.3s ease; 30 | } 31 | 32 | .glass-dark-card:hover { 33 | transform: translateY(-5px); 34 | box-shadow: 0 12px 40px 0 rgba(0, 0, 0, 0.5); 35 | } 36 | 37 | /* Gradient backgrounds */ 38 | .bg-gradient-blue { 39 | background: linear-gradient(135deg, #6e8efb, #a777e3); 40 | } 41 | 42 | .bg-gradient-green { 43 | background: linear-gradient(135deg, #43cea2, #185a9d); 44 | } 45 | 46 | .bg-gradient-purple { 47 | background: linear-gradient(135deg, #c471ed, #f64f59); 48 | } 49 | 50 | .bg-gradient-dark { 51 | background: linear-gradient(135deg, #2c3e50, #4ca1af); 52 | } 53 | 54 | /* Image overlays */ 55 | .image-overlay { 56 | position: relative; 57 | } 58 | 59 | .image-overlay::before { 60 | content: ''; 61 | position: absolute; 62 | top: 0; 63 | left: 0; 64 | width: 100%; 65 | height: 100%; 66 | background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.7)); 67 | z-index: 1; 68 | } 69 | 70 | .image-overlay > * { 71 | position: relative; 72 | z-index: 2; 73 | } 74 | 75 | /* Animated background shapes */ 76 | .animated-bg { 77 | position: relative; 78 | overflow: hidden; 79 | } 80 | 81 | .animated-bg::before { 82 | content: ''; 83 | position: absolute; 84 | width: 300px; 85 | height: 300px; 86 | background: rgba(255, 255, 255, 0.1); 87 | border-radius: 50%; 88 | top: -100px; 89 | right: -100px; 90 | animation: float 15s infinite linear; 91 | } 92 | 93 | .animated-bg::after { 94 | content: ''; 95 | position: absolute; 96 | width: 200px; 97 | height: 200px; 98 | background: rgba(255, 255, 255, 0.1); 99 | border-radius: 50%; 100 | bottom: -50px; 101 | left: -50px; 102 | animation: float 20s infinite linear reverse; 103 | } 104 | 105 | @keyframes float { 106 | 0% { 107 | transform: translateY(0) rotate(0deg); 108 | } 109 | 50% { 110 | transform: translateY(-20px) rotate(180deg); 111 | } 112 | 100% { 113 | transform: translateY(0) rotate(360deg); 114 | } 115 | } 116 | 117 | /* Glassmorphism for dark mode */ 118 | .dark-glass { 119 | background: rgba(0, 0, 0, 0.2); 120 | backdrop-filter: blur(10px); 121 | -webkit-backdrop-filter: blur(10px); 122 | border: 1px solid rgba(255, 255, 255, 0.1); 123 | } 124 | 125 | /* Glassmorphism for light mode */ 126 | .light-glass { 127 | background: rgba(255, 255, 255, 0.2); 128 | backdrop-filter: blur(10px); 129 | -webkit-backdrop-filter: blur(10px); 130 | border: 1px solid rgba(255, 255, 255, 0.3); 131 | } 132 | -------------------------------------------------------------------------------- /BackEnd/src/controllers/ai.controller.js: -------------------------------------------------------------------------------- 1 | const aiService = require("../services/ai.service"); 2 | 3 | const handleRequest = async ( 4 | req, 5 | res, 6 | serviceMethod, 7 | requiredFields = ["prompt"] 8 | ) => { 9 | try { 10 | for (const field of requiredFields) { 11 | if (!req.body[field]) { 12 | return res 13 | .status(400) 14 | .send( 15 | `${field.charAt(0).toUpperCase() + field.slice(1)} is required` 16 | ); 17 | } 18 | } 19 | 20 | const args = requiredFields.map((field) => req.body[field]); 21 | const response = await serviceMethod(...args); 22 | res.send(response); 23 | } catch (error) { 24 | console.error(`Error in ${serviceMethod.name}:`, error); 25 | res 26 | .status(500) 27 | .send(`An error occurred while processing ${serviceMethod.name}`); 28 | } 29 | }; 30 | 31 | const getReview = (req, res) => 32 | handleRequest(req, res, aiService.generateReview, ["prompt"]); 33 | const getCode = (req, res) => 34 | handleRequest(req, res, aiService.generateCode, ["prompt"]); 35 | const getComplexity = (req, res) => 36 | handleRequest(req, res, aiService.generateComplexity, ["prompt"]); 37 | const compareCode = (req, res) => 38 | handleRequest(req, res, aiService.compareCode, [ 39 | "code1", 40 | "code2", 41 | "language", 42 | ]); 43 | const getTestCases = (req, res) => 44 | handleRequest(req, res, aiService.generateTestCases, ["code", "language"]); 45 | const beautifyCode = (req, res) => 46 | handleRequest(req, res, aiService.beautifyCode, ["code", "language"]); 47 | const debugCode = (req, res) => 48 | handleRequest(req, res, aiService.debugCode, ["code", "language"]); 49 | const analyzePerformance = (req, res) => 50 | handleRequest(req, res, aiService.analyzePerformance, ["code", "language"]); 51 | const analyzeSecurity = (req, res) => 52 | handleRequest(req, res, aiService.analyzeSecurity, ["code", "language"]); 53 | // Dependency Scanner 54 | const scanDependencies = async (req, res) => { 55 | try { 56 | const { fileContent } = req.body; 57 | 58 | if (!fileContent) { 59 | return res.status(400).send("Dependencies file is required"); 60 | } 61 | 62 | const response = await aiService.scanDependencies(fileContent); 63 | res.send(response); 64 | } catch (error) { 65 | console.error("Error in scanDependencies:", error); 66 | res.status(500).send("An error occurred while scanning dependencies"); 67 | } 68 | }; 69 | 70 | const codeMetricsAnalyzer = async (req, res) => { 71 | const { code } = req.body; 72 | if (!code) { 73 | return res.status(400).send("Code is required"); 74 | } 75 | try { 76 | const result = await aiService.codeMetricsAnalyzer(code); 77 | res.json({ result }); 78 | } catch (err) { 79 | res.status(500).send(err.message); 80 | } 81 | }; 82 | 83 | const explainCode = (req, res) => 84 | handleRequest(req, res, aiService.generateExplanation, ["code", "language"]); 85 | 86 | module.exports = { 87 | getReview, 88 | getCode, 89 | getComplexity, 90 | compareCode, 91 | getTestCases, 92 | beautifyCode, 93 | debugCode, 94 | analyzePerformance, 95 | analyzeSecurity, 96 | scanDependencies, 97 | codeMetricsAnalyzer, 98 | explainCode, 99 | }; 100 | 101 | -------------------------------------------------------------------------------- /Frontend/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | OMEX - AI-Powered Code Optimization & Development Tools 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 |
43 | 44 |
45 | 46 | 47 | 48 | 69 | 70 | 71 | 72 | -------------------------------------------------------------------------------- /Frontend/src/components/FeedbackButton.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import { Link } from "react-router-dom"; 3 | import { FcFeedback } from "react-icons/fc"; 4 | import { motion } from "framer-motion"; 5 | import { useTheme } from "../context/ThemeContext"; 6 | 7 | const FeedbackButton = ({ position = "bottom-right", toolName = "tool" }) => { 8 | const { isDark } = useTheme(); 9 | const [isHovered, setIsHovered] = useState(false); 10 | 11 | const positionClasses = { 12 | "bottom-right": "fixed bottom-20 right-4 lg:right-6", 13 | "bottom-left": "fixed bottom-20 left-6", 14 | "top-right": "fixed top-24 right-6", 15 | "top-left": "fixed top-24 left-6", 16 | "inline": "inline-block", 17 | }; 18 | 19 | return ( 20 | setIsHovered(true)} 24 | onMouseLeave={() => setIsHovered(false)} 25 | > 26 | {/* Outer Button */} 27 |
37 | {/* Full-cover animated gradient overlay */} 38 | 53 | 54 | {/* Centered Icon */} 55 | 60 | 61 | 62 | 63 | {/* Floating particles (optional for hover effect) */} 64 | {isHovered && ( 65 | <> 66 |
67 |
68 | 69 | )} 70 |
71 | 72 | {/* Outer pulse ring */} 73 |
80 | 81 | ); 82 | }; 83 | 84 | export default FeedbackButton; 85 | -------------------------------------------------------------------------------- /Frontend/src/pages/CodeOptimizer.jsx: -------------------------------------------------------------------------------- 1 | import { useState, useEffect } from 'react'; 2 | import CodeEditor from '../components/CodeEditor.jsx'; 3 | import CodeExamples from '../components/CodeExamples.jsx'; 4 | import FeedbackButton from '../components/FeedbackButton.jsx'; 5 | import CodeHistory from '../components/CodeHistory.jsx'; 6 | import { FaLightbulb, FaCode } from 'react-icons/fa'; 7 | import { useTheme } from '../context/ThemeContext'; 8 | import Loader from '../components/Loader.jsx'; 9 | 10 | function CodeOptimizer() { 11 | const { isDark } = useTheme(); 12 | const [loading, setLoading] = useState(true); 13 | useEffect(() => { 14 | const timer = setTimeout(() => { 15 | setLoading(false); 16 | window.scrollTo(0, 0); 17 | }, 1500); 18 | return () => clearTimeout(timer); 19 | }, []); 20 | const URL = `${import.meta.env.VITE_BACKEND_URL}/ai/get-review`; 21 | const [showExamples, setShowExamples] = useState(false); 22 | 23 | const defaultPrompt = `function add(a, b) { 24 | return a + b; 25 | }`; 26 | 27 | const [prompt, setPrompt] = useState(defaultPrompt); 28 | 29 | const codeExamples = [ 30 | { 31 | name: "JavaScript Function", 32 | code: defaultPrompt 33 | }, 34 | { 35 | name: "JavaScript Loop", 36 | code: `function sumArray(arr) { 37 | let sum = 0; 38 | for(let i = 0; i < arr.length; i++) { 39 | sum += arr[i]; 40 | } 41 | return sum; 42 | }` 43 | }, 44 | { 45 | name: "Python Function", 46 | code: `def factorial(n): 47 | if n <= 1: 48 | return 1 49 | else: 50 | return n * factorial(n-1)` 51 | } 52 | ]; 53 | 54 | const handleExampleSelect = (code) => { 55 | setPrompt(code); 56 | setShowExamples(false); 57 | }; 58 | 59 | if (loading) { 60 | return ( 61 |
62 | {/* */} 63 |
64 | ); 65 | } 66 | 67 | return ( 68 |
69 |
70 | {/* Header Section */} 71 |
72 |
73 |
74 | 75 |

76 | OMEX Code Optimizer 77 |

78 |
79 |
80 | 86 |
87 |
88 |

89 | Optimize your code for better performance, readability, and maintainability. 90 |

91 |
92 | 93 | {/* Examples Dropdown */} 94 | {showExamples && ( 95 |
96 | 101 |
102 | )} 103 | 104 | {/* Code Editor */} 105 |
106 | 107 |
108 |
109 | 110 | {/* Feedback Form */} 111 | 112 | 113 | {/* Code History */} 114 | {/* setPrompt(code)} 116 | isDark={isDark} 117 | /> */} 118 |
119 | ); 120 | } 121 | 122 | export default CodeOptimizer; 123 | -------------------------------------------------------------------------------- /Frontend/public/logo-guidelines.md: -------------------------------------------------------------------------------- 1 | # Omex AI Logo Guidelines 2 | 3 | This document provides guidelines for using the Omex AI logo across various platforms and contexts. 4 | 5 | ## Logo Variants 6 | 7 | | File | Purpose | Description | 8 | |------|---------|-------------| 9 | | `omex-logo.svg` | Primary logo | Clean, professional logo with angle brackets and circular "O" on blue background | 10 | | `omex-logo-transparent.svg` | For colored backgrounds | Transparent background version with blue brackets and gradient circle | 11 | | `omex-logo-mono.svg` | For printing | Monochrome (black) version for print materials | 12 | | `omex-logo-white.svg` | For dark backgrounds | White version for use on dark backgrounds | 13 | | `omex-icon.svg` | Icon-only usage | Compact icon-only version without text | 14 | | `omex-favicon.svg` | Browser favicon | Compact version for browser tabs and bookmarks | 15 | | `omex-text-logo.svg` | Horizontal logo | Combined icon and text logo for headers and branded materials | 16 | 17 | ## Design Concept 18 | 19 | The Omex AI logo represents: 20 | 1. **Code & Development**: Angle brackets symbolize code syntax and development 21 | 2. **Integration**: The circular "O" represents completeness and integration 22 | 3. **Focus**: The minimal design ensures clear recognition at any size 23 | 24 | ## Brand Colors 25 | 26 | - Primary Blue: `#2563EB` 27 | - Accent Purple: `#8B5CF6` 28 | - White: `#FFFFFF` 29 | - Black: `#000000` 30 | 31 | ## Usage Guidelines 32 | 33 | 1. **Clear Space**: Always maintain sufficient clear space around the logo 34 | 2. **Scaling**: Don't stretch or distort the logo - scale proportionally 35 | 3. **Background**: Ensure good contrast on any background 36 | 4. **Modifications**: Don't alter the colors or proportions 37 | 38 | ## Implementation Examples 39 | 40 | ### Navbar Integration 41 | 42 | The logo automatically switches between light and dark modes: 43 | 44 | ```jsx 45 | // Light mode: uses omex-logo-transparent.svg 46 | // Dark mode: uses omex-logo-white.svg 47 | Omex AI 52 | ``` 53 | 54 | ### Footer Integration 55 | 56 | Similar implementation in the footer component: 57 | 58 | ```jsx 59 | Omex AI 64 | ``` 65 | 66 | ## Screenshots 67 | 68 | ### Light Mode 69 | ![Navbar Light Mode](logo-navbar-light.png) 70 | ![Footer Light Mode](logo-footer-light.png) 71 | 72 | ### Dark Mode 73 | ![Navbar Dark Mode](logo-navbar-dark.png) 74 | ![Footer Dark Mode](logo-footer-dark.png) 75 | 76 | ## Favicon Integration 77 | 78 | Add to your HTML head: 79 | 80 | ```html 81 | 82 | 83 | ``` 84 | 85 | ## Usage in React 86 | 87 | ### As an image: 88 | ```jsx 89 | import React from 'react'; 90 | 91 | function Header() { 92 | return ( 93 |
94 | Omex AI 100 | {/* rest of your header */} 101 |
102 | ); 103 | } 104 | 105 | export default Header; 106 | ``` 107 | 108 | ### As an inline SVG (for more styling control): 109 | ```jsx 110 | import React from 'react'; 111 | import { ReactComponent as OmexLogo } from '../path/to/omex-logo.svg'; 112 | 113 | function Header() { 114 | return ( 115 |
116 | 117 | {/* rest of your header */} 118 |
119 | ); 120 | } 121 | 122 | export default Header; 123 | ``` 124 | 125 | ## Guidelines 126 | 127 | 1. **Clear Space**: Always maintain sufficient clear space around the logo 128 | 2. **Scaling**: Don't stretch or distort the logo - scale proportionally 129 | 3. **Background**: Ensure good contrast on any background 130 | 4. **Modifications**: Don't alter the colors or proportions 131 | 132 | ## Favicon Integration 133 | 134 | Add to your HTML head: 135 | 136 | ```html 137 | 138 | 139 | ``` 140 | -------------------------------------------------------------------------------- /Frontend/src/components/FeedbackForm.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from 'react'; 2 | import { FaThumbsUp, FaThumbsDown, FaComment } from 'react-icons/fa'; 3 | import toast from 'react-hot-toast'; 4 | 5 | const FeedbackForm = ({ isDark = true }) => { 6 | const [showForm, setShowForm] = useState(false); 7 | const [feedback, setFeedback] = useState(''); 8 | const [rating, setRating] = useState(null); 9 | 10 | const handleSubmit = (e) => { 11 | e.preventDefault(); 12 | 13 | // Here you would typically send the feedback to your backend 14 | // For now, we'll just show a toast notification 15 | toast.success('Thank you for your feedback!'); 16 | 17 | // Reset form 18 | setFeedback(''); 19 | setRating(null); 20 | setShowForm(false); 21 | }; 22 | 23 | return ( 24 |
25 | {!showForm ? ( 26 | 37 | ) : ( 38 |
41 |
42 |

Share Your Feedback

43 | 49 |
50 | 51 |
52 |
53 | 54 |
55 | 66 | 77 |
78 |
79 | 80 |
81 | 82 | 93 |
94 | 95 | 106 |
107 |
108 | )} 109 |
110 | ); 111 | }; 112 | 113 | export default FeedbackForm; 114 | -------------------------------------------------------------------------------- /Frontend/src/components/TextInput.jsx: -------------------------------------------------------------------------------- 1 | import { useState } from 'react'; 2 | import { FaEdit, FaCheck, FaTimes } from 'react-icons/fa'; 3 | import { useTheme } from '../context/ThemeContext'; 4 | 5 | /** 6 | * Component for entering and editing text content 7 | */ 8 | const TextInput = ({ onTextSubmit }) => { 9 | const { isDark } = useTheme(); 10 | const [text, setText] = useState(''); 11 | const [isEditing, setIsEditing] = useState(true); 12 | 13 | // Handle text change 14 | const handleTextChange = (e) => { 15 | setText(e.target.value); 16 | }; 17 | 18 | // Handle text submission 19 | const handleSubmit = () => { 20 | if (text.trim()) { 21 | onTextSubmit(text); 22 | setIsEditing(false); 23 | } 24 | }; 25 | 26 | // Reset text and return to editing mode 27 | const handleReset = () => { 28 | setText(''); 29 | setIsEditing(true); 30 | }; 31 | 32 | return ( 33 |
34 | {isEditing ? ( 35 |
36 |