refactor: changing client side to server side API

Author: palsarip

.env

@@ -0,0 +1 @@
+API_URL=https://mxmdev.jamu.online/api

.env.local.sample

@@ -0,0 +1 @@
+API_URL=https://localhost:3000/api

.env.sample

@@ -1,4 +1,27 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {};
+
+const withNextEnv = require("next-env");
+const dotenv = require("dotenv");
+const webpack = require("webpack");
+
+dotenv.config();
+
+const nextConfig = {
+  experimental: {
+    appDir: true,
+  },
+  env: {
+    API_URL: process.env.API_URL,
+  },
+};
+
+module.exports = withNextEnv({
+  reactStrictMode: true,
+  webpack: (config) => {
+    config.plugins.push(new webpack.EnvironmentPlugin(process.env));
+
+    return config;
+  },
+});
 
 module.exports = nextConfig;

next.config.js

@@ -28,6 +28,7 @@
     "framer-motion": "^10.12.18",
     "mui-datatables": "^4.3.0",
     "next": "13.4.6",
+    "next-env": "^1.1.1",
     "postcss": "8.4.24",
     "react": "18.2.0",
     "react-apexcharts": "^1.4.1",

package.json

@@ -2,8 +2,7 @@ import axios, { isAxiosError, AxiosError } from "axios";
 import Swal from "sweetalert2";
 
 // !CHANGEME: hardcode
-export const baseUrl =
-  process.env.NEXT_PUBLIC_API_URL ?? "http://localhost:3000/api";
+export const baseUrl = process.env.API_URL ?? "http://localhost:3000/api";
 
 export const HandleAxiosError = (error: any) => {
   if (!isAxiosError(error)) {
@@ -33,11 +32,7 @@ export const HandleAxiosError = (error: any) => {
     return;
   }
 
-  Swal.fire(
-    "Error",
-    response.data.message ?? "Terjadi kesalahan saat request",
-    "error"
-  );
+  Swal.fire("Error", response.data.message ?? "Terjadi kesalahan saat request", "error");
 };
 
 export type ResponseModel<T> = {