diff --git a/.commitlintrc.json b/.commitlintrc.json new file mode 100644 index 0000000..2c46208 --- /dev/null +++ b/.commitlintrc.json @@ -0,0 +1,6 @@ +{ + "extends": ["@commitlint/config-conventional"], + "rules": { + "type-enum": [2, "always", ["ci", "chore", "docs", "feat", "fix", "perf", "refactor", "revert", "style", "assets"]] + } +} diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..dd87e2d --- /dev/null +++ b/.dockerignore @@ -0,0 +1,2 @@ +node_modules +build diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..fd79574 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,15 @@ +// This configuration only applies to the package manager root. +/** @type {import("eslint").Linter.Config} */ + +module.exports = { + ignorePatterns: ["apps/**", "packages/**"], + extends: ["@repo/eslint-config/library.js"], + parser: "@typescript-eslint/parser", + parserOptions: { + project: true, + }, + rules: { + "no-unused-vars": "off", + "no-redeclare": "off", + } +}; diff --git a/.github/ISSUE_TEMPLATE/bug.md b/.github/ISSUE_TEMPLATE/bug.md new file mode 100644 index 0000000..32d6833 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/bug.md @@ -0,0 +1,28 @@ +--- +name: Bug +about: Create a report to help us improve +title: "bug: " +labels: bug +assignees: '' +--- + +**Describe the bug** +A clear and concise description of what the bug is. + +**To Reproduce** +Steps to reproduce the behavior: +1. Do something +2. See error + +**Expected behavior** +A clear and concise description of what you expected to happen. + +**Screenshots or GIFs** +If applicable, add screenshots to help explain your problem. + +**Info (please complete the following information):** + - Browser [e.g. chrome, safari] + - Version [e.g. 22] + +**Additional context** +Add any other context about the problem here. diff --git a/.github/ISSUE_TEMPLATE/feature.md b/.github/ISSUE_TEMPLATE/feature.md new file mode 100644 index 0000000..8f5b39a --- /dev/null +++ b/.github/ISSUE_TEMPLATE/feature.md @@ -0,0 +1,19 @@ +--- +name: Feature request +about: Suggest an idea for this project +title: 'feature: ' +labels: enhancement +assignees: '' +--- + +**Is your feature request related to a problem? Please describe.** +A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] + +**Describe the solution you'd like** +A clear and concise description of what you want to happen. + +**Describe alternatives you've considered** +A clear and concise description of any alternative solutions or features you've considered. + +**Additional context** +Add any other context or screenshots about the feature request here. diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md new file mode 100644 index 0000000..5ae008d --- /dev/null +++ b/.github/pull_request_template.md @@ -0,0 +1,9 @@ +### PR Fixes: +- 1 +- 2 + +Resolves #[Issue Number if there] + +### Checklist before requesting a review +- [ ] I have performed a self-review of my code +- [ ] I assure there is no similar/duplicate pull request regarding same issue diff --git a/.github/workflows/lint_commit.yml b/.github/workflows/lint_commit.yml new file mode 100644 index 0000000..e9252d0 --- /dev/null +++ b/.github/workflows/lint_commit.yml @@ -0,0 +1,39 @@ +name: CommitLint, Linting and formatting +on: + pull_request: + branches: + - '**' + +jobs: + + Continuous-Integration: + + name: Performs linting, formatting on the application + runs-on: ubuntu-latest + steps: + - name: Checkout Repository + uses: actions/checkout@v3 + with: + fetch-depth: 0 + + - name: Cache Yarn dependencies + uses: actions/cache@v2 + with: + path: ~/.cache/yarn + key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} + restore-keys: | + ${{ runner.os }}-yarn- + + - name: Install Yarn and Dependencies + run: yarn install --frozen-lockfile + + - name: Print versions + run: | + git --version + yarn --version + + - name: Run linting check + run: yarn run lint + + - name: Check formatting + run: yarn run format \ No newline at end of file diff --git a/.github/workflows/workflow_backend.yml b/.github/workflows/workflow_backend.yml deleted file mode 100644 index 28b3def..0000000 --- a/.github/workflows/workflow_backend.yml +++ /dev/null @@ -1,27 +0,0 @@ -name: Backend CI - -on: - push: - branches: [master] - pull_request: - branches: [master] - -jobs: - build: - runs-on: ubuntu-latest - defaults: - run: - working-directory: ./ - - steps: - - uses: actions/checkout@v2 - with: - ref: master - - - name: Use Node.js - uses: actions/setup-node@v2 - with: - node-version: "20.x" - - - name: Install Dependencies - run: yarn install \ No newline at end of file diff --git a/.github/workflows/workflow_frontend.yml b/.github/workflows/workflow_frontend.yml deleted file mode 100644 index 0f75e3f..0000000 --- a/.github/workflows/workflow_frontend.yml +++ /dev/null @@ -1,35 +0,0 @@ -name: Frontend CI - -on: - push: - branches: [ master ] - pull_request: - branches: [ master ] - - -jobs: - build: - - runs-on: ubuntu-latest - defaults: - run: - working-directory: ./frontend - - steps: - - uses: actions/checkout@v2 - with: - ref: master - - - name: Use Node.js - uses: actions/setup-node@v2 - with: - node-version: '20.x' - - - name: Install Dependencies - run: yarn install - - - name: Run ESLint - run: npm run lint - - - name: Build - run: npm run build \ No newline at end of file diff --git a/.gitignore b/.gitignore index 0430960..96fab4f 100644 --- a/.gitignore +++ b/.gitignore @@ -1,132 +1,38 @@ -# Logs -logs -*.log -npm-debug.log* -yarn-debug.log* -yarn-error.log* -lerna-debug.log* -.pnpm-debug.log* -package-lock.json - -# Diagnostic reports (https://nodejs.org/api/report.html) -report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json - -# Runtime data -pids -*.pid -*.seed -*.pid.lock - -# Directory for instrumented libs generated by jscoverage/JSCover -lib-cov - -# Coverage directory used by tools like istanbul -coverage -*.lcov - -# nyc test coverage -.nyc_output - -# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) -.grunt - -# Bower dependency directory (https://bower.io/) -bower_components - -# node-waf configuration -.lock-wscript - -# Compiled binary addons (https://nodejs.org/api/addons.html) -build/Release - -# Dependency directories -node_modules/ -jspm_packages/ - -# Snowpack dependency directory (https://snowpack.dev/) -web_modules/ - -# TypeScript cache -*.tsbuildinfo - -# Optional npm cache directory -.npm - -# Optional eslint cache -.eslintcache +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. -# Optional stylelint cache -.stylelintcache +# Dependencies +node_modules +.pnp +.pnp.js -# Microbundle cache -.rpt2_cache/ -.rts2_cache_cjs/ -.rts2_cache_es/ -.rts2_cache_umd/ - -# Optional REPL history -.node_repl_history - -# Output of 'npm pack' -*.tgz - -# Yarn Integrity file -.yarn-integrity - -# dotenv environment variable files +# Local env files .env +.env.local .env.development.local .env.test.local .env.production.local -.env.local - -# parcel-bundler cache (https://parceljs.org/) -.cache -.parcel-cache - -# Next.js build output -.next -out - -# Nuxt.js build / generate output -.nuxt -dist - -# Gatsby files -.cache/ -# Comment in the public line in if your project uses Gatsby and not Next.js -# https://nextjs.org/blog/next-9-1#public-directory-support -# public - -# vuepress build output -.vuepress/dist -# vuepress v2.x temp and cache directory -.temp -.cache - -# Docusaurus cache and generated files -.docusaurus +# Testing +coverage -# Serverless directories -.serverless/ +# Turbo +.turbo -# FuseBox cache -.fusebox/ +# Vercel +.vercel -# DynamoDB Local files -.dynamodb/ +# Build Outputs +.next/ +out/ +build +dist -# TernJS port file -.tern-port -# Stores VSCode versions used for testing VSCode extensions -.vscode-test +# Debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* -# yarn v2 -.yarn/cache -.yarn/unplugged -.yarn/build-state.yml -.yarn/install-state.gz -.pnp.* -yarn.lock +# Misc +.DS_Store +*.pem diff --git a/frontend/src/components/ChatUserTile.tsx b/.husky/commit-msg similarity index 100% rename from frontend/src/components/ChatUserTile.tsx rename to .husky/commit-msg diff --git a/.husky/pre-commit b/.husky/pre-commit new file mode 100644 index 0000000..c235360 --- /dev/null +++ b/.husky/pre-commit @@ -0,0 +1,19 @@ +#!/bin/sh +. "$(dirname "$0")/_/husky.sh" + +# Define the unwanted lock files +unwanted_files=("package-lock.json" "pnpm-lock.yaml" "bun.lockb") + +# Check for unwanted lock files in the staged changes +for file in "${unwanted_files[@]}"; do + if git diff --cached --name-only | grep -qE "^$file$"; then + echo "Error: Commits containing '$file' are not allowed. Please use Yarn and remove this file from your commit." + exit 1 + fi +done + +# Allow only yarn.lock, not mandatory but should be the only lock file if present +if git diff --cached --name-only | grep -qE "^(package-lock\.json|pnpm-lock\.yaml|bun\.lockb)$"; then + echo "Error: Only 'yarn.lock' is allowed as a lock file. Please remove any other lock files from your commit." + exit 1 +fi diff --git a/.lintstagedrc b/.lintstagedrc new file mode 100644 index 0000000..7fc15cd --- /dev/null +++ b/.lintstagedrc @@ -0,0 +1,3 @@ +{ + "**/*.{ts,tsx,json}": ["prettier --write"] +} \ No newline at end of file diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..4af73f0 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,10 @@ +/.vscode +/node_modules +./dist + +*.yml +*.yaml + +*.env +.env +.env.* \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..e1e9ab7 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,8 @@ +{ + "singleQuote": false, + "printWidth":120, + "bracketSpacing": true, + "tabWidth": 2, + "trailingComma": "es5", + "semi": true +} \ No newline at end of file diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..abf84b3 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,11 @@ +FROM node:20-alpine + +WORKDIR /usr/src/app + +COPY . . + +RUN yarn install + +EXPOSE 3000 + +CMD ["yarn", "run", "dev:docker"] diff --git a/apps/chat-server/package.json b/apps/chat-server/package.json new file mode 100644 index 0000000..bda0328 --- /dev/null +++ b/apps/chat-server/package.json @@ -0,0 +1,21 @@ +{ + "name": "chat-server", + "version": "1.0.0", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1", + "dev": "nodemon -r --exec ts-node ./src/index.ts", + "start": "npx tsc && node ./dist/index.js" + }, + "keywords": [], + "author": "", + "license": "ISC", + "description": "", + "dependencies": { + "typescript": "^5.5.2" + }, + "devDependencies": { + "nodemon": "^3.1.4", + "ts-node": "^10.9.2" + } +} diff --git a/apps/chat-server/src/index.ts b/apps/chat-server/src/index.ts new file mode 100644 index 0000000..70cb285 --- /dev/null +++ b/apps/chat-server/src/index.ts @@ -0,0 +1 @@ +console.log("Hello WOrld"); diff --git a/apps/chat-server/tsconfig.json b/apps/chat-server/tsconfig.json new file mode 100644 index 0000000..1984232 --- /dev/null +++ b/apps/chat-server/tsconfig.json @@ -0,0 +1,109 @@ +{ + "compilerOptions": { + /* Visit https://aka.ms/tsconfig to read more about this file */ + + /* Projects */ + // "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */ + // "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */ + // "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */ + // "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */ + // "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */ + // "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */ + + /* Language and Environment */ + "target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */ + // "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */ + // "jsx": "preserve", /* Specify what JSX code is generated. */ + // "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */ + // "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */ + // "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */ + // "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */ + // "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */ + // "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */ + // "noLib": true, /* Disable including any library files, including the default lib.d.ts. */ + // "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */ + // "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */ + + /* Modules */ + "module": "commonjs", /* Specify what module code is generated. */ + "rootDir": "./src", /* Specify the root folder within your source files. */ + // "moduleResolution": "node10", /* Specify how TypeScript looks up a file from a given module specifier. */ + // "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ + // "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */ + // "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */ + // "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */ + // "types": [], /* Specify type package names to be included without being referenced in a source file. */ + // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ + // "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */ + // "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */ + // "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */ + // "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */ + // "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */ + // "resolveJsonModule": true, /* Enable importing .json files. */ + // "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */ + // "noResolve": true, /* Disallow 'import's, 'require's or ''s from expanding the number of files TypeScript should add to a project. */ + + /* JavaScript Support */ + // "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */ + // "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */ + // "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */ + + /* Emit */ + "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ + // "declarationMap": true, /* Create sourcemaps for d.ts files. */ + // "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */ + // "sourceMap": true, /* Create source map files for emitted JavaScript files. */ + // "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */ + // "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */ + "outDir": "./dist", /* Specify an output folder for all emitted files. */ + // "removeComments": true, /* Disable emitting comments. */ + // "noEmit": true, /* Disable emitting files from a compilation. */ + // "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */ + // "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types. */ + // "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */ + // "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */ + // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ + // "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */ + // "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */ + // "newLine": "crlf", /* Set the newline character for emitting files. */ + // "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */ + // "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */ + // "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */ + // "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */ + // "declarationDir": "./", /* Specify the output directory for generated declaration files. */ + // "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */ + + /* Interop Constraints */ + // "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */ + // "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */ + // "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */ + "esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */ + // "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */ + "forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */ + + /* Type Checking */ + "strict": true, /* Enable all strict type-checking options. */ + // "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied 'any' type. */ + // "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */ + // "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */ + // "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */ + // "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */ + // "noImplicitThis": true, /* Enable error reporting when 'this' is given the type 'any'. */ + // "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */ + // "alwaysStrict": true, /* Ensure 'use strict' is always emitted. */ + // "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */ + // "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */ + // "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */ + // "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */ + // "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */ + // "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */ + // "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */ + // "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */ + // "allowUnusedLabels": true, /* Disable error reporting for unused labels. */ + // "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */ + + /* Completeness */ + // "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ + "skipLibCheck": true /* Skip type checking all .d.ts files. */ + } +} diff --git a/apps/video-server/package.json b/apps/video-server/package.json new file mode 100644 index 0000000..6a1b6b4 --- /dev/null +++ b/apps/video-server/package.json @@ -0,0 +1,26 @@ +{ + "name": "video-server", + "version": "1.0.0", + "main": "index.js", + "license": "MIT", + "scripts": { + "dev": "nodemon -r --exec ts-node ./src/index.ts", + "start": "npx tsc && node ./dist/index.js", + "format": "npx eslint . --ext .js,.jsx" + }, + "dependencies": { + "cors": "^2.8.5", + "express": "^4.19.2", + "socket.io": "^4.7.5", + "uuid": "^10.0.0" + }, + "devDependencies": { + "@types/express": "^4.17.13", + "@types/node-turn": "^0.0.1", + "@types/uuid": "^8.3.4", + "concurrently": "^8.2.2", + "nodemon": "^3.1.0", + "ts-node": "^10.9.2", + "typescript": "^4.5.5" + } +} \ No newline at end of file diff --git a/server/index.ts b/apps/video-server/src/index.ts similarity index 100% rename from server/index.ts rename to apps/video-server/src/index.ts diff --git a/server/types.ts b/apps/video-server/src/types.ts similarity index 100% rename from server/types.ts rename to apps/video-server/src/types.ts diff --git a/tsconfig.json b/apps/video-server/tsconfig.json similarity index 95% rename from tsconfig.json rename to apps/video-server/tsconfig.json index 04dc4db..f87506b 100644 --- a/tsconfig.json +++ b/apps/video-server/tsconfig.json @@ -1,7 +1,6 @@ { "compilerOptions": { /* Visit https://aka.ms/tsconfig.json to read more about this file */ - /* Projects */ // "incremental": true, /* Enable incremental compilation */ // "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */ @@ -9,7 +8,6 @@ // "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects */ // "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */ // "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */ - /* Language and Environment */ "target": "es2016" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */, // "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */ @@ -22,32 +20,29 @@ // "reactNamespace": "", /* Specify the object invoked for `createElement`. This only applies when targeting `react` JSX emit. */ // "noLib": true, /* Disable including any library files, including the default lib.d.ts. */ // "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */ - /* Modules */ "module": "commonjs" /* Specify what module code is generated. */, - "rootDir": "./server" /* Specify the root folder within your source files. */, - // "moduleResolution": "node", /* Specify how TypeScript looks up a file from a given module specifier. */ - // "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ - // "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */ + "rootDir": "./src", /* Specify the root folder within your a set of entries that re-map imports to additional lookup locations. */ // "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */ // "typeRoots": [], /* Specify multiple folders that act like `./node_modules/@types`. */ // "types": [], /* Specify type package names to be included without being referenced in a source file. */ // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ // "resolveJsonModule": true, /* Enable importing .json files */ // "noResolve": true, /* Disallow `import`s, `require`s or ``s from expanding the number of files TypeScript should add to a project. */ - /* JavaScript Support */ // "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the `checkJS` option to get errors from these files. */ // "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */ // "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from `node_modules`. Only applicable with `allowJs`. */ - /* Emit */ - // "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ + "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ // "declarationMap": true, /* Create sourcemaps for d.ts files. */ // "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */ // "sourceMap": true, /* Create source map files for emitted JavaScript files. */ - // "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If `declaration` is true, also designates a file that bundles all .d.ts output. */ - "outDir": "./dist/server" /* Specify an output folder for all emitted files. */, + // "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If `declaration` is true, also designates a file that bundles all .d.ts output. */source files. */, + // "moduleResolution": "node", /* Specify how TypeScript looks up a file from a given module specifier. */ + // "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ + // "paths": {}, /* Specify + "outDir": "./dist" /* Specify an output folder for all emitted files. */, // "removeComments": true, /* Disable emitting comments. */ // "noEmit": true, /* Disable emitting files from a compilation. */ // "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */ @@ -65,14 +60,12 @@ // "preserveConstEnums": true, /* Disable erasing `const enum` declarations in generated code. */ // "declarationDir": "./", /* Specify the output directory for generated declaration files. */ // "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */ - /* Interop Constraints */ // "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */ // "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */ "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables `allowSyntheticDefaultImports` for type compatibility. */, // "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */ "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */, - /* Type Checking */ "strict": true /* Enable all strict type-checking options. */, // "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied `any` type.. */ @@ -93,10 +86,13 @@ // "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type */ // "allowUnusedLabels": true, /* Disable error reporting for unused labels. */ // "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */ - /* Completeness */ // "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ "skipLibCheck": true /* Skip type checking all .d.ts files. */ }, - "exclude": ["node_modules", "frontend", "backend/dist"], -} + "exclude": [ + "node_modules", + "frontend", + "backend/dist" + ], +} \ No newline at end of file diff --git a/frontend/.dockerignore b/apps/web/.dockerignore similarity index 100% rename from frontend/.dockerignore rename to apps/web/.dockerignore diff --git a/apps/web/.eslintrc.js b/apps/web/.eslintrc.js new file mode 100644 index 0000000..7d644a4 --- /dev/null +++ b/apps/web/.eslintrc.js @@ -0,0 +1,9 @@ +/** @type {import("eslint").Linter.Config} */ +module.exports = { + root: true, + extends: ["@repo/eslint-config/next.js"], + parser: "@typescript-eslint/parser", + parserOptions: { + project: true, + }, +}; diff --git a/frontend/Dockerfile b/apps/web/Dockerfile similarity index 100% rename from frontend/Dockerfile rename to apps/web/Dockerfile diff --git a/apps/web/README.md b/apps/web/README.md new file mode 100644 index 0000000..a98bfa8 --- /dev/null +++ b/apps/web/README.md @@ -0,0 +1,36 @@ +This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/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.tsx`. The page auto-updates as you edit the file. + +This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) 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/app/building-your-application/deploying) for more details. diff --git a/frontend/src/actions/auth/check-username-unique.ts b/apps/web/app/actions/auth/check-username-unique.ts similarity index 88% rename from frontend/src/actions/auth/check-username-unique.ts rename to apps/web/app/actions/auth/check-username-unique.ts index 81749ed..d779594 100644 --- a/frontend/src/actions/auth/check-username-unique.ts +++ b/apps/web/app/actions/auth/check-username-unique.ts @@ -1,8 +1,8 @@ "use server"; -import { db } from "@/lib/db"; -import { usernameValidation } from "@/schemas/profileSchema"; +import { usernameValidation } from "@repo/common"; import { z } from "zod"; +import db from "@repo/db/client"; const UsernameQuerySchema = z.object({ username: usernameValidation, diff --git a/frontend/src/actions/auth/login.ts b/apps/web/app/actions/auth/login.ts similarity index 83% rename from frontend/src/actions/auth/login.ts rename to apps/web/app/actions/auth/login.ts index fd51808..460b617 100644 --- a/frontend/src/actions/auth/login.ts +++ b/apps/web/app/actions/auth/login.ts @@ -1,11 +1,11 @@ "use server"; import * as z from "zod"; -import { signIn } from "@/auth"; import { AuthError } from "next-auth"; -import { signInSchema } from "@/schemas/signinSchema"; import bcrypt from "bcryptjs"; import { getUserByIdentifier } from "../user/get-user"; +import { signInSchema } from "@repo/common"; +import { signIn } from "next-auth/react"; export async function login(values: z.infer) { const validatedFields = signInSchema.safeParse(values); @@ -16,12 +16,8 @@ export async function login(values: z.infer) { const { identifier, password } = validatedFields.data; const existingUser = await getUserByIdentifier(identifier); - if ( - !existingUser || - !existingUser.email || - !existingUser.username || - !existingUser.password - ) { + console.log(existingUser, "existingUser"); + if (!existingUser || !existingUser.email || !existingUser.username || !existingUser.password) { return { success: false, message: "Email does not exist!" }; } @@ -31,10 +27,7 @@ export async function login(values: z.infer) { message: "Email not verified. First verify email", }; } - const isPasswordCorrect = await bcrypt.compare( - password, - existingUser.password - ); + const isPasswordCorrect = await bcrypt.compare(password, existingUser.password); if (!isPasswordCorrect) { return { success: false, diff --git a/frontend/src/actions/auth/register.ts b/apps/web/app/actions/auth/register.ts similarity index 92% rename from frontend/src/actions/auth/register.ts rename to apps/web/app/actions/auth/register.ts index 9f5c055..00c2825 100644 --- a/frontend/src/actions/auth/register.ts +++ b/apps/web/app/actions/auth/register.ts @@ -1,10 +1,10 @@ "use server"; -import { db } from "@/lib/db"; -import { signUpSchema } from "@/schemas/signupSchema"; +import db from "@repo/db/client"; import { z } from "zod"; import bcrypt from "bcryptjs"; -import { sendVerificationEmail } from "@/helpers/sendVerificationEmail"; +import { signUpSchema } from "@repo/common"; +import { sendVerificationEmail } from "../../helpers/send-verification-mail"; export async function register(values: z.infer) { const validatedFields = signUpSchema.safeParse(values); @@ -51,7 +51,7 @@ export async function register(values: z.infer) { } else { const firstName = fullname.split(" ")[0]; const lastName = fullname.split(" ")[1] ?? ""; - const newUser = await db.user.create({ + await db.user.create({ data: { email, name: fullname, diff --git a/frontend/src/actions/auth/verify-code.ts b/apps/web/app/actions/auth/verify-code.ts similarity index 93% rename from frontend/src/actions/auth/verify-code.ts rename to apps/web/app/actions/auth/verify-code.ts index 997b877..71c0a6b 100644 --- a/frontend/src/actions/auth/verify-code.ts +++ b/apps/web/app/actions/auth/verify-code.ts @@ -1,8 +1,8 @@ "use server"; -import { db } from "@/lib/db"; -import { verifySchema } from "@/schemas/verifySchema"; import { z } from "zod"; +import db from "@repo/db/client"; +import { verifySchema } from "@repo/common"; type verifyCodeType = { username: string; diff --git a/frontend/src/actions/chat/delete-chat.ts b/apps/web/app/actions/chat/delete-chat.ts similarity index 92% rename from frontend/src/actions/chat/delete-chat.ts rename to apps/web/app/actions/chat/delete-chat.ts index 095fdcf..8c85153 100644 --- a/frontend/src/actions/chat/delete-chat.ts +++ b/apps/web/app/actions/chat/delete-chat.ts @@ -1,6 +1,5 @@ "use server"; - -import { db } from "@/lib/db"; +import db from "@repo/db/client"; type deleteChatType = { chatId: string; diff --git a/frontend/src/actions/chat/save-chat.ts b/apps/web/app/actions/chat/save-chat.ts similarity index 82% rename from frontend/src/actions/chat/save-chat.ts rename to apps/web/app/actions/chat/save-chat.ts index 12a0f66..592fd07 100644 --- a/frontend/src/actions/chat/save-chat.ts +++ b/apps/web/app/actions/chat/save-chat.ts @@ -1,7 +1,6 @@ "use server"; -import { db } from "@/lib/db"; -import { Chat } from "@prisma/client"; +import db from "@repo/db/client"; type saveChatType = { message: string; @@ -15,7 +14,7 @@ export async function saveChat({ receiver_id, }: saveChatType) { try { - const chat: Chat = await db.chat.create({ + await db.chat.create({ data: { message, sender_id, diff --git a/frontend/src/actions/chat/update-chat.ts b/apps/web/app/actions/chat/update-chat.ts similarity index 93% rename from frontend/src/actions/chat/update-chat.ts rename to apps/web/app/actions/chat/update-chat.ts index 5097c98..b9cce59 100644 --- a/frontend/src/actions/chat/update-chat.ts +++ b/apps/web/app/actions/chat/update-chat.ts @@ -1,6 +1,6 @@ "use server"; -import { db } from "@/lib/db"; +import db from "@repo/db/client"; type updateChatProps = { chatId: string; diff --git a/frontend/src/actions/user/get-user.ts b/apps/web/app/actions/user/get-user.ts similarity index 81% rename from frontend/src/actions/user/get-user.ts rename to apps/web/app/actions/user/get-user.ts index 6c2c6f2..5fea24c 100644 --- a/frontend/src/actions/user/get-user.ts +++ b/apps/web/app/actions/user/get-user.ts @@ -1,11 +1,9 @@ "use server"; -import { db } from "@/lib/db"; +import db from "@repo/db/client"; import { User } from "@prisma/client"; -export async function getUserByIdentifier( - identifier: string -): Promise { +export async function getUserByIdentifier(identifier: string): Promise { try { const user = await db.user.findFirst({ where: { diff --git a/frontend/src/actions/user/get-users.ts b/apps/web/app/actions/user/get-users.ts similarity index 84% rename from frontend/src/actions/user/get-users.ts rename to apps/web/app/actions/user/get-users.ts index 6fd7ba1..a332d64 100644 --- a/frontend/src/actions/user/get-users.ts +++ b/apps/web/app/actions/user/get-users.ts @@ -1,6 +1,6 @@ "use server"; -import { db } from "@/lib/db"; +import db from "@repo/db/client"; export async function getUsers() { try { diff --git a/apps/web/app/api/auth/[...nextauth]/route.ts b/apps/web/app/api/auth/[...nextauth]/route.ts new file mode 100644 index 0000000..267ea04 --- /dev/null +++ b/apps/web/app/api/auth/[...nextauth]/route.ts @@ -0,0 +1 @@ +export { GET, POST } from "../../../utils/auth"; diff --git a/frontend/src/app/api/serverInstance.ts b/apps/web/app/api/server-instance.ts similarity index 100% rename from frontend/src/app/api/serverInstance.ts rename to apps/web/app/api/server-instance.ts diff --git a/frontend/src/app/api/socket.ts b/apps/web/app/api/socket.ts similarity index 100% rename from frontend/src/app/api/socket.ts rename to apps/web/app/api/socket.ts diff --git a/frontend/emails/VerificationEmail.tsx b/apps/web/app/emails/verification-email.tsx similarity index 99% rename from frontend/emails/VerificationEmail.tsx rename to apps/web/app/emails/verification-email.tsx index c7605a5..e793739 100644 --- a/frontend/emails/VerificationEmail.tsx +++ b/apps/web/app/emails/verification-email.tsx @@ -7,7 +7,6 @@ import { Row, Section, Text, - Button, } from "@react-email/components"; import { AudioLines } from "lucide-react"; diff --git a/frontend/src/app/favicon.ico b/apps/web/app/favicon.ico similarity index 100% rename from frontend/src/app/favicon.ico rename to apps/web/app/favicon.ico diff --git a/apps/web/app/fonts/GeistMonoVF.woff b/apps/web/app/fonts/GeistMonoVF.woff new file mode 100644 index 0000000..f2ae185 Binary files /dev/null and b/apps/web/app/fonts/GeistMonoVF.woff differ diff --git a/apps/web/app/fonts/GeistVF.woff b/apps/web/app/fonts/GeistVF.woff new file mode 100644 index 0000000..1b62daa Binary files /dev/null and b/apps/web/app/fonts/GeistVF.woff differ diff --git a/frontend/src/lib/auth.ts b/apps/web/app/helpers/auth.ts similarity index 75% rename from frontend/src/lib/auth.ts rename to apps/web/app/helpers/auth.ts index 05acb66..b5b2ffa 100644 --- a/frontend/src/lib/auth.ts +++ b/apps/web/app/helpers/auth.ts @@ -1,4 +1,5 @@ -import { auth } from "@/auth"; +import { auth } from "../utils/auth"; + export async function currentUser() { const session = await auth(); diff --git a/frontend/src/helpers/peer.ts b/apps/web/app/helpers/peer.ts similarity index 100% rename from frontend/src/helpers/peer.ts rename to apps/web/app/helpers/peer.ts diff --git a/frontend/src/helpers/sendVerificationEmail.ts b/apps/web/app/helpers/send-verification-mail.ts similarity index 80% rename from frontend/src/helpers/sendVerificationEmail.ts rename to apps/web/app/helpers/send-verification-mail.ts index f0f5f2c..6d5bb50 100644 --- a/frontend/src/helpers/sendVerificationEmail.ts +++ b/apps/web/app/helpers/send-verification-mail.ts @@ -1,6 +1,6 @@ -import { resend } from "@/config/resend"; -import VerificationEmail from "../../emails/VerificationEmail"; -import { ApiResponse } from "@/types/ApiResponse"; +import { Resend } from "resend"; +import VerificationEmail from "../emails/verification-email"; +import { ApiResponse } from "@repo/common"; export async function sendVerificationEmail( email: string, @@ -8,6 +8,7 @@ export async function sendVerificationEmail( otp: string ): Promise { try { + const resend = new Resend(process.env.RESEND_API_KEY); const response = await resend.emails.send({ to: [email], subject: "MeetnChillChat | Verification Code", diff --git a/apps/web/app/layout.tsx b/apps/web/app/layout.tsx new file mode 100644 index 0000000..5b34e24 --- /dev/null +++ b/apps/web/app/layout.tsx @@ -0,0 +1,33 @@ +import "@repo/ui/globals"; +import type { Metadata } from "next"; +import localFont from "next/font/local"; +import { Providers } from "../components/provider"; + +const geistSans = localFont({ + src: "./fonts/GeistVF.woff", + variable: "--font-geist-sans", +}); +const geistMono = localFont({ + src: "./fonts/GeistMonoVF.woff", + variable: "--font-geist-mono", +}); + +export const metadata: Metadata = { + title: "MeetnChillChat", + description: + "Unlock the power of human connection with MeetnChillChat, where every interaction is an opportunity to broaden your horizons and enrich your life.", +}; + +export default function RootLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + return ( + + + {children} + + + ); +} diff --git a/frontend/src/middleware.ts b/apps/web/app/middleware.ts similarity index 93% rename from frontend/src/middleware.ts rename to apps/web/app/middleware.ts index dbc61bd..621533d 100644 --- a/frontend/src/middleware.ts +++ b/apps/web/app/middleware.ts @@ -1,5 +1,5 @@ import NextAuth from "next-auth"; -import authConfig from "@/auth.config"; +import authConfig from "./utils/auth.config"; const { auth } = NextAuth(authConfig); diff --git a/frontend/src/app/page.tsx b/apps/web/app/page.tsx similarity index 72% rename from frontend/src/app/page.tsx rename to apps/web/app/page.tsx index cc8a717..1a37fd3 100644 --- a/frontend/src/app/page.tsx +++ b/apps/web/app/page.tsx @@ -1,9 +1,7 @@ -import IconCardButton from "@/components/Icon-card-button"; -import JoinRoomForm from "@/components/JoinRoomForm"; -import Navbar from "@/components/Navbar"; -import { FlipWords } from "@/components/ui/filp-word"; -import GlobeSection from "@/components/Globe"; -import { Spotlight } from "@/components/ui/spot-light"; +import { FlipWords, Spotlight } from "@repo/ui"; +import IconCardButton from "../components/icon-card-button"; +import JoinRoomForm from "../components/join-room-form"; +import Navbar from "../components/navbar"; export default function Home() { const words = ["Omegal", "Google Meet", "Whatsapp"]; @@ -15,8 +13,10 @@ export default function Home() {
- Miss - ?
All in one Website for Meet +
+ Miss ? +
+ All in one Website for Meet
@@ -27,7 +27,6 @@ export default function Home() {
-
); diff --git a/frontend/src/app/room/group-chat/page.tsx b/apps/web/app/room/group-chat/page.tsx similarity index 100% rename from frontend/src/app/room/group-chat/page.tsx rename to apps/web/app/room/group-chat/page.tsx diff --git a/frontend/src/app/room/group-meet/[room]/page.tsx b/apps/web/app/room/group-meet/[room]/page.tsx similarity index 75% rename from frontend/src/app/room/group-meet/[room]/page.tsx rename to apps/web/app/room/group-meet/[room]/page.tsx index 1bb2abf..3c04acb 100644 --- a/frontend/src/app/room/group-meet/[room]/page.tsx +++ b/apps/web/app/room/group-meet/[room]/page.tsx @@ -1,12 +1,12 @@ "use client"; -import IncomingCallDialog from "@/components/IncomingCallDialog"; -import UsersList from "@/components/UsersList"; -import SetupAudioVideo from "@/components/SetupAudioVideo"; -import { ShareButton } from "@/components/ShareButton"; -import Dashboard from "@/components/MeetDashboard"; -import { useRoom } from "@/app/hooks/useRoom"; -import RoomNavbar from "@/components/RoomNavbar"; +import IncomingCallDialog from "../../../../components/incoming-call-dialogue"; +import RoomNavbar from "../../../../components/room-navbar"; +import SetupAudioVideo from "../../../../components/setup-audio-video"; +import { ShareButton } from "../../../../components/share-button"; +import UsersList from "../../../../components/user-list"; +import Dashboard from "../../../../components/video-dashboard"; +import { useRoom } from "../../../../hooks/use-room"; export default function Room() { const { diff --git a/frontend/src/app/room/group-video/[room]/page.tsx b/apps/web/app/room/group-video/[room]/page.tsx similarity index 75% rename from frontend/src/app/room/group-video/[room]/page.tsx rename to apps/web/app/room/group-video/[room]/page.tsx index 96c5430..10e6682 100644 --- a/frontend/src/app/room/group-video/[room]/page.tsx +++ b/apps/web/app/room/group-video/[room]/page.tsx @@ -1,12 +1,12 @@ "use client"; -import IncomingCallDialog from "@/components/IncomingCallDialog"; -import UsersList from "@/components/UsersList"; -import SetupAudioVideo from "@/components/SetupAudioVideo"; -import { ShareButton } from "@/components/ShareButton"; -import { useRoom } from "@/app/hooks/useRoom"; -import VideoDashboard from "@/components/VideoDashboard"; -import RoomNavbar from "@/components/RoomNavbar"; +import IncomingCallDialog from "../../../../components/incoming-call-dialogue"; +import RoomNavbar from "../../../../components/room-navbar"; +import SetupAudioVideo from "../../../../components/setup-audio-video"; +import { ShareButton } from "../../../../components/share-button"; +import UsersList from "../../../../components/user-list"; +import VideoDashboard from "../../../../components/video-dashboard"; +import { useRoom } from "../../../../hooks/use-room"; export default function Room() { const { diff --git a/frontend/src/app/room/layout.tsx b/apps/web/app/room/layout.tsx similarity index 86% rename from frontend/src/app/room/layout.tsx rename to apps/web/app/room/layout.tsx index 13ef3b8..5ffe37b 100644 --- a/frontend/src/app/room/layout.tsx +++ b/apps/web/app/room/layout.tsx @@ -1,4 +1,4 @@ -import { Spotlight } from "@/components/ui/spot-light"; +import { Spotlight } from "@repo/ui"; export default function Layout({ children, diff --git a/frontend/src/app/room/one-chat/page.tsx b/apps/web/app/room/one-chat/page.tsx similarity index 70% rename from frontend/src/app/room/one-chat/page.tsx rename to apps/web/app/room/one-chat/page.tsx index 01dd914..68fa740 100644 --- a/frontend/src/app/room/one-chat/page.tsx +++ b/apps/web/app/room/one-chat/page.tsx @@ -1,6 +1,7 @@ -import ChatRoomProfileSction from "@/components/ChatRoomProfileSction"; -import ChatRoomSearchSection from "@/components/ChatRoomSearchSection"; -import ChatRoomSection from "@/components/ChatRoomSection"; + +import ChatRoomProfileSction from "../../../components/chat-room-profile-section"; +import ChatRoomSearchSection from "../../../components/chat-room-search-section"; +import ChatRoomSection from "../../../components/chat-room-section"; export default function Room() { return ( diff --git a/frontend/src/app/room/one-meet/[room]/page.tsx b/apps/web/app/room/one-meet/[room]/page.tsx similarity index 75% rename from frontend/src/app/room/one-meet/[room]/page.tsx rename to apps/web/app/room/one-meet/[room]/page.tsx index 49957a7..96f054b 100644 --- a/frontend/src/app/room/one-meet/[room]/page.tsx +++ b/apps/web/app/room/one-meet/[room]/page.tsx @@ -1,12 +1,12 @@ "use client"; -import IncomingCallDialog from "@/components/IncomingCallDialog"; -import UsersList from "@/components/UsersList"; -import SetupAudioVideo from "@/components/SetupAudioVideo"; -import { ShareButton } from "@/components/ShareButton"; -import MeetDashboard from "@/components/MeetDashboard"; -import { useRoom } from "@/app/hooks/useRoom"; -import RoomNavbar from "@/components/RoomNavbar"; +import IncomingCallDialog from "../../../../components/incoming-call-dialogue"; +import MeetDashboard from "../../../../components/meet-dashboard"; +import RoomNavbar from "../../../../components/room-navbar"; +import SetupAudioVideo from "../../../../components/setup-audio-video"; +import { ShareButton } from "../../../../components/share-button"; +import UsersList from "../../../../components/user-list"; +import { useRoom } from "../../../../hooks/use-room"; export default function Room() { const { diff --git a/frontend/src/app/room/random-video/page.tsx b/apps/web/app/room/one-video/[room]/page.tsx similarity index 74% rename from frontend/src/app/room/random-video/page.tsx rename to apps/web/app/room/one-video/[room]/page.tsx index 49df2fa..66992c1 100644 --- a/frontend/src/app/room/random-video/page.tsx +++ b/apps/web/app/room/one-video/[room]/page.tsx @@ -1,12 +1,12 @@ "use client"; -import IncomingCallDialog from "@/components/IncomingCallDialog"; -import UsersList from "@/components/UsersList"; -import SetupAudioVideo from "@/components/SetupAudioVideo"; -import { ShareButton } from "@/components/ShareButton"; -import { useRoom } from "@/app/hooks/useRoom"; -import VideoDashboard from "@/components/VideoDashboard"; -import RoomNavbar from "@/components/RoomNavbar"; +import IncomingCallDialog from "../../../../components/incoming-call-dialogue"; +import RoomNavbar from "../../../../components/room-navbar"; +import SetupAudioVideo from "../../../../components/setup-audio-video"; +import { ShareButton } from "../../../../components/share-button"; +import UsersList from "../../../../components/user-list"; +import VideoDashboard from "../../../../components/video-dashboard"; +import { useRoom } from "../../../../hooks/use-room"; export default function Room() { const { @@ -31,12 +31,12 @@ export default function Room() { )} {!remoteSocketId && ( <> - {/* TODO: Implement different type of user list for random video call */} +

Group Chat

+

This page still under development. You can explore other functionality.

+ + ); +} diff --git a/frontend/src/auth.config.ts b/apps/web/app/utils/auth.config.ts similarity index 91% rename from frontend/src/auth.config.ts rename to apps/web/app/utils/auth.config.ts index 820544f..89bf86d 100644 --- a/frontend/src/auth.config.ts +++ b/apps/web/app/utils/auth.config.ts @@ -1,9 +1,9 @@ import type { NextAuthConfig } from "next-auth"; import Credentials from "next-auth/providers/credentials"; import Google from "next-auth/providers/google"; -import { signInSchema } from "./schemas/signinSchema"; import bcrypt from "bcryptjs"; -import { getUserByIdentifier } from "./actions/user/get-user"; +import { getUserByIdentifier } from "../actions/user/get-user"; +import { signInSchema } from "@repo/common"; export default { providers: [ diff --git a/frontend/src/auth.ts b/apps/web/app/utils/auth.ts similarity index 95% rename from frontend/src/auth.ts rename to apps/web/app/utils/auth.ts index 0c779c7..16482ca 100644 --- a/frontend/src/auth.ts +++ b/apps/web/app/utils/auth.ts @@ -1,9 +1,9 @@ import NextAuth from "next-auth"; import authConfig from "./auth.config"; -import { db } from "./lib/db"; import { PrismaAdapter } from "@auth/prisma-adapter"; import { User } from "@prisma/client"; -import { getUserById } from "./actions/user/get-user"; +import db from "@repo/db/client"; +import { getUserById } from "../actions/user/get-user"; export const { handlers: { GET, POST }, diff --git a/frontend/src/utils/color.ts b/apps/web/app/utils/color.ts similarity index 100% rename from frontend/src/utils/color.ts rename to apps/web/app/utils/color.ts diff --git a/frontend/src/app/data/functions.ts b/apps/web/app/utils/data.ts similarity index 100% rename from frontend/src/app/data/functions.ts rename to apps/web/app/utils/data.ts diff --git a/frontend/src/types/next-auth.d.ts b/apps/web/app/utils/next-auth.d.ts similarity index 100% rename from frontend/src/types/next-auth.d.ts rename to apps/web/app/utils/next-auth.d.ts diff --git a/frontend/src/utils/size.ts b/apps/web/app/utils/size.ts similarity index 100% rename from frontend/src/utils/size.ts rename to apps/web/app/utils/size.ts diff --git a/frontend/src/components/AudioVideoBar.tsx b/apps/web/components/audio-video-bar.tsx similarity index 92% rename from frontend/src/components/AudioVideoBar.tsx rename to apps/web/components/audio-video-bar.tsx index 1d62ad0..b52e182 100644 --- a/frontend/src/components/AudioVideoBar.tsx +++ b/apps/web/components/audio-video-bar.tsx @@ -1,10 +1,9 @@ -import React, { useEffect } from "react"; import ReactPlayer from "react-player"; -import { MediaStreamContext, ProviderProps } from "@/app/context/MediaStream"; -import { Button } from "./ui/button"; -import { Avatar, AvatarFallback, AvatarImage } from "./ui/avatar"; -import { User } from "@/type"; import { useSession } from "next-auth/react"; +import { User } from "@repo/common"; +import { Avatar, AvatarFallback, AvatarImage, Button } from "@repo/ui"; +import { useRecoilValue } from "recoil"; +import { remoteStreamsAtom, userStreamAtom } from "@repo/store"; interface AudioVideoBarProps { remoteUser: User | undefined; @@ -15,10 +14,8 @@ interface AudioVideoBarProps { const AudioVideoBar: React.FC = (props) => { const { pinVideoObj, pinVideo, unPinVideo, remoteUser } = props; - const { userStream, remoteStreams } = React.useContext( - MediaStreamContext - ) as ProviderProps; - + const userStream = useRecoilValue(userStreamAtom); + const remoteStreams = useRecoilValue(remoteStreamsAtom); const session = useSession(); const user = session.data?.user; return ( diff --git a/frontend/src/components/AudioVideoButton.tsx b/apps/web/components/audio-video-button.tsx similarity index 78% rename from frontend/src/components/AudioVideoButton.tsx rename to apps/web/components/audio-video-button.tsx index 0289278..466cf1e 100644 --- a/frontend/src/components/AudioVideoButton.tsx +++ b/apps/web/components/audio-video-button.tsx @@ -1,27 +1,26 @@ -import React, { useContext, useEffect } from "react"; +import React, { useEffect } from "react"; import { MicIcon, MicOffIcon, VideoIcon, VideoOffIcon } from "lucide-react"; import { - Tooltip, - TooltipContent, TooltipProvider, + Tooltip, TooltipTrigger, -} from "@/components/ui/tooltip"; + TooltipContent, + Button, +} from "@repo/ui"; +import { useStartUserStream } from "../hooks/use-start-stream"; +import { useStopUserStream } from "../hooks/use-stop-stream"; +import { useRecoilState, useRecoilValue } from "recoil"; import { - AudioVideoStreamContext, - AudioVideoStreamProps, -} from "@/app/context/AudioVideoStream"; -import { MediaStreamContext, ProviderProps } from "@/app/context/MediaStream"; -import { useStartUserStream } from "@/app/hooks/useStartStream"; -import { useStopUserStream } from "@/app/hooks/useStopStream"; - -import { Button } from "./ui/button"; + isAudioStreamEnabledAtom, + userStreamAtom, + isVideoStreamEnabledAtom, +} from "@repo/store"; function AudioVideoButton() { - const { audio, video, setAudio, setVideo } = React.useContext( - AudioVideoStreamContext - ) as AudioVideoStreamProps; - const { userStream } = useContext(MediaStreamContext) as ProviderProps; + const [audio, setAudio] = useRecoilState(isAudioStreamEnabledAtom); + const [video, setVideo] = useRecoilState(isVideoStreamEnabledAtom); + const userStream = useRecoilValue(userStreamAtom); const { handleStartAudioVideoStream } = useStartUserStream(); const { handleStopAudioVideoStream } = useStopUserStream(); diff --git a/frontend/src/components/AudioVideoDeviceDropDown.tsx b/apps/web/components/audio-video-device-drop-down.tsx similarity index 78% rename from frontend/src/components/AudioVideoDeviceDropDown.tsx rename to apps/web/components/audio-video-device-drop-down.tsx index aeeb251..640f669 100644 --- a/frontend/src/components/AudioVideoDeviceDropDown.tsx +++ b/apps/web/components/audio-video-device-drop-down.tsx @@ -1,28 +1,30 @@ -import { useContext } from "react"; -import { Button } from "@/components/ui/button"; import { + Button, DropdownMenu, + DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, + DropdownMenuSeparator, DropdownMenuRadioGroup, DropdownMenuRadioItem, - DropdownMenuSeparator, - DropdownMenuTrigger, -} from "@/components/ui/dropdown-menu"; +} from "@repo/ui"; +import { useRecoilState, useRecoilValue } from "recoil"; import { - AudioVideoDevicesContext, - AudioVideoDevicesProps, -} from "@/app/context/AudioVideoDevices"; + audioDevicesAtom, + selectedAudioDeviceAtom, + selectedVideoDeviceAtom, + videoDevicesAtom, +} from "@repo/store"; function AudioVideoDeviceDropDown() { - const { - audioDevices, - videoDevices, - selectedAudioDevice, - selectedVideoDevice, - setSelectedAudioDevice, - setSelectedVideoDevice, - } = useContext(AudioVideoDevicesContext) as AudioVideoDevicesProps; + const audioDevices = useRecoilValue(audioDevicesAtom); + const videoDevices = useRecoilValue(videoDevicesAtom); + const [selectedAudioDevice, setSelectedAudioDevice] = useRecoilState( + selectedAudioDeviceAtom + ); + const [selectedVideoDevice, setSelectedVideoDevice] = useRecoilState( + selectedVideoDeviceAtom + ); return (
diff --git a/frontend/src/components/ChatButton.tsx b/apps/web/components/chat-button.tsx similarity index 81% rename from frontend/src/components/ChatButton.tsx rename to apps/web/components/chat-button.tsx index 1cd9a1d..960b804 100644 --- a/frontend/src/components/ChatButton.tsx +++ b/apps/web/components/chat-button.tsx @@ -1,35 +1,26 @@ +import { MessageCircleMoreIcon, SendHorizonalIcon } from "lucide-react"; +import { useState, useRef, useEffect, useCallback } from "react"; +import MessageDiv from "./message-div"; +import FileTransfer from "./file-transfer"; +import FileCard from "./file-card"; +import { Message } from "@repo/common"; import { - MessageCircleMoreIcon, - SendHorizonalIcon, -} from "lucide-react"; -import { Textarea } from "@/components/ui/textarea"; -import { - Tooltip, - TooltipContent, + Button, TooltipProvider, + Tooltip, TooltipTrigger, -} from "@/components/ui/tooltip"; -import { Button } from "./ui/button"; -import { Sheet, + SheetTrigger, SheetContent, - SheetDescription, - SheetFooter, SheetHeader, SheetTitle, - SheetTrigger, -} from "@/components/ui/sheet"; -import { SocketContext } from "@/app/context/SocketContext"; -import { useState, useContext, useRef, useEffect, useCallback } from "react"; -import { Socket } from "socket.io-client"; -import { AvailableFiles, Message } from "@/type"; -import MessageDiv from "./MessageDiv"; -import FileTransfer from "./FileTransfer"; -import FileCard from "./FileCard"; -import { - FileTransferContext, - FileTransferProps, -} from "@/app/context/FileTransfer"; + SheetDescription, + SheetFooter, + Textarea, + TooltipContent, +} from "@repo/ui"; +import { useRecoilValue } from "recoil"; +import { availableFilesAtom, socketStateAtom } from "@repo/store"; function ChatButton(props: { remoteSocketId: string }) { const { remoteSocketId } = props; @@ -39,12 +30,8 @@ function ChatButton(props: { remoteSocketId: string }) { const [inputChatMessage, setInputChatMessage] = useState< string | undefined >(); - - const { availableFiles } = useContext( - FileTransferContext - ) as FileTransferProps; - - const socket = useContext(SocketContext) as Socket; + const socket = useRecoilValue(socketStateAtom); + const availableFiles = useRecoilValue(availableFilesAtom); const chatBoxContainerRef = useRef(null); const combined = [...availableFiles, ...messages].sort( (a, b) => a.timestamp - b.timestamp @@ -74,7 +61,7 @@ function ChatButton(props: { remoteSocketId: string }) { }, []); const submitMessage = () => { - if (inputChatMessage && inputChatMessage.length > 0) { + if (inputChatMessage && inputChatMessage.length > 0 && socket) { socket.emit("chat:message", { to: remoteSocketId, message: inputChatMessage, @@ -84,10 +71,10 @@ function ChatButton(props: { remoteSocketId: string }) { }; useEffect(() => { - socket.on("chat:message", handleOnMessage); + if (socket) socket.on("chat:message", handleOnMessage); return () => { - socket.off("chat:message", handleOnMessage); + if (socket) socket.off("chat:message", handleOnMessage); }; }, [handleOnMessage]); diff --git a/frontend/src/components/ChatRoomProfileSction.tsx b/apps/web/components/chat-room-profile-section.tsx similarity index 95% rename from frontend/src/components/ChatRoomProfileSction.tsx rename to apps/web/components/chat-room-profile-section.tsx index 77369fc..3d0e148 100644 --- a/frontend/src/components/ChatRoomProfileSction.tsx +++ b/apps/web/components/chat-room-profile-section.tsx @@ -1,6 +1,4 @@ -import { Button } from "@/components/ui/button"; -import { Label } from "@/components/ui/label"; -import { Switch } from "@/components/ui/switch"; +import { Button, Label, Switch } from "@repo/ui"; import { AudioLines, PhoneCallIcon, VideoIcon } from "lucide-react"; import Image from "next/image"; diff --git a/frontend/src/components/ChatRoomSearchSection.tsx b/apps/web/components/chat-room-search-section.tsx similarity index 96% rename from frontend/src/components/ChatRoomSearchSection.tsx rename to apps/web/components/chat-room-search-section.tsx index 50e1d8a..f22dcb6 100644 --- a/frontend/src/components/ChatRoomSearchSection.tsx +++ b/apps/web/components/chat-room-search-section.tsx @@ -1,10 +1,16 @@ "use client"; - -import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; -import { Button } from "@/components/ui/button"; -import { Input } from "@/components/ui/input"; -import { Separator } from "@/components/ui/separator"; -import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; +import { + Button, + Input, + Avatar, + AvatarImage, + AvatarFallback, + Separator, + Tabs, + TabsList, + TabsTrigger, + TabsContent, +} from "@repo/ui"; import { CheckIcon, Mail, diff --git a/frontend/src/components/ChatRoomSection.tsx b/apps/web/components/chat-room-section.tsx similarity index 100% rename from frontend/src/components/ChatRoomSection.tsx rename to apps/web/components/chat-room-section.tsx diff --git a/frontend/src/components/Common.tsx b/apps/web/components/common.tsx similarity index 95% rename from frontend/src/components/Common.tsx rename to apps/web/components/common.tsx index a9ff2ce..f9c4876 100644 --- a/frontend/src/components/Common.tsx +++ b/apps/web/components/common.tsx @@ -1,4 +1,4 @@ -import { cn } from "@/lib/utils"; +import { cn } from "@repo/ui/utils"; export function BottomGradient() { return ( diff --git a/frontend/src/components/EndMeetButton.tsx b/apps/web/components/end-meet-button.tsx similarity index 71% rename from frontend/src/components/EndMeetButton.tsx rename to apps/web/components/end-meet-button.tsx index 7ff2dd5..a966877 100644 --- a/frontend/src/components/EndMeetButton.tsx +++ b/apps/web/components/end-meet-button.tsx @@ -1,45 +1,35 @@ import { PhoneOffIcon } from "lucide-react"; -import React, { useContext } from "react"; -import { - MediaScreenStreamContext, - ProviderScreenProps, -} from "@/app/context/ScreenStream"; +import { useRouter } from "next/navigation"; import { - Tooltip, - TooltipContent, TooltipProvider, + Tooltip, TooltipTrigger, -} from "@/components/ui/tooltip"; -import { MediaStreamContext, ProviderProps } from "@/app/context/MediaStream"; -import { Button } from "./ui/button"; -import { - AudioVideoStreamContext, - AudioVideoStreamProps, -} from "@/app/context/AudioVideoStream"; -import { Socket } from "socket.io-client"; -import { SocketContext } from "@/app/context/SocketContext"; -import { useRouter } from "next/navigation"; -import { AlertDialog, - AlertDialogAction, - AlertDialogCancel, + AlertDialogTrigger, AlertDialogContent, - AlertDialogDescription, - AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, - AlertDialogTrigger, -} from "@/components/ui/alert-dialog"; -import { useStopUserStream } from "@/app/hooks/useStopStream"; + AlertDialogDescription, + AlertDialogFooter, + AlertDialogCancel, + AlertDialogAction, + TooltipContent, + Button, +} from "@repo/ui"; +import { useStopUserStream } from "../hooks/use-stop-stream"; +import { useRecoilValue } from "recoil"; +import { + socketStateAtom, + userScreenStreamAtom, + userStreamAtom, +} from "@repo/store"; function EndMeetButton() { const { handleStopAudioVideoStream, handleStopScreenShareStream } = useStopUserStream(); - const { userStream } = useContext(MediaStreamContext) as ProviderProps; - const { userScreenStream } = React.useContext( - MediaScreenStreamContext - ) as ProviderScreenProps; - const socket = React.useContext(SocketContext) as Socket; + const userStream = useRecoilValue(userStreamAtom); + const userScreenStream = useRecoilValue(userScreenStreamAtom); + const socket = useRecoilValue(socketStateAtom); const router = useRouter(); return ( @@ -75,7 +65,7 @@ function EndMeetButton() { if (userScreenStream) { handleStopScreenShareStream(); } - socket.emit("user-disconnect"); + if (socket) socket.emit("user-disconnect"); router.push("/"); }} > diff --git a/frontend/src/components/FileCard.tsx b/apps/web/components/file-card.tsx similarity index 90% rename from frontend/src/components/FileCard.tsx rename to apps/web/components/file-card.tsx index d0afecd..409a584 100644 --- a/frontend/src/components/FileCard.tsx +++ b/apps/web/components/file-card.tsx @@ -1,8 +1,8 @@ -import React, { useMemo } from "react"; +import React, { useCallback, useMemo } from "react"; import { DownloadCloudIcon, FileIcon } from "lucide-react"; -import { formatBytes } from "@/utils/size"; -import { AvailableFiles } from "@/type"; import moment from "moment"; +import { AvailableFiles } from "@repo/common"; +import { formatBytes } from "../app/utils/size"; type FileCardProps = { file: AvailableFiles; @@ -11,7 +11,7 @@ type FileCardProps = { function FileCard(props: FileCardProps) { const { file } = props; - const handleFileDownload = React.useCallback((file: AvailableFiles) => { + const handleFileDownload = useCallback((file: AvailableFiles) => { if (!file.blob) return; const blob = file.blob; const url = window.URL.createObjectURL(blob); diff --git a/frontend/src/components/FileTransfer.tsx b/apps/web/components/file-transfer.tsx similarity index 95% rename from frontend/src/components/FileTransfer.tsx rename to apps/web/components/file-transfer.tsx index 66724af..1cb42ff 100644 --- a/frontend/src/components/FileTransfer.tsx +++ b/apps/web/components/file-transfer.tsx @@ -1,17 +1,17 @@ -import useFileTransfer from "@/app/hooks/fileTransferStream"; import { + Button, + useToast, Dialog, + DialogTrigger, DialogContent, - DialogDescription, - DialogFooter, DialogHeader, DialogTitle, - DialogTrigger, -} from "@/components/ui/dialog"; + DialogDescription, + DialogFooter, +} from "@repo/ui"; import { FileIcon, PaperclipIcon } from "lucide-react"; import React, { useRef, useCallback, useState } from "react"; -import { Button } from "./ui/button"; -import { useToast } from "./ui/use-toast"; +import useFileTransfer from "../hooks/file-transfer-stream"; function FileTransfer() { const { toast } = useToast(); diff --git a/apps/web/components/globe.tsx b/apps/web/components/globe.tsx new file mode 100644 index 0000000..2901632 --- /dev/null +++ b/apps/web/components/globe.tsx @@ -0,0 +1,45 @@ +// "use client"; + +// import { motion } from "framer-motion"; +// import dynamic from "next/dynamic"; + +// const World = dynamic(() => import("@repo/ui").then((m) => m.World), { +// ssr: false, +// }); + +// function GlobeSection() { +// return ( +//
+//
+// +//

+// Best way to connect with people +//

+//

+// Connect with people around the world with just a click of a button. +// Best way to connect with people. +//

+// +//
+//
+// +//
+//
+//
+// ); +// } + +// export default GlobeSection; diff --git a/apps/web/components/icon-card-button.tsx b/apps/web/components/icon-card-button.tsx new file mode 100644 index 0000000..f8c019b --- /dev/null +++ b/apps/web/components/icon-card-button.tsx @@ -0,0 +1,29 @@ +import React from "react"; +import Link from "next/link"; +import { Meteors } from "@repo/ui"; +import { currentUser } from "../app/helpers/auth"; +import functions from "../app/utils/data"; +import { BackgroundGradient } from "@repo/ui"; + +const IconCardButton = async () => { + const user = await currentUser(); + return functions.map((f, i) => ( + +
+ +
+
+ {React.createElement(f.icon1)} + {React.createElement(f.icon2)} +
+

{f.title}

+

{f.subtitle}

+
+ + +
+ + )); +}; + +export default IconCardButton; diff --git a/frontend/src/components/IncomingCallDialog.tsx b/apps/web/components/incoming-call-dialogue.tsx similarity index 93% rename from frontend/src/components/IncomingCallDialog.tsx rename to apps/web/components/incoming-call-dialogue.tsx index c87a46a..71eaefd 100644 --- a/frontend/src/components/IncomingCallDialog.tsx +++ b/apps/web/components/incoming-call-dialogue.tsx @@ -1,19 +1,18 @@ "use client"; -import { IncomingCall } from "@/type"; +import { IncomingCall } from "@repo/common"; import { AlertDialog, - AlertDialogAction, - AlertDialogCancel, + AlertDialogTrigger, AlertDialogContent, - AlertDialogDescription, - AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, - AlertDialogTrigger, -} from "@/components/ui/alert-dialog"; - -import React, { useState } from "react"; + AlertDialogDescription, + AlertDialogFooter, + AlertDialogCancel, + AlertDialogAction, +} from "@repo/ui"; +import { useState } from "react"; function IncomingCallDialog(props: { incommingCallData: IncomingCall; diff --git a/frontend/src/components/JoinRoomForm.tsx b/apps/web/components/join-room-form.tsx similarity index 75% rename from frontend/src/components/JoinRoomForm.tsx rename to apps/web/components/join-room-form.tsx index 4cd8dc2..6ae9952 100644 --- a/frontend/src/components/JoinRoomForm.tsx +++ b/apps/web/components/join-room-form.tsx @@ -1,8 +1,8 @@ -import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; -import RoomIdForm from "./RoomIdForm"; -import SignInForm from "./SignInForm"; -import SignupForm from "./SignupForm"; -import { currentUser } from "@/lib/auth"; +import { Tabs, TabsList, TabsTrigger, TabsContent } from "@repo/ui"; +import { currentUser } from "../app/helpers/auth"; +import RoomIdForm from "./room-id-form"; +import SignInForm from "./sign-in-form"; +import SignupForm from "./sign-up-form"; async function JoinRoomForm() { const user = await currentUser(); diff --git a/frontend/src/components/LogoutButton.tsx b/apps/web/components/logout-button.tsx similarity index 90% rename from frontend/src/components/LogoutButton.tsx rename to apps/web/components/logout-button.tsx index 4011e1a..f21c32a 100644 --- a/frontend/src/components/LogoutButton.tsx +++ b/apps/web/components/logout-button.tsx @@ -1,8 +1,8 @@ "use client"; import React from "react"; -import { Button } from "./ui/button"; import { signOut } from "next-auth/react"; +import { Button } from "@repo/ui"; function LogoutButton(user: { user: any }) { if (!user) { diff --git a/frontend/src/components/MeetControllerBar.tsx b/apps/web/components/meet-controller-bar.tsx similarity index 80% rename from frontend/src/components/MeetControllerBar.tsx rename to apps/web/components/meet-controller-bar.tsx index e1545ef..0a80fe0 100644 --- a/frontend/src/components/MeetControllerBar.tsx +++ b/apps/web/components/meet-controller-bar.tsx @@ -5,38 +5,29 @@ import { CircleIcon, PresentationIcon, } from "lucide-react"; + +import EndMeetButton from "./end-meet-button"; +import SettingButton from "./setting-button"; +import ChatButton from "./chat-button"; +import AudioVideoButton from "./audio-video-button"; import { - MediaScreenStreamContext, - ProviderScreenProps, -} from "@/app/context/ScreenStream"; -import { - Tooltip, - TooltipContent, + Button, TooltipProvider, + Tooltip, TooltipTrigger, -} from "@/components/ui/tooltip"; - -import { Button } from "./ui/button"; -import EndMeetButton from "./EndMeetButton"; -import SettingButton from "./SettingButton"; -import { useStartUserStream } from "@/app/hooks/useStartStream"; -import { useStopUserStream } from "@/app/hooks/useStopStream"; -import ChatButton from "./ChatButton"; -import AudioVideoButton from "./AudioVideoButton"; + TooltipContent, +} from "@repo/ui"; +import { useStartUserStream } from "../hooks/use-start-stream"; +import { useStopUserStream } from "../hooks/use-stop-stream"; +import { useRecoilValue } from "recoil"; +import { userScreenStreamAtom } from "@repo/store"; const MeetControllerBar = (props: { remoteSocketId: string }) => { const { remoteSocketId } = props; - - const { userScreenStream } = React.useContext( - MediaScreenStreamContext - ) as ProviderScreenProps; - + const userScreenStream = useRecoilValue(userScreenStreamAtom); const [whiteboard, setWhiteboard] = useState(true); - - const { handleStartScreenShareStream } = - useStartUserStream(); - const { handleStopScreenShareStream } = - useStopUserStream(); + const { handleStartScreenShareStream } = useStartUserStream(); + const { handleStopScreenShareStream } = useStopUserStream(); return (
diff --git a/frontend/src/components/MeetDashboard.tsx b/apps/web/components/meet-dashboard.tsx similarity index 77% rename from frontend/src/components/MeetDashboard.tsx rename to apps/web/components/meet-dashboard.tsx index 430a1fe..d7406f5 100644 --- a/frontend/src/components/MeetDashboard.tsx +++ b/apps/web/components/meet-dashboard.tsx @@ -2,15 +2,16 @@ import React, { useState } from "react"; import ReactPlayer from "react-player"; -import { AiFillPushpin } from "react-icons/ai"; -import AudioVideoBar from "./AudioVideoBar"; -import { MediaStreamContext, ProviderProps } from "@/app/context/MediaStream"; +import AudioVideoBar from "./audio-video-bar"; +import MeetControllerBar from "./meet-controller-bar"; +import { User } from "@repo/common"; +import { PinIcon } from "lucide-react"; +import { useRecoilValue } from "recoil"; import { - MediaScreenStreamContext, - ProviderScreenProps, -} from "@/app/context/ScreenStream"; -import MeetControllerBar from "./MeetControllerBar"; -import { User } from "@/type"; + remoteStreamsAtom, + userScreenStreamAtom, + userStreamAtom, +} from "@repo/store"; interface DashboardProps { remoteSocketId: string; @@ -20,14 +21,9 @@ interface DashboardProps { const MeetDashboard: React.FC = (props) => { const { remoteSocketId, whiteboardID, remoteUser } = props; - - const { userStream, remoteStreams } = React.useContext( - MediaStreamContext - ) as ProviderProps; - - const { userScreenStream } = React.useContext( - MediaScreenStreamContext - ) as ProviderScreenProps; + const userStream = useRecoilValue(userStreamAtom); + const remoteStreams = useRecoilValue(remoteStreamsAtom); + const userScreenStream = useRecoilValue(userScreenStreamAtom); const [pinVideo, setPinVideo] = useState(null); @@ -69,11 +65,7 @@ const MeetDashboard: React.FC = (props) => { className="absolute top-[50%] left-0 right-0 hid den group-hover:block" onClick={handleUnPinVideo} > - +
) : ( diff --git a/frontend/src/components/MessageDiv.tsx b/apps/web/components/message-div.tsx similarity index 92% rename from frontend/src/components/MessageDiv.tsx rename to apps/web/components/message-div.tsx index 369171e..8eb1a82 100644 --- a/frontend/src/components/MessageDiv.tsx +++ b/apps/web/components/message-div.tsx @@ -1,7 +1,7 @@ -import { Message } from "@/type"; import React from "react"; -import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import moment from "moment"; +import { Message } from "@repo/common"; +import { Avatar, AvatarImage, AvatarFallback } from "@repo/ui"; function MessageDiv(props: Message) { const { from, message, isSelf, displayPicture, timestamp } = props; diff --git a/frontend/src/components/Navbar.tsx b/apps/web/components/navbar.tsx similarity index 71% rename from frontend/src/components/Navbar.tsx rename to apps/web/components/navbar.tsx index 82aa189..e498384 100644 --- a/frontend/src/components/Navbar.tsx +++ b/apps/web/components/navbar.tsx @@ -1,16 +1,16 @@ import React from "react"; import { AudioLines } from "lucide-react"; -import UserAvatar from "./UserAvatar"; -import LogoutButton from "./LogoutButton"; -import { currentUser } from "@/lib/auth"; +import UserAvatar from "./user-avatar"; +import LogoutButton from "./logout-button"; +import { currentUser } from "../app/helpers/auth"; const Navbar = async () => { const user = await currentUser(); return (