MongoDB Atlas + prisma + nextjs error: Error validating datasource `db`: the URL must start with the protocol `mongo`

can't connect to mongodb server on atlas when using env var in mongodb + prisma + nextjs application. getting this error error: Error validating datasource db: the URL must start with the protocol mongo. However if I just put the connection string directly into url rather than doing env("DATABASE_URL"), then it works.

datasource db {
  provider = "mongodb"
  url      = env("DATABASE_URL")
}

.env: DATABASE_URL=mongodb+srv://username:password@somemongodbserver/mydb?retryWrites=true&w=majority

.env.local: DATABASE_URL=mongodb+srv://username:password@somemongodbserver/mydb?retryWrites=true&w=majority

Also tried putting this in next.config.js

const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
  env: {
    DATABASE_URL: process.env.DATABASE_URL,
  },
};