V4

.env.example

@@ -1,8 +1,5 @@
-NEXT_PUBLIC_API_KEY = 
-
+API_KEY = 
 NEXT_PUBLIC_READ_ACCESS_TOKEN = 
-
 NEXTAUTH_SECRET = 
-NEXT_PUBLIC_MS_CLARITY_TAG = 
 
 NEXTAUTH_URL="http://localhost:3000"

.eslintrc.json

@@ -1,27 +1,35 @@
 {
-  "extends": "next/core-web-vitals",
+  "extends": ["next/core-web-vitals", "plugin:@typescript-eslint/recommended"],
+  "parser": "@typescript-eslint/parser",
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
   "parserOptions": {
     "ecmaVersion": 2021,
     "sourceType": "module"
   },
-  "env": {
-    "browser": true,
-    "es2021": true,
-    "node": true
-  },
   "rules": {
-    "no-unused-vars": "error",
-    "no-undef": "error",
+    "@typescript-eslint/no-unused-vars": "error",
     "no-duplicate-imports": "error",
     "import/order": [
       "error",
       {
-        "groups": ["builtin", "external", "parent", "sibling", "index"],
+        "groups": ["type", "builtin", "external", "internal", "parent", "sibling", "index"],
         "alphabetize": {
           "order": "asc",
           "caseInsensitive": true
-        }
+        },
+        "newlines-between": "always"
       }
     ]
-  }
+  },
+  "overrides": [
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {
+        "no-undef": "error" // Apply this rule only to JS/JSX files
+      }
+    }
+  ]
 }

.gitignore

@@ -32,3 +32,7 @@ yarn-error.log*
 
 # vercel
 .vercel
+
+# pwa
+public/sw.js
+public/workbox-*.js

.nvmrc

@@ -1 +1 @@
-20.9.0
+20.14.0

.prettierignore

@@ -0,0 +1,2 @@
+/.next
+/*-lock.*

.prettierrc.json

@@ -0,0 +1,8 @@
+{
+  "plugins": ["prettier-plugin-tailwindcss"],
+  "jsxSingleQuote": true,
+  "bracketSameLine": true,
+  "bracketSpacing": true,
+  "trailingComma": "none",
+  "printWidth": 150
+}

README.md

@@ -4,4 +4,4 @@
 
 ## Previews
 
-![](/public/Images/ShowCase.webp)
+![](/public/images/ShowCase.webp)

next-env.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/pages/api-reference/config/typescript for more information.

next.config.js → next.config.ts

@@ -1,13 +1,19 @@
-const withPWA = require("next-pwa")({
+import { NextConfig } from "next";
+
+/* eslint-disable @typescript-eslint/no-var-requires */
+const withPWA = require("@ducanh2912/next-pwa").default({
   dest: "public",
+  reloadOnOnline: true,
   register: true,
-  skipWaiting: true,
-  disable: process.env.NODE_ENV === "development"
+  workboxOptions: {
+    disableDevLogs: true,
+    exclude: [/dynamic-css-manifest\.json$/]
+  }
 });
 
 const cspHeader = `
-    default-src *;
-    script-src 'self' 'unsafe-eval' 'unsafe-inline' https://www.clarity.ms/;
+    default-src * 'unsafe-inline' 'unsafe-eval' data: blob:;
+    script-src * 'unsafe-inline' 'unsafe-eval' data: blob:;
     style-src 'self' 'unsafe-inline';
     img-src * data:;
     font-src 'self' data:;
@@ -19,7 +25,7 @@ const cspHeader = `
     upgrade-insecure-requests;
   `;
 
-const nextConfig = {
+const nextConfig: NextConfig = {
   async headers() {
     return [
       {

package.json

@@ -5,29 +5,52 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint",
-    "lint-fix": "eslint --fix --ext .js,.jsx ."
+    "lint": "next lint && prettier --check .",
+    "lint-fix": "eslint --fix --ext .js,.jsx,.ts,.tsx . && prettier --write \"src/**/*.{js,jsx,ts,tsx,json,css,md}\""
   },
   "dependencies": {
+    "@ducanh2912/next-pwa": "^10.2.9",
+    "@radix-ui/react-popover": "^1.1.5",
+    "@radix-ui/react-select": "^2.1.2",
     "@suyalcinkaya/gauge": "^0.1.0",
+    "clsx": "^2.1.1",
     "extract-colors": "^4.0.2",
-    "framer-motion": "10.12.2",
+    "hex-to-rgba": "^2.0.1",
     "jotai": "^2.9.0",
-    "next": "^14.2.3",
+    "keen-slider": "^6.8.6",
+    "logrocket": "^9.0.2",
+    "lucide-react": "^0.454.0",
+    "motion": "^11.14.4",
+    "next": "^15.1.0",
     "next-auth": "^4.20.1",
-    "next-pwa": "^5.5.6",
-    "react": "18.2.0",
-    "react-dom": "18.2.0",
+    "next-navigation-guard": "^0.1.2",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "react-icons": "^4.12.0",
     "react-markdown": "^8.0.3",
     "rehype-raw": "^7.0.0",
-    "styled-components": "^6.1.8"
+    "sonner": "^1.7.2",
+    "styled-components": "^6.1.8",
+    "tailwind-merge": "^2.5.2",
+    "tailwindcss-animate": "^1.0.7",
+    "throttle-debounce": "^5.0.2",
+    "typescript": "5.3.3",
+    "vaul": "^1.1.2"
   },
   "devDependencies": {
-    "autoprefixer": "^10.4.16",
-    "eslint": "8.4.1",
-    "eslint-config-next": "^14.2.3",
-    "postcss": "^8.4.32",
-    "tailwindcss": "^3.4.3"
+    "@types/node": "20.11.16",
+    "@types/react": "18.2.53",
+    "@types/react-dom": "18.2.18",
+    "@types/throttle-debounce": "^5.0.2",
+    "@typescript-eslint/eslint-plugin": "^6.20.0",
+    "@typescript-eslint/parser": "^6.20.0",
+    "autoprefixer": "^10.4.20",
+    "eslint": "8.56.0",
+    "eslint-config-next": "14.2.3",
+    "postcss": "^8.4.49",
+    "prettier": "^3.2.5",
+    "prettier-plugin-tailwindcss": "^0.5.3",
+    "tailwindcss": "^3.4.15",
+    "webpack": "^5.98.0"
   }
 }

postcss.config.js

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

public/manifest.json

@@ -1,12 +1,13 @@
 {
   "name": "Cinephiled",
   "short_name": "Cinephiled",
+  "description": "Cinephiled - A progressive web app (PWA) to preview any movie or tv show with reviews, ratings, description and posters. Acting as a TMDB client, Cinephiled gives you access to login into your TMDB account and add movies or tv shows to your watchlist, set as favorites, rate and get personalized recommendations.",
   "theme_color": "#121212",
   "background_color": "#121212",
   "display": "standalone",
+  "orientation": "portrait",
   "scope": "/",
   "start_url": "/",
-
   "icons": [
     {
       "src": "maskable.png",
@@ -18,5 +19,6 @@
     { "src": "logo256.png", "sizes": "256x256", "type": "image/png" },
     { "src": "logo384.png", "sizes": "384x384", "type": "image/png" },
     { "src": "logo512.png", "sizes": "512x512", "type": "image/png" }
-  ]
+  ],
+  "categories": ["entertainment", "movies"]
 }

public/robots.txt

@@ -2,6 +2,7 @@ User-agent: *
 Disallow: /movies/
 Disallow: /tv/
 Disallow: /person/
+Disallow: /collections/
 Disallow: /*.jpg$
 Disallow: /*.jpeg$
 Disallow: /*.png$
@@ -11,7 +12,6 @@ Disallow: /*.webp$
 Disallow: /*.svg$
 Disallow: /en/
 Disallow: /m/
-Disallow: /collection/
 
 # Allow these images
 Allow: /logo192.png