NextJs 13.4.4 fails to load when "server action" and middelware are present

Question

I have a "use client" form with a "server side" action function. Whe the middlewear is acting upon the route of that form, the app fails to render with this error.

Client side Form. page.jsx

"use client"

import {
  Container,
  Avatar,
  Button,
  CssBaseline,
  TextField,
  FormControlLabel,
  Checkbox,
  Link,
  Grid,
  Box,
  Typography,
} from 'components/mui';
import { peformSubmit } from './formSubmit';

export const SignInSide = () => {
  
  const action = async (e) => {
    await peformSubmit(e)
  }  

return (
  <Container component="main" maxWidth="xs">
    <CssBaseline />
    <Box
      sx={{
        marginTop: 8,
        display: 'flex',
        flexDirection: 'column',
        alignItems: 'center',
      }}
    >
      <Avatar sx={{ m: 1, bgcolor: 'secondary.main' }}>
        
      </Avatar>
      <Typography component="h1" variant="h5">
        Sign in
      </Typography>
      <Box component={"form"} action={action}  noValidate sx={{ mt: 1 }} method={"null"}>
        <TextField
          margin="normal"
          required
          fullWidth
          id="email"
          label="Email Address"
          name="email"
          autoComplete="email"
          autoFocus
        />
        <TextField
          margin="normal"
          required
          fullWidth
          name="password"
          label="Password"
          type="password"
          id="password"
          autoComplete="current-password"
        />
        <FormControlLabel
          control={<Checkbox value="remember" color="primary" />}
          label="Remember me"
        />
        <Button
          type="submit"
          fullWidth
          variant="contained"
          sx={{ mt: 3, mb: 2 }}
        >
          Sign In
        </Button>
        <Grid container>
          <Grid item xs>
            <Link href="#" variant="body2">
              Forgot password?
            </Link>
          </Grid>
          <Grid item>
            <Link href="#" variant="body2">
              {"Don't have an account? Sign Up"}
            </Link>
          </Grid>
        </Grid>
      </Box>
    </Box>
  </Container>
  );
};

SignInSide.needAuth = false;

export default SignInSide;

Server side action, peformSubmit.js

'use server';

export async function peformSubmit (formData){
    console.log({
      email: formData.get('email'),
      password: formData.get('password'),
    });
};

middelware.js

import { NextResponse } from "next/server";
import { needAuth as _needAuth } from "./lib/needAuth";
import { AUTH } from 'routes';

export const config = { matcher: ["/auth"] }

export async function middleware(request) {
  const needAuth = await _needAuth(request)
  console.log(request.url)

  if(needAuth){
    return NextResponse.redirect(new URL('/auth', request.url))
  }

  return NextResponse.next()
}

'components/mui' only add "use client" to all material ui components.

`"use client";

export * from "@mui/material"; `

If i remove the action, the app work.

If i remove the middleweare (or omit that page in the matcher), the app work.

If i use the middleware empty, only a console.log and return the NextResponse.next() is the same error.

I'm expecting to be able to have formularies working with server actions, and be able to protect the acces using the middleweare.

In the matcher exaple i using the auth and that is nosese, but the idea is to be able tu have another form behind the middleweare.

Here is the content of pakage.json, any one can reproducte the error?

    {
  "name": "authTest",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@emotion/react": "^11.11.0",
    "@emotion/styled": "^11.11.0",
    "@mswjs/data": "^0.13.0",
    "@mui/icons-material": "^5.11.16",
    "@mui/material": "^5.13.4",
    "bcrypt": "^5.1.0",
    "eslint": "8.42.0",
    "eslint-config-next": "13.4.4",
    "mongoose": "^7.2.1",
    "next": "13.4.4",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@types/bcryptjs": "^2.4.2"
  }
}