My app doesn't work after deployed on github pages(create-react-app)

Question

I have tried to deploy my app throw Github Pages, It was built using create-react-app, material-ui, redux, redux-saga. I believe it might have something to do with routes

though when I tried to publish it to get reviews, I got those errors:

Error with Permissions-Policy header: Unrecognized feature: 'interest-cohort'.
react-dom.production.min.js:216 TypeError: Cannot read property 'row' of undefined
    at user-posts.page.js:46
    at oa (react-dom.production.min.js:157)
    at Hu (react-dom.production.min.js:267)
    at jl (react-dom.production.min.js:250)
    at El (react-dom.production.min.js:250)
    at Sl (react-dom.production.min.js:250)
    at vl (react-dom.production.min.js:243)
    at fl (react-dom.production.min.js:237)
    at Xl (react-dom.production.min.js:285)
    at react-dom.production.min.js:289
uu @ react-dom.production.min.js:216
n.callback @ react-dom.production.min.js:216
di @ react-dom.production.min.js:131
hu @ react-dom.production.min.js:220
Ml @ react-dom.production.min.js:259
t.unstable_runWithPriority @ scheduler.production.min.js:18
$o @ react-dom.production.min.js:122
Pl @ react-dom.production.min.js:252
vl @ react-dom.production.min.js:243
fl @ react-dom.production.min.js:237
Xl @ react-dom.production.min.js:285
(anonymous) @ react-dom.production.min.js:289
gl @ react-dom.production.min.js:244
rs @ react-dom.production.min.js:289
t.render @ react-dom.production.min.js:296
154 @ index.js:12
a @ (index):1
t @ (index):1
r @ (index):1
(anonymous) @ main.4bfcaa8c.chunk.js:1
react-dom.production.min.js:260 Uncaught TypeError: Cannot read property 'row' of undefined
    at user-posts.page.js:46
    at oa (react-dom.production.min.js:157)
    at Hu (react-dom.production.min.js:267)
    at jl (react-dom.production.min.js:250)
    at El (react-dom.production.min.js:250)
    at Sl (react-dom.production.min.js:250)
    at vl (react-dom.production.min.js:243)
    at fl (react-dom.production.min.js:237)
    at Xl (react-dom.production.min.js:285)
    at react-dom.production.min.js:289

and here is my Package.json:

    {
  "name": "re-deploy-task",
  "homepage": "https://kyrolosmagdy.github.io/task",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-ui/core": "^4.11.4",
    "@material-ui/icons": "^4.11.2",
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "axios": "^0.21.1",
    "moment": "^2.29.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-moment": "^1.1.1",
    "react-redux": "^7.2.4",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.3",
    "redux-logger": "^3.0.6",
    "redux-saga": "^1.1.3",
    "web-vitals": "^1.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "gh-pages": "^3.2.0"
  }
}

Things I have tried: 1- create a new repo and pushes to it, try to rebuild it into there, it didn't work also. 2- create a new create-react-app, push it to github, redeploy, it works but not with that code.

please if anyone has any idea on how to solve it, don't hesitate to contact me.

Answer 1

Everything looks good mate but try running

1. npm run build
2. npm run deploy

or just

1. npm run deploy