Develop

.gitignore

@@ -38,3 +38,4 @@ next-env.d.ts
 public/original
 launch.json
 .github/workflows/main.yaml
+.zed

.husky/pre-commit

@@ -1,2 +1,3 @@
 # npm run format && npm run lint
-npx lint-staged
+# npx lint-staged
+pnpm run format && pnpm run format:imports

.vscode/extensions.json

@@ -0,0 +1,8 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "bradlc.vscode-tailwindcss",
+    "ms-vscode.vscode-typescript-next"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,45 @@
+// {
+//   "editor.codeActionsOnSave": {
+//     "source.organizeImports": "explicit",
+//     "source.fixAll.eslint": "explicit"
+//   },
+//   "editor.formatOnSave": true,
+//   "[typescript]": {
+//     "editor.codeActionsOnSave": {
+//       "source.organizeImports": "explicit",
+//       "source.fixAll.eslint": "explicit"
+//     }
+//   },
+//   "[typescriptreact]": {
+//     "editor.codeActionsOnSave": {
+//       "source.organizeImports": "explicit",
+//       "source.fixAll.eslint": "explicit"
+//     }
+//   },
+//   "[javascript]": {
+//     "editor.codeActionsOnSave": {
+//       "source.organizeImports": "explicit",
+//       "source.fixAll.eslint": "explicit"
+//     }
+//   },
+//   "[javascriptreact]": {
+//     "editor.codeActionsOnSave": {
+//       "source.organizeImports": "explicit",
+//       "source.fixAll.eslint": "explicit"
+//     }
+//   },
+//   "eslint.validate": [
+//     "javascript",
+//     "javascriptreact",
+//     "typescript",
+//     "typescriptreact"
+//   ],
+//   "files.autoSave": "onFocusChange",
+//   "files.watcherExclude": {
+//     "**/.git/objects/**": true,
+//     "**/.git/subtree-cache/**": true,
+//     "**/node_modules/**": true,
+//     "**/.next/**": true,
+//     "**/dist/**": true
+//   }
+// }

README.md

@@ -82,6 +82,12 @@ And that's it! Your `SkateHub Frontend` should now be up and running locally on
 
 ### 2025
 
+- 2025-12-12 - Implements a user stories feature [#131](https://github.com/jpcmf/Frontend-GraduateProgram-FullStack-2024/pull/131) _(v0.2.1)_
+- 2025-11-13 - Bump Next.js version [#128](https://github.com/jpcmf/Frontend-GraduateProgram-FullStack-2024/pull/128) _(v0.2.0)_
+- 2025-11-03 - Add UserProfile component to display user information [#126](https://github.com/jpcmf/Frontend-GraduateProgram-FullStack-2024/pull/126) _(v0.1.37)_
+- 2025-11-03 - Standardize validation messages [#125](https://github.com/jpcmf/Frontend-GraduateProgram-FullStack-2024/pull/125) _(v0.1.36)_
+- 2025-11-01 - Add category definition [#124](https://github.com/jpcmf/Frontend-GraduateProgram-FullStack-2024/pull/124) _(v0.1.35)_
+- 2025-09-25 - Add ESLint packages to devDependencies for improved linting support [#121](https://github.com/jpcmf/Frontend-GraduateProgram-FullStack-2024/pull/121) _(v0.1.34)_
 - 2025-01-15 - Move authentication logic to user edit page [#116](https://github.com/jpcmf/Frontend-GraduateProgram-FullStack-2024/pull/116) _(v0.1.33)_
 
 ### 2024

eslint.config.mjs

@@ -1,13 +1,99 @@
-import path from "node:path";
-import { fileURLToPath } from "node:url";
 import js from "@eslint/js";
-import { FlatCompat } from "@eslint/eslintrc";
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-const compat = new FlatCompat({
-    baseDirectory: __dirname,
-    recommendedConfig: js.configs.recommended,
-    allConfig: js.configs.all
-});
-export default [...compat.extends("next/core-web-vitals")];
+import nextPlugin from "@next/eslint-plugin-next";
+import importPlugin from "eslint-plugin-import";
+import reactPlugin from "eslint-plugin-react";
+import reactHooksPlugin from "eslint-plugin-react-hooks";
+import simpleImportSort from "eslint-plugin-simple-import-sort";
+import unusedImports from "eslint-plugin-unused-imports";
+import globals from "globals";
+import tseslint from "typescript-eslint";
+
+export default tseslint.config(
+  js.configs.recommended,
+  ...tseslint.configs.recommended,
+  {
+    ignores: [
+      "**/.next/**",
+      "**/node_modules/**",
+      "**/dist/**",
+      "**/coverage/**",
+    ],
+  },
+  {
+    files: ["**/*.{js,mjs,cjs,jsx,ts,tsx}"],
+    plugins: {
+      "@next/next": nextPlugin,
+      "react": reactPlugin,
+      "react-hooks": reactHooksPlugin,
+      "simple-import-sort": simpleImportSort,
+      "import": importPlugin,
+      "unused-imports": unusedImports,
+    },
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.node,
+        ...globals.es2021,
+      },
+      parserOptions: {
+        ecmaVersion: "latest",
+        sourceType: "module",
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+    },
+    settings: {
+      react: {
+        version: "detect",
+      },
+    },
+    rules: {
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/no-unused-vars": "off",
+      // React rules
+      "react/react-in-jsx-scope": "off",
+      "react/prop-types": "off",
+      ...reactHooksPlugin.configs.recommended.rules,
+      // Next.js rules
+      ...nextPlugin.configs.recommended.rules,
+      ...nextPlugin.configs["core-web-vitals"].rules,
+
+      // Import sorting
+      "simple-import-sort/imports": [
+        "error",
+        {
+          groups: [
+            ["^node:"],
+            ["^react", "^next"],
+            ["^@?\\w"],
+            ["^@/"],
+            ["^\\.\\.(?!/?$)", "^\\.\\./?$"],
+            ["^\\./(?=.*/)(?!/?$)", "^\\.(?!/?$)", "^\\./?$"],
+            ["^.+\\.s?css$"],
+          ],
+        },
+      ],
+      "simple-import-sort/exports": "error",
+
+      // Import rules
+      "import/first": "error",
+      "import/newline-after-import": "error",
+      "import/no-duplicates": "error",
+      "import/no-unresolved": "off",
+      "import/order": "off",
+
+      // Unused imports
+      "unused-imports/no-unused-imports": "error",
+      "unused-imports/no-unused-vars": [
+        "warn",
+        {
+          vars: "all",
+          varsIgnorePattern: "^_",
+          args: "after-used",
+          argsIgnorePattern: "^_",
+        },
+      ],
+    },
+  },
+);

package.json

@@ -1,55 +1,70 @@
 {
   "name": "skatehub-frontend",
-  "version": "0.1.32",
+  "version": "0.2.1",
   "private": true,
   "scripts": {
     "dev": "next dev",
     "build": "next build",
+    "prebuild": "pnpm run format:imports",
     "start": "next start",
     "lint": "next lint",
+    "lint:fix": "next lint --fix",
     "format": "prettier --write \"**/*.{ts,tsx,js,jsx,md,mdx,css,yaml,yml}\"",
+    "format:imports": "eslint \"src/**/*.{ts,tsx}\" --fix",
     "check": "prettier --check \"**/*.{ts,tsx,js,jsx,md,mdx,css,yaml,yml}\"",
     "prepare": "husky"
   },
   "dependencies": {
+    "@chakra-ui/anatomy": "^2.3.4",
     "@chakra-ui/next-js": "^2.4.2",
     "@chakra-ui/react": "^2.10.3",
     "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",
     "@hookform/resolvers": "^3.9.1",
-    "axios": "^1.7.7",
+    "@tanstack/react-query": "^5.90.2",
+    "axios": "^1.12.2",
+    "boring-avatars": "^2.0.4",
     "framer-motion": "^11.11.11",
-    "next": "latest",
+    "next": "16.0.7",
     "next-auth": "^4.24.10",
     "nodemailer": "^6.9.16",
     "nookies": "^2.5.2",
-    "react": "latest",
-    "react-dom": "latest",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
     "react-google-recaptcha": "^3.1.0",
     "react-hook-form": "^7.53.1",
     "react-icons": "^5.3.0",
+    "react-insta-stories": "^2.8.0",
     "zod": "^3.23.8"
   },
   "devDependencies": {
+    "@eslint/eslintrc": "^3.1.0",
+    "@eslint/js": "^9.36.0",
     "@types/cookie": "^0.6.0",
-    "@types/node": "latest",
+    "@types/node": "^20",
     "@types/nodemailer": "^6.4.16",
-    "@types/react": "latest",
-    "@types/react-dom": "latest",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
     "@types/react-google-recaptcha": "^2.1.9",
-    "eslint": "latest",
-    "eslint-config-next": "latest",
+    "eslint": "^9",
+    "eslint-config-next": "16.0.1",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
+    "eslint-plugin-unused-imports": "^4.1.4",
+    "globals": "^16.5.0",
     "husky": "^9.1.6",
     "lint-staged": "^15.2.10",
     "prettier": "^3.3.3",
-    "typescript": "latest"
+    "typescript": "^5",
+    "typescript-eslint": "^8.46.4"
   },
   "lint-staged": {
     "src/**/*.{ts,tsx,js,jsx,md,mdx,css,yaml,yml}": [
       "prettier --write"
     ],
     "src/**/*.{ts,tsx,js,jsx}": [
-      "eslint"
+      "eslint --fix"
     ]
-  }
-}
+  },
+  "packageManager": "pnpm@9.15.9"
+}