= ({
mode === "light" ? defaultAlgorithm : darkAlgorithm,
}}
>
- {children}
+ {children}
);
diff --git a/refine-nextjs/plugins/auth-provider-auth0/extend.js b/refine-nextjs/plugins/auth-provider-auth0/extend.js
index 79cdbd649..668ef874f 100644
--- a/refine-nextjs/plugins/auth-provider-auth0/extend.js
+++ b/refine-nextjs/plugins/auth-provider-auth0/extend.js
@@ -3,9 +3,7 @@ const base = {
localImport: [],
refineProps: ["authProvider={authProvider}"],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
- refineChakraImports: [],
},
};
diff --git a/refine-nextjs/plugins/auth-provider-auth0/package.json b/refine-nextjs/plugins/auth-provider-auth0/package.json
index d309411e5..90d1bfc2d 100644
--- a/refine-nextjs/plugins/auth-provider-auth0/package.json
+++ b/refine-nextjs/plugins/auth-provider-auth0/package.json
@@ -1,6 +1,5 @@
{
- "dependencies": {
- "nookies": "^2.5.2",
- "next-auth": "^4.20.1"
- }
-}
\ No newline at end of file
+ "dependencies": {
+ "next-auth": "^4.24.5"
+ }
+}
diff --git a/refine-nextjs/plugins/auth-provider-auth0/pages/login/index.tsx b/refine-nextjs/plugins/auth-provider-auth0/pages/login/index.tsx
deleted file mode 100644
index 64b99e7a0..000000000
--- a/refine-nextjs/plugins/auth-provider-auth0/pages/login/index.tsx
+++ /dev/null
@@ -1,332 +0,0 @@
-import { useLogin } from "@refinedev/core";
-
-<%_ if (answers["ui-framework"] === "antd") { _%>
-import { ThemedTitleV2 } from "@refinedev/antd";
-import { Button, Typography, Layout, Space } from "antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
-import Box from "@mui/material/Box";
-import Button from "@mui/material/Button";
-import Container from "@mui/material/Container";
-import Typography from "@mui/material/Typography";
-import { ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-import { useTranslate } from "@refinedev/core";
-<%_ } _%>
-<%_ if (_app.isAuthProviderCheck) { _%>
-import { authProvider } from "src/authProvider";
-<%_ } _%>
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-<%_ if (_app.isNextAuthCheck) { _%>
-import { getServerSession } from "next-auth";
-import { authOptions } from "../api/auth/[...nextauth]";
-<%_ } _%>
-
-export default function Login() {
- const { mutate: login } = useLogin();
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const t = useTranslate();
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "antd") { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
- Powered by
- 
- Auth0
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mui') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
- Powered by
-
- Auth0
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
- Powered by
-
- Auth0
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Auth0
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return(
-
-
-
- Powered by
-
- Auth0
-
-
= NextPage & {
- noLayout?: boolean;
- };
+type RefineContextProps = {
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ defaultMode?: string;
+ <%_ } _%>
+};
- type AppPropsWithLayout = AppProps & {
- Component: NextPageWithLayout;
- };
+export const RefineContext = (props: React.PropsWithChildren) => {
+ return (
+
+
+
+ )
+ }
+
+type AppProps = {
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ defaultMode?: string;
+ <%_ } _%>
+};
- const App = (props: React.PropsWithChildren) => {
+const App = (props: React.PropsWithChildren) => {
<%- (_app.innerHooks || []).join("\n") %>
const { data, status } = useSession();
- const router = useRouter();
- const { to } = router.query;
+ const to = usePathname()
<%- (_app.inner || []).join("\n") %>
@@ -75,7 +81,12 @@ export type NextPageWithLayout = NextPage & {
};
},
onError: async (error) => {
- console.error(error);
+ if (error.response?.status === 401) {
+ return {
+ logout: true,
+ };
+ }
+
return {
error,
};
@@ -108,6 +119,11 @@ export type NextPageWithLayout = NextPage & {
},
};
+
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ const defaultMode = props?.defaultMode
+ <%_ } _%>
+
return (
<>
@@ -116,7 +132,7 @@ export type NextPageWithLayout = NextPage & {
- <%_ if (answers["inferencer"] === 'inferencer' || answers["inferencer-headless"] === 'inferencer-headless') { _%>
+ <%_ if (_app.hasRoutes === true) { _%>
resources={[
<%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
{
@@ -174,62 +190,9 @@ export type NextPageWithLayout = NextPage & {
>
{props.children}
-
<%- bottom.join("\n") %>
);
};
-
-
-function MyApp({ Component, pageProps: { session, ...pageProps }, }: AppPropsWithLayout): JSX.Element {
- const renderComponent = () => {
- if (Component.noLayout) {
- return ;
- }
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return (
-
- );
- <%_ } else {_%>
- return (
- }
- <%_ if (answers["ui-framework"] === 'antd') { _%>
- Sider={(props) => }
- <%_ } _%>
- <%_ if (selectedSvg || selectedTitle) { _%>
- Title={({ collapsed }) => (
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- >
-
-
- );
- <%_ } _%>
- };
-
- return (
-
- {renderComponent()}
-
- );
-};
-
-
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== 'no') { _%>
-export default appWithTranslation(MyApp);
-<%_ } else {_%>
-export default MyApp;
-<%_ } _%>
diff --git a/refine-nextjs/plugins/auth-provider-auth0/pages/api/auth/[...nextauth].ts b/refine-nextjs/plugins/auth-provider-auth0/src/app/api/auth/[...nextauth]/options.ts
similarity index 83%
rename from refine-nextjs/plugins/auth-provider-auth0/pages/api/auth/[...nextauth].ts
rename to refine-nextjs/plugins/auth-provider-auth0/src/app/api/auth/[...nextauth]/options.ts
index 2d37c066a..52c5b298a 100644
--- a/refine-nextjs/plugins/auth-provider-auth0/pages/api/auth/[...nextauth].ts
+++ b/refine-nextjs/plugins/auth-provider-auth0/src/app/api/auth/[...nextauth]/options.ts
@@ -1,7 +1,6 @@
-import NextAuth from "next-auth";
import Auth0Provider from "next-auth/providers/auth0";
-export const authOptions = {
+const authOptions = {
// Configure one or more authentication providers
providers: [
// !!! Should be stored in .env file.
@@ -13,4 +12,5 @@ export const authOptions = {
],
secret: `UItTuD1HcGXIj8ZfHUswhYdNd40Lc325R8VlxQPUoR0=`,
};
-export default NextAuth(authOptions);
+
+export default authOptions;
diff --git a/refine-nextjs/plugins/auth-provider-auth0/src/app/api/auth/[...nextauth]/route.ts b/refine-nextjs/plugins/auth-provider-auth0/src/app/api/auth/[...nextauth]/route.ts
new file mode 100644
index 000000000..a79078599
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-auth0/src/app/api/auth/[...nextauth]/route.ts
@@ -0,0 +1,5 @@
+import NextAuth from "next-auth/next";
+import authOptions from "./options";
+
+const auth = NextAuth(authOptions);
+export { auth as GET, auth as POST };
diff --git a/refine-nextjs/plugins/auth-provider-auth0/src/app/layout.tsx b/refine-nextjs/plugins/auth-provider-auth0/src/app/layout.tsx
new file mode 100644
index 000000000..2c0a62343
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-auth0/src/app/layout.tsx
@@ -0,0 +1,34 @@
+import { Metadata } from "next";
+<%- (_app.nextjsImport || []).join("\n") _%>
+import React, { Suspense } from "react";
+import { RefineContext } from "./_refine_context";
+
+export const metadata: Metadata = {
+ title: "Refine",
+ description: "Generated by create refine app",
+ icons: {
+ icon: "/favicon.ico",
+ },
+};
+
+export default function RootLayout({
+ children,
+}: Readonly<{
+ children: React.ReactNode;
+}>) {
+
+ <%- (_app.nextjsInner || []).join("\n") %>
+
+ return (
+
+
+
+
+ >
+ {children}
+
+
+
+
+ );
+}
diff --git a/refine-nextjs/plugins/auth-provider-auth0/src/app/login/layout.tsx b/refine-nextjs/plugins/auth-provider-auth0/src/app/login/layout.tsx
new file mode 100644
index 000000000..3bde1abb1
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-auth0/src/app/login/layout.tsx
@@ -0,0 +1,24 @@
+import authOptions from "@app/api/auth/[...nextauth]/options";
+import { getServerSession } from "next-auth/next";
+import { redirect } from "next/navigation";
+import React from "react";
+
+export default async function LoginLayout({
+ children,
+}: React.PropsWithChildren) {
+ const data = await getData();
+
+ if (data.session?.user) {
+ return redirect("/");
+ }
+
+ return <>{children};
+}
+
+async function getData() {
+ const session = await getServerSession(authOptions);
+
+ return {
+ session,
+ };
+}
diff --git a/refine-nextjs/plugins/auth-provider-auth0/src/app/login/page.tsx b/refine-nextjs/plugins/auth-provider-auth0/src/app/login/page.tsx
new file mode 100644
index 000000000..1c286f12c
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-auth0/src/app/login/page.tsx
@@ -0,0 +1,145 @@
+"use client"
+
+import { useLogin } from "@refinedev/core";
+
+<%_ if (answers["ui-framework"] === "antd") { _%>
+import { ThemedTitleV2 } from "@refinedev/antd";
+import { Button, Typography, Layout, Space } from "antd";
+<%_ } _%>
+<%_ if (answers["ui-framework"] === 'mui') { _%>
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Container from "@mui/material/Container";
+import Typography from "@mui/material/Typography";
+import { ThemedTitleV2 } from "@refinedev/mui";
+<%_ } _%>
+
+<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
+import { AppIcon } from "src/components/app-icon";
+<%_ } _%>
+
+
+
+export default function Login() {
+ const { mutate: login } = useLogin();
+
+ <%_ if (answers["ui-framework"] === "antd") { _%>
+ return (
+
+
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+
+
+ Powered by
+
+ Auth0
+
+
+
+ );
+ <%_ } _%>
+
+ <%_ if (answers["ui-framework"] === 'mui') { _%>
+ return (
+
+
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+
+
+
+ Powered by
+
+ Auth0
+
+
+
+ );
+ <%_ } _%>
+
+ <%_ if (answers["ui-framework"] === "no") { _%>
+ return(
+
+
+
+ Powered by
+
+ Auth0
+
+
- Google
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mui') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
- Powered by
-
- Google
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
- Powered by
-
- Google
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Google
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return(
-
-
-
- Powered by
-
- Google
-
-
= NextPage & {
- noLayout?: boolean;
- };
+type RefineContextProps = {
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ defaultMode?: string;
+ <%_ } _%>
+};
- type AppPropsWithLayout = AppProps & {
- Component: NextPageWithLayout;
- };
+export const RefineContext = (props: React.PropsWithChildren) => {
+ return (
+
+
+
+ )
+ }
+
+type AppProps = {
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ defaultMode?: string;
+ <%_ } _%>
+};
- const App = (props: React.PropsWithChildren) => {
+const App = (props: React.PropsWithChildren) => {
<%- (_app.innerHooks || []).join("\n") %>
const { data, status } = useSession();
- const router = useRouter();
- const { to } = router.query;
+ const to = usePathname()
<%- (_app.inner || []).join("\n") %>
@@ -75,7 +81,12 @@ export type NextPageWithLayout = NextPage & {
};
},
onError: async (error) => {
- console.error(error);
+ if (error.response?.status === 401) {
+ return {
+ logout: true,
+ };
+ }
+
return {
error,
};
@@ -108,6 +119,11 @@ export type NextPageWithLayout = NextPage & {
},
};
+
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ const defaultMode = props?.defaultMode
+ <%_ } _%>
+
return (
<>
@@ -116,7 +132,7 @@ export type NextPageWithLayout = NextPage & {
- <%_ if (answers["inferencer"] === 'inferencer' || answers["inferencer-headless"] === 'inferencer-headless') { _%>
+ <%_ if (_app.hasRoutes === true) { _%>
resources={[
<%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
{
@@ -174,62 +190,9 @@ export type NextPageWithLayout = NextPage & {
>
{props.children}
-
<%- bottom.join("\n") %>
);
};
-
-
-function MyApp({ Component, pageProps: { session, ...pageProps }, }: AppPropsWithLayout): JSX.Element {
- const renderComponent = () => {
- if (Component.noLayout) {
- return ;
- }
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return (
-
- );
- <%_ } else {_%>
- return (
- }
- <%_ if (answers["ui-framework"] === 'antd') { _%>
- Sider={(props) => }
- <%_ } _%>
- <%_ if (selectedSvg || selectedTitle) { _%>
- Title={({ collapsed }) => (
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- >
-
-
- );
- <%_ } _%>
- };
-
- return (
-
- {renderComponent()}
-
- );
-};
-
-
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== 'no') { _%>
-export default appWithTranslation(MyApp);
-<%_ } else {_%>
-export default MyApp;
-<%_ } _%>
diff --git a/refine-nextjs/plugins/auth-provider-google/pages/api/auth/[...nextauth].ts b/refine-nextjs/plugins/auth-provider-google/src/app/api/auth/[...nextauth]/options.ts
similarity index 81%
rename from refine-nextjs/plugins/auth-provider-google/pages/api/auth/[...nextauth].ts
rename to refine-nextjs/plugins/auth-provider-google/src/app/api/auth/[...nextauth]/options.ts
index 06206a305..18be9a69c 100644
--- a/refine-nextjs/plugins/auth-provider-google/pages/api/auth/[...nextauth].ts
+++ b/refine-nextjs/plugins/auth-provider-google/src/app/api/auth/[...nextauth]/options.ts
@@ -1,7 +1,6 @@
-import NextAuth from "next-auth";
import GoogleProvider from "next-auth/providers/google";
-export const authOptions = {
+const authOptions = {
// Configure one or more authentication providers
providers: [
// !!! Should be stored in .env file.
@@ -12,4 +11,5 @@ export const authOptions = {
],
secret: `UItTuD1HcGXIj8ZfHUswhYdNd40Lc325R8VlxQPUoR0=`,
};
-export default NextAuth(authOptions);
+
+export default authOptions;
diff --git a/refine-nextjs/plugins/auth-provider-google/src/app/api/auth/[...nextauth]/route.ts b/refine-nextjs/plugins/auth-provider-google/src/app/api/auth/[...nextauth]/route.ts
new file mode 100644
index 000000000..a79078599
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-google/src/app/api/auth/[...nextauth]/route.ts
@@ -0,0 +1,5 @@
+import NextAuth from "next-auth/next";
+import authOptions from "./options";
+
+const auth = NextAuth(authOptions);
+export { auth as GET, auth as POST };
diff --git a/refine-nextjs/plugins/auth-provider-google/src/app/layout.tsx b/refine-nextjs/plugins/auth-provider-google/src/app/layout.tsx
new file mode 100644
index 000000000..2c0a62343
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-google/src/app/layout.tsx
@@ -0,0 +1,34 @@
+import { Metadata } from "next";
+<%- (_app.nextjsImport || []).join("\n") _%>
+import React, { Suspense } from "react";
+import { RefineContext } from "./_refine_context";
+
+export const metadata: Metadata = {
+ title: "Refine",
+ description: "Generated by create refine app",
+ icons: {
+ icon: "/favicon.ico",
+ },
+};
+
+export default function RootLayout({
+ children,
+}: Readonly<{
+ children: React.ReactNode;
+}>) {
+
+ <%- (_app.nextjsInner || []).join("\n") %>
+
+ return (
+
+
+
+
+ >
+ {children}
+
+
+
+
+ );
+}
diff --git a/refine-nextjs/plugins/auth-provider-google/src/app/login/layout.tsx b/refine-nextjs/plugins/auth-provider-google/src/app/login/layout.tsx
new file mode 100644
index 000000000..3bde1abb1
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-google/src/app/login/layout.tsx
@@ -0,0 +1,24 @@
+import authOptions from "@app/api/auth/[...nextauth]/options";
+import { getServerSession } from "next-auth/next";
+import { redirect } from "next/navigation";
+import React from "react";
+
+export default async function LoginLayout({
+ children,
+}: React.PropsWithChildren) {
+ const data = await getData();
+
+ if (data.session?.user) {
+ return redirect("/");
+ }
+
+ return <>{children};
+}
+
+async function getData() {
+ const session = await getServerSession(authOptions);
+
+ return {
+ session,
+ };
+}
diff --git a/refine-nextjs/plugins/auth-provider-google/src/app/login/page.tsx b/refine-nextjs/plugins/auth-provider-google/src/app/login/page.tsx
new file mode 100644
index 000000000..b1fd33c43
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-google/src/app/login/page.tsx
@@ -0,0 +1,140 @@
+"use client"
+
+<%_ if (answers["ui-framework"] === "antd") { _%>
+import { ThemedTitleV2 } from "@refinedev/antd";
+import { Button, Typography, Layout, Space } from "antd";
+<%_ } _%>
+<%_ if (answers["ui-framework"] === 'mui') { _%>
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Container from "@mui/material/Container";
+import Typography from "@mui/material/Typography";
+import { ThemedTitleV2 } from "@refinedev/mui";
+<%_ } _%>
+import { useLogin } from "@refinedev/core";
+<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
+import { AppIcon } from "src/components/app-icon";
+<%_ } _%>
+
+
+export default function Login() {
+ const { mutate: login } = useLogin();
+
+ <%_ if (answers["ui-framework"] === "antd") { _%>
+ return (
+
+
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+
+
+ Powered by
+
+ Google
+
+
+
+ );
+ <%_ } _%>
+
+ <%_ if (answers["ui-framework"] === 'mui') { _%>
+ return (
+
+
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+
+
+
+ Powered by
+
+ Google
+
+
+
+ );
+ <%_ } _%>
+
+ <%_ if (answers["ui-framework"] === "no") { _%>
+ return(
+
+
+
+ Powered by
+
+ Google
+
+
- Keycloak
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mui') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
- Powered by
-
- Keycloak
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
- Powered by
-
- Keycloak
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Keycloak
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return(
-
-
-
- Powered by
-
- Keycloak
-
-
= NextPage & {
- noLayout?: boolean;
- };
+type RefineContextProps = {
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ defaultMode?: string;
+ <%_ } _%>
+};
- type AppPropsWithLayout = AppProps & {
- Component: NextPageWithLayout;
- };
+export const RefineContext = (props: React.PropsWithChildren) => {
+ return (
+
+
+
+ )
+ }
+
+type AppProps = {
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ defaultMode?: string;
+ <%_ } _%>
+};
- const App = (props: React.PropsWithChildren) => {
+const App = (props: React.PropsWithChildren) => {
<%- (_app.innerHooks || []).join("\n") %>
const { data, status } = useSession();
- const router = useRouter();
- const { to } = router.query;
+ const to = usePathname()
<%- (_app.inner || []).join("\n") %>
@@ -75,7 +81,12 @@ export type NextPageWithLayout = NextPage & {
};
},
onError: async (error) => {
- console.error(error);
+ if (error.response?.status === 401) {
+ return {
+ logout: true,
+ };
+ }
+
return {
error,
};
@@ -108,6 +119,11 @@ export type NextPageWithLayout = NextPage & {
},
};
+
+ <%_ if (answers["ui-framework"] !== 'no') { _%>
+ const defaultMode = props?.defaultMode
+ <%_ } _%>
+
return (
<>
@@ -116,7 +132,7 @@ export type NextPageWithLayout = NextPage & {
- <%_ if (answers["inferencer"] === 'inferencer' || answers["inferencer-headless"] === 'inferencer-headless') { _%>
+ <%_ if (_app.hasRoutes === true) { _%>
resources={[
<%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
{
@@ -174,62 +190,9 @@ export type NextPageWithLayout = NextPage & {
>
{props.children}
-
<%- bottom.join("\n") %>
);
};
-
-
-function MyApp({ Component, pageProps: { session, ...pageProps }, }: AppPropsWithLayout): JSX.Element {
- const renderComponent = () => {
- if (Component.noLayout) {
- return ;
- }
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return (
-
- );
- <%_ } else {_%>
- return (
- }
- <%_ if (answers["ui-framework"] === 'antd') { _%>
- Sider={(props) => }
- <%_ } _%>
- <%_ if (selectedSvg || selectedTitle) { _%>
- Title={({ collapsed }) => (
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- >
-
-
- );
- <%_ } _%>
- };
-
- return (
-
- {renderComponent()}
-
- );
-};
-
-
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== 'no') { _%>
-export default appWithTranslation(MyApp);
-<%_ } else {_%>
-export default MyApp;
-<%_ } _%>
diff --git a/refine-nextjs/plugins/auth-provider-keycloak/pages/api/auth/[...nextauth].ts b/refine-nextjs/plugins/auth-provider-keycloak/src/app/api/auth/[...nextauth]/options.ts
similarity index 88%
rename from refine-nextjs/plugins/auth-provider-keycloak/pages/api/auth/[...nextauth].ts
rename to refine-nextjs/plugins/auth-provider-keycloak/src/app/api/auth/[...nextauth]/options.ts
index d5f675877..5bf455407 100644
--- a/refine-nextjs/plugins/auth-provider-keycloak/pages/api/auth/[...nextauth].ts
+++ b/refine-nextjs/plugins/auth-provider-keycloak/src/app/api/auth/[...nextauth]/options.ts
@@ -1,7 +1,6 @@
-import NextAuth from "next-auth";
import KeycloakProvider from "next-auth/providers/keycloak";
-export const authOptions = {
+const authOptions = {
// Configure one or more authentication providers
providers: [
// !!! Should be stored in .env file.
@@ -21,4 +20,5 @@ export const authOptions = {
],
secret: `UItTuD1HcGXIj8ZfHUswhYdNd40Lc325R8VlxQPUoR0=`,
};
-export default NextAuth(authOptions);
+
+export default authOptions;
diff --git a/refine-nextjs/plugins/auth-provider-keycloak/src/app/api/auth/[...nextauth]/route.ts b/refine-nextjs/plugins/auth-provider-keycloak/src/app/api/auth/[...nextauth]/route.ts
new file mode 100644
index 000000000..a79078599
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-keycloak/src/app/api/auth/[...nextauth]/route.ts
@@ -0,0 +1,5 @@
+import NextAuth from "next-auth/next";
+import authOptions from "./options";
+
+const auth = NextAuth(authOptions);
+export { auth as GET, auth as POST };
diff --git a/refine-nextjs/plugins/auth-provider-keycloak/src/app/layout.tsx b/refine-nextjs/plugins/auth-provider-keycloak/src/app/layout.tsx
new file mode 100644
index 000000000..2c0a62343
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-keycloak/src/app/layout.tsx
@@ -0,0 +1,34 @@
+import { Metadata } from "next";
+<%- (_app.nextjsImport || []).join("\n") _%>
+import React, { Suspense } from "react";
+import { RefineContext } from "./_refine_context";
+
+export const metadata: Metadata = {
+ title: "Refine",
+ description: "Generated by create refine app",
+ icons: {
+ icon: "/favicon.ico",
+ },
+};
+
+export default function RootLayout({
+ children,
+}: Readonly<{
+ children: React.ReactNode;
+}>) {
+
+ <%- (_app.nextjsInner || []).join("\n") %>
+
+ return (
+
+
+
+
+ >
+ {children}
+
+
+
+
+ );
+}
diff --git a/refine-nextjs/plugins/auth-provider-keycloak/src/app/login/layout.tsx b/refine-nextjs/plugins/auth-provider-keycloak/src/app/login/layout.tsx
new file mode 100644
index 000000000..3bde1abb1
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-keycloak/src/app/login/layout.tsx
@@ -0,0 +1,24 @@
+import authOptions from "@app/api/auth/[...nextauth]/options";
+import { getServerSession } from "next-auth/next";
+import { redirect } from "next/navigation";
+import React from "react";
+
+export default async function LoginLayout({
+ children,
+}: React.PropsWithChildren) {
+ const data = await getData();
+
+ if (data.session?.user) {
+ return redirect("/");
+ }
+
+ return <>{children};
+}
+
+async function getData() {
+ const session = await getServerSession(authOptions);
+
+ return {
+ session,
+ };
+}
diff --git a/refine-nextjs/plugins/auth-provider-keycloak/src/app/login/page.tsx b/refine-nextjs/plugins/auth-provider-keycloak/src/app/login/page.tsx
new file mode 100644
index 000000000..2cca7d6ab
--- /dev/null
+++ b/refine-nextjs/plugins/auth-provider-keycloak/src/app/login/page.tsx
@@ -0,0 +1,141 @@
+"use client"
+
+<%_ if (answers["ui-framework"] === "antd") { _%>
+import { ThemedTitleV2 } from "@refinedev/antd";
+import { Button, Typography, Layout, Space } from "antd";
+<%_ } _%>
+<%_ if (answers["ui-framework"] === 'mui') { _%>
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Container from "@mui/material/Container";
+import Typography from "@mui/material/Typography";
+import { ThemedTitleV2 } from "@refinedev/mui";
+<%_ } _%>
+import { useLogin } from "@refinedev/core";
+
+<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
+import { AppIcon } from "src/components/app-icon";
+<%_ } _%>
+
+export default function Login() {
+ const { mutate: login } = useLogin();
+
+ <%_ if (answers["ui-framework"] === "antd") { _%>
+ return (
+
+
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+
+
+ Powered by
+
+ Keycloak
+
+
+
+ );
+ <%_ } _%>
+
+ <%_ if (answers["ui-framework"] === 'mui') { _%>
+ return (
+
+
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+
+
+
+ Powered by
+
+ Keycloak
+
+
+
+ );
+ <%_ } _%>
+
+ <%_ if (answers["ui-framework"] === "no") { _%>
+ return(
+
+
+
+ Powered by
+
+ Keycloak
+
+
-
-
-
-
-
- )
-}
\ No newline at end of file
diff --git a/refine-nextjs/plugins/chakra/src/components/header/index.tsx b/refine-nextjs/plugins/chakra/src/components/header/index.tsx
deleted file mode 100644
index 63575ced9..000000000
--- a/refine-nextjs/plugins/chakra/src/components/header/index.tsx
+++ /dev/null
@@ -1,92 +0,0 @@
-import {
- Avatar,
- Box,
- BoxProps,
- HStack,
- Icon,
- IconButton,
- Text,
- useColorMode,
- useColorModeValue,
-} from "@chakra-ui/react";
-import {
- HamburgerMenu,
- RefineThemedLayoutV2HeaderProps,
-} from "@refinedev/chakra-ui";
-import { useGetIdentity } from "@refinedev/core";
-import { IconMoon, IconSun } from "@tabler/icons";
-import React from "react";
-
-type IUser = {
- id: number;
- name: string;
- avatar: string;
-};
-
-export const Header: React.FC = ({
- sticky,
-}) => {
- const { data: user } = useGetIdentity();
-
- const { colorMode, toggleColorMode } = useColorMode();
-
- const bgColor = useColorModeValue(
- "refine.header.bg.light",
- "refine.header.bg.dark",
- );
-
- let stickyProps: BoxProps = {};
- if (sticky) {
- stickyProps = {
- position: "sticky",
- top: 0,
- zIndex: 1,
- };
- }
-
- return (
-
-
-
-
-
-
- {(user?.avatar || user?.name) && (
-
- {user?.name && (
-
- {user.name}
-
- )}
-
-
- )}
-
-
- );
-};
diff --git a/refine-nextjs/plugins/data-provider-airtable/extend.js b/refine-nextjs/plugins/data-provider-airtable/extend.js
index 3b6c23092..8a43af398 100644
--- a/refine-nextjs/plugins/data-provider-airtable/extend.js
+++ b/refine-nextjs/plugins/data-provider-airtable/extend.js
@@ -1,14 +1,11 @@
const base = {
_app: {
- import: [`import dataProvider from "@refinedev/airtable";`],
- afterImport: [
- `const API_TOKEN = "keyI18pnBeEMfPAIb";`,
- `const BASE_ID = "appKYl1H4k9g73sBT";`,
- "",
- ],
- refineProps: ["dataProvider={dataProvider(API_TOKEN, BASE_ID)}"],
+ import: [`import { dataProvider } from "@providers/data-provider";`],
+ afterImport: [],
+ refineProps: ["dataProvider={dataProvider}"],
},
};
+
module.exports = {
extend() {
return base;
diff --git a/refine-nextjs/plugins/data-provider-airtable/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-airtable/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..5cd436ab6
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-airtable/src/providers/data-provider/index.ts
@@ -0,0 +1,8 @@
+"use client";
+
+import airtable from "@refinedev/airtable";
+
+const API_TOKEN = "keyI18pnBeEMfPAIb";
+const BASE_ID = "appKYl1H4k9g73sBT";
+
+export const dataProvider = airtable(API_TOKEN, BASE_ID);
diff --git a/refine-nextjs/plugins/data-provider-altogic/extend.js b/refine-nextjs/plugins/data-provider-altogic/extend.js
index 699a0a6a9..671dd6407 100644
--- a/refine-nextjs/plugins/data-provider-altogic/extend.js
+++ b/refine-nextjs/plugins/data-provider-altogic/extend.js
@@ -1,20 +1,20 @@
const base = {
- _app: {
- refineImports: [`HttpError`],
- import: [
- `import dataProvider from "@refinedev/altogic";`,
- `import axios from "axios";`,
- ],
- afterImport: [
- `const API_URL = "https://dev001.na-dev-engine.altogic.com";`,
- `const YOUR_SECRET_API_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbnZJZCI6IjYxMzczZGVkMjQ5NWMzMDAxOTliZTAxNiIsImtleUlkIjoiNjEzNzNlMzYyNDk1YzMwMDE5OWJlMDJkIiwiaWF0IjoxNjMxMDEwMzU4LCJleHAiOjI0OTUwMTAzNTh9.2fL28Bzd97mqfAvcsTrYj1mZ_hqf3WRnr2DOtV3lsc0";`,
- "",
- `const axiosInstance = axios.create();`,
- `axiosInstance.defaults.headers.common = {
+ _app: {
+ refineImports: [`HttpError`],
+ import: [
+ `import dataProvider from "@refinedev/altogic";`,
+ `import axios from "axios";`,
+ ],
+ afterImport: [
+ `const API_URL = "https://dev001.na-dev-engine.altogic.com";`,
+ `const YOUR_SECRET_API_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbnZJZCI6IjYxMzczZGVkMjQ5NWMzMDAxOTliZTAxNiIsImtleUlkIjoiNjEzNzNlMzYyNDk1YzMwMDE5OWJlMDJkIiwiaWF0IjoxNjMxMDEwMzU4LCJleHAiOjI0OTUwMTAzNTh9.2fL28Bzd97mqfAvcsTrYj1mZ_hqf3WRnr2DOtV3lsc0";`,
+ "",
+ `const axiosInstance = axios.create();`,
+ `axiosInstance.defaults.headers.common = {
Authorization: YOUR_SECRET_API_KEY
};`,
- "",
- `axiosInstance.interceptors.response.use(
+ "",
+ `axiosInstance.interceptors.response.use(
(response) => {
return response;
},
@@ -28,13 +28,13 @@ const base = {
return Promise.reject(customError);
}
);`,
- "",
- ],
- refineProps: ["dataProvider={dataProvider(API_URL, axiosInstance)}"],
- },
+ "",
+ ],
+ refineProps: ["dataProvider={dataProvider(API_URL, axiosInstance)}"],
+ },
};
module.exports = {
- extend() {
- return base;
- },
+ extend() {
+ return base;
+ },
};
diff --git a/refine-nextjs/plugins/data-provider-altogic/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-altogic/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..5cd436ab6
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-altogic/src/providers/data-provider/index.ts
@@ -0,0 +1,8 @@
+"use client";
+
+import airtable from "@refinedev/airtable";
+
+const API_TOKEN = "keyI18pnBeEMfPAIb";
+const BASE_ID = "appKYl1H4k9g73sBT";
+
+export const dataProvider = airtable(API_TOKEN, BASE_ID);
diff --git a/refine-nextjs/plugins/data-provider-appwrite/extend.js b/refine-nextjs/plugins/data-provider-appwrite/extend.js
index e78964023..6f53d905b 100644
--- a/refine-nextjs/plugins/data-provider-appwrite/extend.js
+++ b/refine-nextjs/plugins/data-provider-appwrite/extend.js
@@ -1,24 +1,17 @@
const base = {
_app: {
- import: [
- `import { dataProvider, liveProvider } from "@refinedev/appwrite";`,
- ],
+ import: [],
localImport: [
- `import { authProvider } from "src/authProvider";`,
- `import { appwriteClient } from "src/utility";`,
+ 'import { authProvider } from "@providers/auth-provider";',
+ 'import { dataProvider, liveProvider } from "@providers/data-provider";',
],
refineProps: [
- `dataProvider={dataProvider(appwriteClient, {
- databaseId: "database",
- })}`,
- `liveProvider={liveProvider(appwriteClient, {
- databaseId: "database",
- })}`,
+ `dataProvider={dataProvider}`,
+ `liveProvider={liveProvider}`,
`authProvider={authProvider}`,
],
refineOptions: [`liveMode: "auto",`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
},
};
diff --git a/refine-nextjs/plugins/data-provider-appwrite/package.json b/refine-nextjs/plugins/data-provider-appwrite/package.json
index b5a42d2ce..0811c7637 100644
--- a/refine-nextjs/plugins/data-provider-appwrite/package.json
+++ b/refine-nextjs/plugins/data-provider-appwrite/package.json
@@ -1,9 +1,12 @@
{
"dependencies": {
"@refinedev/appwrite": "^6.4.6",
- "uuid": "^9.0.0"
+ "uuid": "^9.0.0",
+ "js-cookie": "^3.0.5"
},
"devDependencies": {
- "@types/uuid": "^9.0.2"
+ "@types/uuid": "^9.0.2",
+ "@types/js-cookie": "^3.0.6"
}
-}
\ No newline at end of file
+}
+
diff --git a/refine-nextjs/plugins/data-provider-appwrite/pages/forgot-password/index.tsx b/refine-nextjs/plugins/data-provider-appwrite/pages/forgot-password/index.tsx
deleted file mode 100644
index 18e230c29..000000000
--- a/refine-nextjs/plugins/data-provider-appwrite/pages/forgot-password/index.tsx
+++ /dev/null
@@ -1,77 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-export default function ForgotPassword() {
- return (
-
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-ForgotPassword.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
diff --git a/refine-nextjs/plugins/data-provider-appwrite/pages/login/index.tsx b/refine-nextjs/plugins/data-provider-appwrite/pages/login/index.tsx
deleted file mode 100644
index fef7b6bc7..000000000
--- a/refine-nextjs/plugins/data-provider-appwrite/pages/login/index.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-export default function Login() {
- return (
-
- <%_ if ((selectedSvg || selectedTitle) && answers["ui-framework"] !== "no") { _%>
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-Login.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
-
diff --git a/refine-nextjs/plugins/data-provider-appwrite/pages/register/index.tsx b/refine-nextjs/plugins/data-provider-appwrite/pages/register/index.tsx
deleted file mode 100644
index a31f02291..000000000
--- a/refine-nextjs/plugins/data-provider-appwrite/pages/register/index.tsx
+++ /dev/null
@@ -1,77 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
- import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-export default function Register() {
- return (
-
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-Register.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/app/forgot-password/page.tsx b/refine-nextjs/plugins/data-provider-appwrite/src/app/forgot-password/page.tsx
new file mode 100644
index 000000000..c2b0061f5
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/app/forgot-password/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function ForgotPassword() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/app/login/page.tsx b/refine-nextjs/plugins/data-provider-appwrite/src/app/login/page.tsx
new file mode 100644
index 000000000..e4e77ff92
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/app/login/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function Login() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/app/register/page.tsx b/refine-nextjs/plugins/data-provider-appwrite/src/app/register/page.tsx
new file mode 100644
index 000000000..b07acae8d
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/app/register/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function Register() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/auth-provider.server.ts b/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/auth-provider.server.ts
new file mode 100644
index 000000000..b786f6dc5
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/auth-provider.server.ts
@@ -0,0 +1,22 @@
+import { AuthBindings } from "@refinedev/core";
+import { APPWRITE_TOKEN_KEY } from "@utility/constants";
+import { cookies } from "next/headers";
+
+export const authProviderServer: Pick = {
+ check: async () => {
+ const cookieStore = cookies();
+ const auth = cookieStore.get(APPWRITE_TOKEN_KEY);
+
+ if (auth) {
+ return {
+ authenticated: true,
+ };
+ }
+
+ return {
+ authenticated: false,
+ logout: true,
+ redirectTo: "/login",
+ };
+ },
+};
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/authProvider.ts b/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/auth-provider.ts
similarity index 86%
rename from refine-nextjs/plugins/data-provider-appwrite/src/authProvider.ts
rename to refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/auth-provider.ts
index 7ba1eccc7..c443bc611 100644
--- a/refine-nextjs/plugins/data-provider-appwrite/src/authProvider.ts
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/auth-provider.ts
@@ -1,8 +1,11 @@
+"use client";
+
+import { account, appwriteClient } from "@providers/data-provider";
import { AppwriteException } from "@refinedev/appwrite";
import { AuthBindings } from "@refinedev/core";
-import nookies from "nookies";
+import { APPWRITE_TOKEN_KEY } from "@utility/constants";
+import Cookies from "js-cookie";
import { v4 as uuidv4 } from "uuid";
-import { account, appwriteClient, APPWRITE_TOKEN_KEY } from "./utility";
export const authProvider: AuthBindings = {
login: async ({ email, password }) => {
@@ -11,8 +14,8 @@ export const authProvider: AuthBindings = {
const { jwt } = await account.createJWT();
if (jwt) {
- nookies.set(null, APPWRITE_TOKEN_KEY, jwt, {
- maxAge: 30 * 24 * 60 * 60,
+ Cookies.set(APPWRITE_TOKEN_KEY, jwt, {
+ expires: 30, // 30 days
path: "/",
});
}
@@ -41,7 +44,7 @@ export const authProvider: AuthBindings = {
error,
};
}
- nookies.destroy(null, APPWRITE_TOKEN_KEY);
+ Cookies.remove(APPWRITE_TOKEN_KEY, { path: "/" });
appwriteClient.setJWT("");
return {
success: true,
@@ -70,10 +73,8 @@ export const authProvider: AuthBindings = {
console.error(error);
return { error };
},
- check: async (ctx) => {
- // for server side authentication
- const cookies = nookies.get(ctx);
- const appwriteJWT = cookies[APPWRITE_TOKEN_KEY];
+ check: async () => {
+ const appwriteJWT = Cookies.get(APPWRITE_TOKEN_KEY);
if (appwriteJWT) {
appwriteClient.setJWT(appwriteJWT);
}
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/index.ts b/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/index.ts
new file mode 100644
index 000000000..b7f6d9fe9
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/providers/auth-provider/index.ts
@@ -0,0 +1,2 @@
+export * from './auth-provider'
+export * from './auth-provider.server'
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-appwrite/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..dcfec38d4
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/providers/data-provider/index.ts
@@ -0,0 +1,38 @@
+"use client";
+
+import {
+ Account,
+ Appwrite,
+ dataProvider as appwriteDataProvider,
+ liveProvider as appwriteLiveProvider,
+ Storage,
+} from "@refinedev/appwrite";
+import {
+ APPWRITE_PROJECT,
+ APPWRITE_TOKEN_KEY,
+ APPWRITE_URL,
+} from "@utility/constants";
+import Cookies from "js-cookie";
+
+const appwriteClient = new Appwrite();
+
+appwriteClient.setEndpoint(APPWRITE_URL).setProject(APPWRITE_PROJECT);
+
+// for client side authentication
+const appwriteJWT = Cookies.get(APPWRITE_TOKEN_KEY);
+if (appwriteJWT) {
+ appwriteClient.setJWT(appwriteJWT);
+}
+
+const account = new Account(appwriteClient);
+const storage = new Storage(appwriteClient);
+
+export { appwriteClient, account, storage };
+
+export const dataProvider = appwriteDataProvider(appwriteClient, {
+ databaseId: "database",
+});
+
+export const liveProvider = appwriteLiveProvider(appwriteClient, {
+ databaseId: "database",
+});
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/utility/appwriteClient.ts b/refine-nextjs/plugins/data-provider-appwrite/src/utility/appwriteClient.ts
deleted file mode 100644
index 950a55b24..000000000
--- a/refine-nextjs/plugins/data-provider-appwrite/src/utility/appwriteClient.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { Account, Appwrite, Storage } from "@refinedev/appwrite";
-import nookies from "nookies";
-
-const APPWRITE_URL = "https://refine.appwrite.org/v1";
-const APPWRITE_PROJECT = "61c4368b4e349";
-export const APPWRITE_TOKEN_KEY = "appwrite-jwt";
-
-const appwriteClient = new Appwrite();
-
-appwriteClient.setEndpoint(APPWRITE_URL).setProject(APPWRITE_PROJECT);
-
-// for client side authentication
-const cookies = nookies.get();
-const appwriteJWT = cookies[APPWRITE_TOKEN_KEY];
-if (appwriteJWT) {
- appwriteClient.setJWT(appwriteJWT);
-}
-
-const account = new Account(appwriteClient);
-const storage = new Storage(appwriteClient);
-
-export { appwriteClient, account, storage };
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/utility/constants.ts b/refine-nextjs/plugins/data-provider-appwrite/src/utility/constants.ts
new file mode 100644
index 000000000..3046b4303
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/utility/constants.ts
@@ -0,0 +1,3 @@
+export const APPWRITE_URL = "https://refine.appwrite.org/v1";
+export const APPWRITE_PROJECT = "61c4368b4e349";
+export const APPWRITE_TOKEN_KEY = "appwrite-jwt";
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/utility/index.ts b/refine-nextjs/plugins/data-provider-appwrite/src/utility/index.ts
deleted file mode 100644
index b4f6465b1..000000000
--- a/refine-nextjs/plugins/data-provider-appwrite/src/utility/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export * from "./appwriteClient";
-<%_ if (answers["ui-framework"] === "antd") { _%>
-export * from "./normalize";
-<%_ } _%>
diff --git a/refine-nextjs/plugins/data-provider-appwrite/src/utility/normalize.ts b/refine-nextjs/plugins/data-provider-appwrite/src/utility/normalize.ts
index 038790ea5..4631e8488 100644
--- a/refine-nextjs/plugins/data-provider-appwrite/src/utility/normalize.ts
+++ b/refine-nextjs/plugins/data-provider-appwrite/src/utility/normalize.ts
@@ -1,3 +1,5 @@
+"use client";
+
import { UploadFile } from "antd";
interface UploadResponse {
@@ -24,4 +26,4 @@ export const normalizeFile = (event: EventArgs) => {
status,
};
});
-};
\ No newline at end of file
+};
diff --git a/refine-nextjs/plugins/data-provider-custom-json-rest/extend.js b/refine-nextjs/plugins/data-provider-custom-json-rest/extend.js
index 02f53b8d4..8a43af398 100644
--- a/refine-nextjs/plugins/data-provider-custom-json-rest/extend.js
+++ b/refine-nextjs/plugins/data-provider-custom-json-rest/extend.js
@@ -1,11 +1,8 @@
const base = {
_app: {
- import: [`import dataProvider from "@refinedev/simple-rest";`],
- afterImport: [
- `const API_URL = "https://api.fake-rest.refine.dev";`,
- "",
- ],
- refineProps: ["dataProvider={dataProvider(API_URL)}"],
+ import: [`import { dataProvider } from "@providers/data-provider";`],
+ afterImport: [],
+ refineProps: ["dataProvider={dataProvider}"],
},
};
diff --git a/refine-nextjs/plugins/data-provider-custom-json-rest/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-custom-json-rest/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..a049c0e10
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-custom-json-rest/src/providers/data-provider/index.ts
@@ -0,0 +1,7 @@
+"use client";
+
+import dataProviderSimpleRest from "@refinedev/simple-rest";
+
+const API_URL = "https://api.fake-rest.refine.dev";
+
+export const dataProvider = dataProviderSimpleRest(API_URL);
diff --git a/refine-nextjs/plugins/data-provider-graphql/extend.js b/refine-nextjs/plugins/data-provider-graphql/extend.js
index dc6d2fa35..8a43af398 100644
--- a/refine-nextjs/plugins/data-provider-graphql/extend.js
+++ b/refine-nextjs/plugins/data-provider-graphql/extend.js
@@ -1,18 +1,11 @@
const base = {
_app: {
- import: [
- `import dataProvider, { GraphQLClient } from "@refinedev/graphql";`,
- ],
- afterImport: [
- `const API_URL = "https://your-graphql-url/graphql";`,
- "",
- `const client = new GraphQLClient(API_URL);`,
- `const gqlDataProvider = dataProvider(client);`,
- "",
- ],
- refineProps: ["dataProvider={gqlDataProvider}"],
+ import: [`import { dataProvider } from "@providers/data-provider";`],
+ afterImport: [],
+ refineProps: ["dataProvider={dataProvider}"],
},
};
+
module.exports = {
extend() {
return base;
diff --git a/refine-nextjs/plugins/data-provider-graphql/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-graphql/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..f1e1ca6f6
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-graphql/src/providers/data-provider/index.ts
@@ -0,0 +1,9 @@
+"use client";
+
+import graphqlDataProvider, { GraphQLClient } from "@refinedev/graphql";
+
+const API_URL = "https://your-graphql-url/graphql";
+
+export const client = new GraphQLClient(API_URL);
+
+export const dataProvider = graphqlDataProvider(client);
diff --git a/refine-nextjs/plugins/data-provider-hasura/extend.js b/refine-nextjs/plugins/data-provider-hasura/extend.js
index 2afb9ba6c..8a43af398 100644
--- a/refine-nextjs/plugins/data-provider-hasura/extend.js
+++ b/refine-nextjs/plugins/data-provider-hasura/extend.js
@@ -1,21 +1,11 @@
const base = {
_app: {
- import: [
- `import dataProvider, { GraphQLClient } from "@refinedev/hasura";`,
- ],
- afterImport: [
- "",
- `const API_URL = "https://flowing-mammal-24.hasura.app/v1/graphql";`,
- "",
- `const client = new GraphQLClient(API_URL, {
- headers: {
- "x-hasura-role": "public",
- },
- });`,
- ],
- refineProps: [`dataProvider={dataProvider(client)}`],
+ import: [`import { dataProvider } from "@providers/data-provider";`],
+ afterImport: [],
+ refineProps: ["dataProvider={dataProvider}"],
},
};
+
module.exports = {
extend() {
return base;
diff --git a/refine-nextjs/plugins/data-provider-hasura/src/inferencerPredefinedMeta.ts b/refine-nextjs/plugins/data-provider-hasura/src/inferencerPredefinedMeta.ts
deleted file mode 100644
index 67f26ed5b..000000000
--- a/refine-nextjs/plugins/data-provider-hasura/src/inferencerPredefinedMeta.ts
+++ /dev/null
@@ -1,202 +0,0 @@
-import gql from "graphql-tag";
-
-/**
- * This `meta` object is used to define the necessary metadata for inferencer to work with.
- *
- * They will be used to infer the fields of the response of the data provider.
- * Also they will be included in the generated code, making them easily editable after you generate the boilerplate code for your resource.
- */
-export const inferencerPredefinedMeta = {
- blog_posts: {
- getList: {
- gqlQuery: gql`
- query BlogPostsList(
- $offset: Int!
- $limit: Int!
- $order_by: [blog_posts_order_by!]
- $where: blog_posts_bool_exp
- ) {
- blog_posts(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- content
- category_id
- created_at
- status
- category {
- id
- title
- }
- }
- blog_posts_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getOne: {
- gqlQuery: gql`
- query GetBlogPost($id: uuid!) {
- blog_posts_by_pk(id: $id) {
- id
- title
- content
- category_id
- created_at
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- create: {
- foo: "bar",
- objFoo: {
- bar: "baz",
- },
- gqlMutation: gql`
- mutation CreateBlogPosts($object: blog_posts_insert_input!) {
- insert_blog_posts_one(object: $object) {
- id
- title
- content
- created_at
- category_id
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- update: {
- gqlMutation: gql`
- mutation UpdateBlogPosts(
- $id: uuid!
- $object: blog_posts_set_input!
- ) {
- update_blog_posts_by_pk(
- pk_columns: { id: $id }
- _set: $object
- ) {
- id
- title
- content
- created_at
- category_id
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- },
- categories: {
- default: {
- gqlQuery: gql`
- query CategoriesList(
- $offset: Int
- $limit: Int
- $order_by: [categories_order_by!]
- $where: categories_bool_exp
- ) {
- categories(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- created_at
- }
- categories_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getList: {
- gqlQuery: gql`
- query CategoriesList(
- $offset: Int
- $limit: Int
- $order_by: [categories_order_by!]
- $where: categories_bool_exp
- ) {
- categories(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- created_at
- }
- categories_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getOne: {
- gqlQuery: gql`
- query GetCategory($id: uuid!) {
- categories_by_pk(id: $id) {
- id
- title
- created_at
- }
- }
- `,
- },
- create: {
- gqlMutation: gql`
- mutation CreateCategory($object: categories_insert_input!) {
- insert_categories_one(object: $object) {
- id
- title
- created_at
- }
- }
- `,
- },
- update: {
- gqlMutation: gql`
- mutation UpdateCategory(
- $id: uuid!
- $object: categories_set_input!
- ) {
- update_categories_by_pk(
- pk_columns: { id: $id }
- _set: $object
- ) {
- id
- title
- created_at
- }
- }
- `,
- },
- },
-};
diff --git a/refine-nextjs/plugins/data-provider-hasura/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-hasura/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..f4eff9c90
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-hasura/src/providers/data-provider/index.ts
@@ -0,0 +1,13 @@
+"use client";
+
+import dataProviderHasura, { GraphQLClient } from "@refinedev/hasura";
+
+const API_URL = "https://flowing-mammal-24.hasura.app/v1/graphql";
+
+export const client = new GraphQLClient(API_URL, {
+ headers: {
+ "x-hasura-role": "public",
+ },
+});
+
+export const dataProvider = dataProviderHasura(client);
diff --git a/refine-nextjs/plugins/data-provider-hasura/src/queries/blog-posts.ts b/refine-nextjs/plugins/data-provider-hasura/src/queries/blog-posts.ts
new file mode 100644
index 000000000..76bfc8400
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-hasura/src/queries/blog-posts.ts
@@ -0,0 +1,13 @@
+export const BLOG_POSTS_QUERY = [
+ "id",
+ "title",
+ "status",
+ "created_at",
+ "category_id",
+ "content",
+ {
+ category: ["id", "title"],
+ },
+];
+
+export const BLOG_POSTS_CATEGORIES_SELECT_QUERY = ["id", "title"];
diff --git a/refine-nextjs/plugins/data-provider-hasura/src/queries/categories.ts b/refine-nextjs/plugins/data-provider-hasura/src/queries/categories.ts
new file mode 100644
index 000000000..9a6a5ccd8
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-hasura/src/queries/categories.ts
@@ -0,0 +1 @@
+export const CATEGORIES_QUERY = ["id", "title"];
diff --git a/refine-nextjs/plugins/data-provider-medusa/extend.js b/refine-nextjs/plugins/data-provider-medusa/extend.js
deleted file mode 100644
index f8267892c..000000000
--- a/refine-nextjs/plugins/data-provider-medusa/extend.js
+++ /dev/null
@@ -1,23 +0,0 @@
-const base = {
- _app: {
- import: [
- `import dataProvider, { authProvider } from "@refinedev/medusa";`,
- ],
- afterImport: [
- `const API_URL = "https://your-medusa-url";`,
- "",
- `const medusaDataProvider = dataProvider(API_URL);`,
- `const medusaAuthProvider = authProvider(API_URL);`,
- "",
- ],
- refineProps: [
- "authProvider={medusaAuthProvider}",
- "dataProvider={medusaDataProvider}",
- ],
- },
-};
-module.exports = {
- extend() {
- return base;
- },
-};
diff --git a/refine-nextjs/plugins/data-provider-medusa/package.json b/refine-nextjs/plugins/data-provider-medusa/package.json
deleted file mode 100644
index bfc50b17c..000000000
--- a/refine-nextjs/plugins/data-provider-medusa/package.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
- "dependencies": {
- "@refinedev/medusa": "^3.0.1"
- }
-}
diff --git a/refine-nextjs/plugins/data-provider-nestjs-query/extend.js b/refine-nextjs/plugins/data-provider-nestjs-query/extend.js
index 947ebabec..9494f4b2c 100644
--- a/refine-nextjs/plugins/data-provider-nestjs-query/extend.js
+++ b/refine-nextjs/plugins/data-provider-nestjs-query/extend.js
@@ -1,23 +1,16 @@
const base = {
_app: {
- import: [
- `import dataProvider, { GraphQLClient, liveProvider } from "@refinedev/nestjs-query";`,
- `import { createClient } from "graphql-ws";`
- ],
- afterImport: [
- "",
- `const API_URL = "https://api.nestjs-query.refine.dev/graphql";`,
- `const WS_URL = "wss://api.nestjs-query.refine.dev/graphql";`,
- "",
- `const gqlClient = new GraphQLClient(API_URL);`,
- `const wsClient = createClient({ url: WS_URL });`,
- "",
+ import: [],
+ localImport: [
+ 'import { dataProvider, liveProvider } from "@providers/data-provider";',
],
refineProps: [
- `dataProvider={dataProvider(gqlClient)}`,
- `liveProvider={liveProvider(wsClient)}`,
+ `dataProvider={dataProvider}`,
+ `liveProvider={liveProvider}`,
],
refineOptions: [`liveMode: "auto",`],
+ refineAntdImports: [],
+ refineMuiImports: [],
},
};
module.exports = {
diff --git a/refine-nextjs/plugins/data-provider-nestjs-query/package.json b/refine-nextjs/plugins/data-provider-nestjs-query/package.json
index f3d4e67e7..6506d516e 100644
--- a/refine-nextjs/plugins/data-provider-nestjs-query/package.json
+++ b/refine-nextjs/plugins/data-provider-nestjs-query/package.json
@@ -1,5 +1,16 @@
{
- "dependencies": {
- "@refinedev/nestjs-query": "^1.1.1"
- }
-}
\ No newline at end of file
+ "scripts": {
+ "codegen": "graphql-codegen"
+ },
+ "dependencies": {
+ "@refinedev/nestjs-query": "^1.1.1",
+ "graphql-tag": "^2.12.6",
+ "graphql-ws": "^5.9.1"
+ },
+ "devDependencies": {
+ "@graphql-codegen/cli": "^5.0.0",
+ "@graphql-codegen/typescript": "^4.0.1",
+ "@graphql-codegen/typescript-operations": "^4.0.1",
+ "@graphql-codegen/import-types-preset": "^3.0.0"
+ }
+}
diff --git a/refine-nextjs/plugins/data-provider-nestjs-query/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-nestjs-query/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..b660b82ed
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-nestjs-query/src/providers/data-provider/index.ts
@@ -0,0 +1,16 @@
+"use client";
+
+import dataProviderNestjsQuery, {
+ GraphQLClient,
+ liveProvider as liveProviderNestjsQuery,
+} from "@refinedev/nestjs-query";
+import { createClient } from "graphql-ws";
+
+const API_URL = "https://api.nestjs-query.refine.dev/graphql";
+const WS_URL = "wss://api.nestjs-query.refine.dev/graphql";
+
+const gqlClient = new GraphQLClient(API_URL);
+const wsClient = createClient({ url: WS_URL });
+
+export const dataProvider = dataProviderNestjsQuery(gqlClient);
+export const liveProvider = liveProviderNestjsQuery(wsClient);
diff --git a/refine-nextjs/plugins/data-provider-nestjs-query/src/queries/blog-posts.ts b/refine-nextjs/plugins/data-provider-nestjs-query/src/queries/blog-posts.ts
new file mode 100644
index 000000000..3e77249eb
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-nestjs-query/src/queries/blog-posts.ts
@@ -0,0 +1,85 @@
+import gql from "graphql-tag";
+
+export const POST_CREATE_MUTATION = gql`
+ mutation PostCreate($input: CreateOneBlogPostInput!) {
+ createOneBlogPost(input: $input) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ }
+ }
+`;
+
+export const POST_EDIT_MUTATION = gql`
+ mutation PostEdit($input: UpdateOneBlogPostInput!) {
+ updateOneBlogPost(input: $input) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ }
+ }
+`;
+
+export const POSTS_LIST_QUERY = gql`
+ query BlogPostsList(
+ $paging: OffsetPaging!
+ $filter: BlogPostFilter
+ $sorting: [BlogPostSort!]!
+ ) {
+ blogPosts(paging: $paging, filter: $filter, sorting: $sorting) {
+ nodes {
+ id
+ title
+ categoryId
+ category {
+ id
+ title
+ }
+ status
+ content
+ createdAt
+ }
+ totalCount
+ }
+ }
+`;
+
+export const POST_SHOW_QUERY = gql`
+ query PostShow($id: ID!) {
+ blogPost(id: $id) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ createdAt
+ }
+ }
+`;
+
+export const CATEGORIES_SELECT_QUERY = gql`
+ query CategoriesSelect($filter: CategoryFilter!) {
+ categories(filter: $filter) {
+ nodes {
+ id
+ title
+ }
+ }
+ }
+`;
diff --git a/refine-nextjs/plugins/data-provider-nestjs-query/src/queries/categories.ts b/refine-nextjs/plugins/data-provider-nestjs-query/src/queries/categories.ts
new file mode 100644
index 000000000..8e4e6e0b1
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-nestjs-query/src/queries/categories.ts
@@ -0,0 +1,45 @@
+import gql from "graphql-tag";
+
+export const CATEGORY_CREATE_MUTATION = gql`
+ mutation CategoryCreate($input: CreateOneCategoryInput!) {
+ createOneCategory(input: $input) {
+ id
+ title
+ }
+ }
+`;
+
+export const CATEGORY_EDIT_MUTATION = gql`
+ mutation CategoryEdit($input: UpdateOneCategoryInput!) {
+ updateOneCategory(input: $input) {
+ id
+ title
+ }
+ }
+`;
+
+export const CATEGORIES_LIST_QUERY = gql`
+ query CategoriesList(
+ $paging: OffsetPaging!
+ $filter: CategoryFilter
+ $sorting: [CategorySort!]!
+ ) {
+ categories(paging: $paging, filter: $filter, sorting: $sorting) {
+ nodes {
+ id
+ title
+ createdAt
+ }
+ totalCount
+ }
+ }
+`;
+export const CATEGORY_SHOW_QUERY = gql`
+ query CategoryShow($id: ID!) {
+ category(id: $id) {
+ id
+ title
+ createdAt
+ }
+ }
+`;
diff --git a/refine-nextjs/plugins/data-provider-nestjsx-crud/extend.js b/refine-nextjs/plugins/data-provider-nestjsx-crud/extend.js
index 84535bb87..8a43af398 100644
--- a/refine-nextjs/plugins/data-provider-nestjsx-crud/extend.js
+++ b/refine-nextjs/plugins/data-provider-nestjsx-crud/extend.js
@@ -1,8 +1,8 @@
const base = {
_app: {
- import: ['import dataProvider from "@refinedev/nestjsx-crud";'],
- afterImport: [`const API_URL = "https://api.nestjsx-crud.refine.dev";`],
- refineProps: ["dataProvider={dataProvider(API_URL)}"],
+ import: [`import { dataProvider } from "@providers/data-provider";`],
+ afterImport: [],
+ refineProps: ["dataProvider={dataProvider}"],
},
};
diff --git a/refine-nextjs/plugins/data-provider-nestjsx-crud/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-nestjsx-crud/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..13f8f00c3
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-nestjsx-crud/src/providers/data-provider/index.ts
@@ -0,0 +1,7 @@
+"use client";
+
+import dataProviderNestjsxCrud from "@refinedev/nestjsx-crud";
+
+const API_URL = "https://api.nestjsx-crud.refine.dev";
+
+export const dataProvider = dataProviderNestjsxCrud(API_URL);
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/extend.js b/refine-nextjs/plugins/data-provider-strapi-v4/extend.js
index c4fe4ee5f..366f21843 100644
--- a/refine-nextjs/plugins/data-provider-strapi-v4/extend.js
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/extend.js
@@ -1,16 +1,15 @@
const base = {
_app: {
- import: [`import { DataProvider } from "@refinedev/strapi-v4";`],
+ import: [],
localImport: [
- `import { authProvider, axiosInstance } from "src/authProvider";`,
- `import { API_URL } from "src/constants";`,
+ 'import { authProvider } from "@providers/auth-provider";',
+ 'import { dataProvider } from "@providers/data-provider";',
],
refineProps: [
"authProvider={authProvider}",
- "dataProvider={DataProvider(API_URL + `/api`, axiosInstance)}",
+ "dataProvider={dataProvider}",
],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
},
};
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/package.json b/refine-nextjs/plugins/data-provider-strapi-v4/package.json
index e2b156cb7..1e78c87ff 100644
--- a/refine-nextjs/plugins/data-provider-strapi-v4/package.json
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/package.json
@@ -1,7 +1,10 @@
{
- "dependencies": {
- "@refinedev/strapi-v4": "^6.0.1",
- "axios": "^1.6.2",
- "nookies": "^2.5.2"
- }
-}
\ No newline at end of file
+ "dependencies": {
+ "@refinedev/strapi-v4": "^6.0.1",
+ "axios": "^1.6.2",
+ "js-cookie": "^3.0.5"
+ },
+ "devDependencies": {
+ "@types/js-cookie": "^3.0.6"
+ }
+}
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/pages/forgot-password/index.tsx b/refine-nextjs/plugins/data-provider-strapi-v4/pages/forgot-password/index.tsx
deleted file mode 100644
index 18e230c29..000000000
--- a/refine-nextjs/plugins/data-provider-strapi-v4/pages/forgot-password/index.tsx
+++ /dev/null
@@ -1,77 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-export default function ForgotPassword() {
- return (
-
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-ForgotPassword.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/pages/login/index.tsx b/refine-nextjs/plugins/data-provider-strapi-v4/pages/login/index.tsx
deleted file mode 100644
index 116a8f50e..000000000
--- a/refine-nextjs/plugins/data-provider-strapi-v4/pages/login/index.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-export default function Login() {
- return (
-
- <%_ if ((selectedSvg || selectedTitle) && answers["ui-framework"] !== "no") { _%>
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-Login.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-
-};
-
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/pages/register/index.tsx b/refine-nextjs/plugins/data-provider-strapi-v4/pages/register/index.tsx
deleted file mode 100644
index d207e59f7..000000000
--- a/refine-nextjs/plugins/data-provider-strapi-v4/pages/register/index.tsx
+++ /dev/null
@@ -1,76 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-export default function Register() {
- return (
-
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-Register.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/app/forgot-password/page.tsx b/refine-nextjs/plugins/data-provider-strapi-v4/src/app/forgot-password/page.tsx
new file mode 100644
index 000000000..c2b0061f5
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/app/forgot-password/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function ForgotPassword() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/app/login/page.tsx b/refine-nextjs/plugins/data-provider-strapi-v4/src/app/login/page.tsx
new file mode 100644
index 000000000..e4e77ff92
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/app/login/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function Login() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/app/register/page.tsx b/refine-nextjs/plugins/data-provider-strapi-v4/src/app/register/page.tsx
new file mode 100644
index 000000000..b07acae8d
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/app/register/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function Register() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/auth-provider.server.ts b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/auth-provider.server.ts
new file mode 100644
index 000000000..03deb9a9d
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/auth-provider.server.ts
@@ -0,0 +1,22 @@
+import { AuthBindings } from "@refinedev/core";
+import { TOKEN_KEY } from "@utility/constants";
+import { cookies } from "next/headers";
+
+export const authProviderServer: Pick = {
+ check: async () => {
+ const cookieStore = cookies();
+ const auth = cookieStore.get(TOKEN_KEY);
+
+ if (auth) {
+ return {
+ authenticated: true,
+ };
+ }
+
+ return {
+ authenticated: false,
+ logout: true,
+ redirectTo: "/login",
+ };
+ },
+};
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/authProvider.ts b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/auth-provider.ts
similarity index 69%
rename from refine-nextjs/plugins/data-provider-strapi-v4/src/authProvider.ts
rename to refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/auth-provider.ts
index e670be974..e62dde328 100644
--- a/refine-nextjs/plugins/data-provider-strapi-v4/src/authProvider.ts
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/auth-provider.ts
@@ -1,26 +1,19 @@
+"use client";
+
import { AuthBindings } from "@refinedev/core";
import { AuthHelper } from "@refinedev/strapi-v4";
-import axios from "axios";
-import nookies from "nookies";
-import { API_URL, TOKEN_KEY } from "./constants";
+import { axiosInstance } from "@utility/axios-instance";
+import { API_URL, TOKEN_KEY } from "@utility/constants";
+import Cookies from "js-cookie";
-export const axiosInstance = axios.create();
const strapiAuthHelper = AuthHelper(API_URL + "/api");
-axiosInstance.interceptors.request.use((config) => {
- const cookies = nookies.get();
- if (cookies[TOKEN_KEY] && config.headers) {
- config.headers["Authorization"] = `Bearer ${cookies[TOKEN_KEY]}`;
- }
- return config;
-});
-
export const authProvider: AuthBindings = {
login: async ({ email, password }) => {
const { data, status } = await strapiAuthHelper.login(email, password);
if (status === 200) {
- nookies.set(null, TOKEN_KEY, data.jwt, {
- maxAge: 30 * 24 * 60 * 60,
+ Cookies.set(TOKEN_KEY, data.jwt, {
+ expires: 30, // 30 days
path: "/",
});
@@ -43,17 +36,17 @@ export const authProvider: AuthBindings = {
};
},
logout: async () => {
- nookies.destroy(null, TOKEN_KEY);
+ Cookies.remove(TOKEN_KEY, { path: "/" });
return {
success: true,
redirectTo: "/login",
};
},
- check: async (ctx) => {
- const cookies = nookies.get(ctx);
- if (cookies[TOKEN_KEY]) {
+ check: async () => {
+ const token = Cookies.get(TOKEN_KEY);
+ if (token) {
axiosInstance.defaults.headers.common = {
- Authorization: `Bearer ${cookies[TOKEN_KEY]}`,
+ Authorization: `Bearer ${token}`,
};
return {
authenticated: true,
@@ -67,7 +60,7 @@ export const authProvider: AuthBindings = {
},
getPermissions: async () => null,
getIdentity: async () => {
- const token = nookies.get()[TOKEN_KEY];
+ const token = Cookies.get(TOKEN_KEY);
if (!token) {
return null;
}
@@ -85,7 +78,12 @@ export const authProvider: AuthBindings = {
return null;
},
onError: async (error) => {
- console.error(error);
+ if (error.response?.status === 401) {
+ return {
+ logout: true,
+ };
+ }
+
return { error };
},
};
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/index.ts b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/index.ts
new file mode 100644
index 000000000..b7f6d9fe9
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/auth-provider/index.ts
@@ -0,0 +1,2 @@
+export * from './auth-provider'
+export * from './auth-provider.server'
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..2fba71074
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/providers/data-provider/index.ts
@@ -0,0 +1,7 @@
+"use client";
+
+import { DataProvider } from "@refinedev/strapi-v4";
+import { axiosInstance } from "@utility/axios-instance";
+import { API_URL } from "@utility/constants";
+
+export const dataProvider = DataProvider(API_URL + `/api`, axiosInstance);
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/utility/axios-instance.ts b/refine-nextjs/plugins/data-provider-strapi-v4/src/utility/axios-instance.ts
new file mode 100644
index 000000000..d336fc60f
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-strapi-v4/src/utility/axios-instance.ts
@@ -0,0 +1,16 @@
+"use client";
+
+import { TOKEN_KEY } from "@utility/constants";
+import axios from "axios";
+import Cookies from "js-cookie";
+
+export const axiosInstance = axios.create();
+
+axiosInstance.interceptors.request.use((config) => {
+ const token = Cookies.get(TOKEN_KEY);
+
+ if (token && config.headers) {
+ config.headers["Authorization"] = `Bearer ${token}`;
+ }
+ return config;
+});
diff --git a/refine-nextjs/plugins/data-provider-strapi-v4/src/constants.ts b/refine-nextjs/plugins/data-provider-strapi-v4/src/utility/constants.ts
similarity index 100%
rename from refine-nextjs/plugins/data-provider-strapi-v4/src/constants.ts
rename to refine-nextjs/plugins/data-provider-strapi-v4/src/utility/constants.ts
diff --git a/refine-nextjs/plugins/data-provider-supabase/extend.js b/refine-nextjs/plugins/data-provider-supabase/extend.js
index bc7f0ca99..366f21843 100644
--- a/refine-nextjs/plugins/data-provider-supabase/extend.js
+++ b/refine-nextjs/plugins/data-provider-supabase/extend.js
@@ -1,18 +1,16 @@
const base = {
_app: {
- import: [`import { dataProvider } from "@refinedev/supabase";`],
+ import: [],
localImport: [
- `import { authProvider } from "src/authProvider";`,
- `import { supabaseClient } from "src/utility";`,
+ 'import { authProvider } from "@providers/auth-provider";',
+ 'import { dataProvider } from "@providers/data-provider";',
],
- refineAntdImports: [],
- refineMantineImports: [],
- refineMuiImports: [],
- refineChakraImports: [],
refineProps: [
- "dataProvider={dataProvider(supabaseClient)}",
"authProvider={authProvider}",
+ "dataProvider={dataProvider}",
],
+ refineAntdImports: [],
+ refineMuiImports: [],
},
};
module.exports = {
diff --git a/refine-nextjs/plugins/data-provider-supabase/package.json b/refine-nextjs/plugins/data-provider-supabase/package.json
index 5e5359604..45fe38bb5 100644
--- a/refine-nextjs/plugins/data-provider-supabase/package.json
+++ b/refine-nextjs/plugins/data-provider-supabase/package.json
@@ -1,6 +1,9 @@
{
- "dependencies": {
- "@refinedev/supabase": "^5.7.4",
- "nookies": "^2.5.2"
- }
-}
\ No newline at end of file
+ "dependencies": {
+ "@refinedev/supabase": "^5.7.4",
+ "js-cookie": "^3.0.5"
+ },
+ "devDependencies": {
+ "@types/js-cookie": "^3.0.6"
+ }
+}
diff --git a/refine-nextjs/plugins/data-provider-supabase/pages/forgot-password/index.tsx b/refine-nextjs/plugins/data-provider-supabase/pages/forgot-password/index.tsx
deleted file mode 100644
index 1c89afd6f..000000000
--- a/refine-nextjs/plugins/data-provider-supabase/pages/forgot-password/index.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-export default function ForgotPassword() {
- return (
-
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-ForgotPassword.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
diff --git a/refine-nextjs/plugins/data-provider-supabase/pages/login/index.tsx b/refine-nextjs/plugins/data-provider-supabase/pages/login/index.tsx
deleted file mode 100644
index a62336d42..000000000
--- a/refine-nextjs/plugins/data-provider-supabase/pages/login/index.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-export default function Login() {
- return (
-
- <%_ if ((selectedSvg || selectedTitle) && answers["ui-framework"] !== "no") { _%>
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- />
- );
-}
-
-Login.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
-
diff --git a/refine-nextjs/plugins/data-provider-supabase/pages/register/index.tsx b/refine-nextjs/plugins/data-provider-supabase/pages/register/index.tsx
deleted file mode 100644
index 24fea6637..000000000
--- a/refine-nextjs/plugins/data-provider-supabase/pages/register/index.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers[`ui-framework`] === "no") { _%>
- import { AuthPage } from "@refinedev/core";
-<%_ } _%>
-
-import { GetServerSideProps } from "next";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-import { authProvider } from "src/authProvider";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "src/components/app-icon";
-<%_ } _%>
-
-export default function Register() {
- return (
-
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%> />
- );
-}
-
-Register.noLayout = true;
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- const { authenticated } = await authProvider.check(context);
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- if (authenticated) {
- return {
- props: {},
- redirect: {
- destination: `/`,
- permanent: false,
- },
- };
- }
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- }
- }
-};
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/app/forgot-password/page.tsx b/refine-nextjs/plugins/data-provider-supabase/src/app/forgot-password/page.tsx
new file mode 100644
index 000000000..c2b0061f5
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-supabase/src/app/forgot-password/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function ForgotPassword() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/app/login/page.tsx b/refine-nextjs/plugins/data-provider-supabase/src/app/login/page.tsx
new file mode 100644
index 000000000..e4e77ff92
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-supabase/src/app/login/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function Login() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/app/register/page.tsx b/refine-nextjs/plugins/data-provider-supabase/src/app/register/page.tsx
new file mode 100644
index 000000000..b07acae8d
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-supabase/src/app/register/page.tsx
@@ -0,0 +1,24 @@
+import { AuthPage } from "@components/auth-page";
+import { authProviderServer } from "@providers/auth-provider";
+import { redirect } from "next/navigation";
+
+export default async function Register() {
+ const data = await getData();
+
+ if (data.authenticated) {
+ redirect(data?.redirectTo || "/");
+ }
+
+ return ;
+}
+
+async function getData() {
+ const { authenticated, redirectTo, error } =
+ await authProviderServer.check();
+
+ return {
+ authenticated,
+ redirectTo,
+ error,
+ };
+}
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/auth-provider.server.ts b/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/auth-provider.server.ts
new file mode 100644
index 000000000..ade4d4736
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/auth-provider.server.ts
@@ -0,0 +1,21 @@
+import { AuthBindings } from "@refinedev/core";
+import { cookies } from "next/headers";
+
+export const authProviderServer: Pick = {
+ check: async () => {
+ const cookieStore = cookies();
+ const auth = cookieStore.get("token");
+
+ if (auth) {
+ return {
+ authenticated: true,
+ };
+ }
+
+ return {
+ authenticated: false,
+ logout: true,
+ redirectTo: "/login",
+ };
+ },
+};
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/authProvider.ts b/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/auth-provider.ts
similarity index 85%
rename from refine-nextjs/plugins/data-provider-supabase/src/authProvider.ts
rename to refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/auth-provider.ts
index c9f7ca106..8772fb217 100644
--- a/refine-nextjs/plugins/data-provider-supabase/src/authProvider.ts
+++ b/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/auth-provider.ts
@@ -1,7 +1,8 @@
-import { AuthBindings } from "@refinedev/core";
-import nookies from "nookies";
+"use client";
-import { supabaseClient } from "./utility";
+import { AuthBindings } from "@refinedev/core";
+import { supabaseClient } from "@utility/supabase-client";
+import Cookies from "js-cookie";
export const authProvider: AuthBindings = {
login: async ({ email, password }) => {
@@ -14,12 +15,12 @@ export const authProvider: AuthBindings = {
return {
success: false,
error,
- }
+ };
}
if (data?.session) {
- nookies.set(null, "token", data.session.access_token, {
- maxAge: 30 * 24 * 60 * 60,
+ Cookies.set("token", data.session.access_token, {
+ expires: 30, // 30 days
path: "/",
});
@@ -39,7 +40,7 @@ export const authProvider: AuthBindings = {
};
},
logout: async () => {
- nookies.destroy(null, "token");
+ Cookies.remove("token", { path: "/" });
const { error } = await supabaseClient.auth.signOut();
if (error) {
@@ -60,14 +61,14 @@ export const authProvider: AuthBindings = {
email,
password,
});
-
+
if (error) {
return {
success: false,
error,
};
}
-
+
if (data) {
return {
success: true,
@@ -80,7 +81,7 @@ export const authProvider: AuthBindings = {
error,
};
}
-
+
return {
success: false,
error: {
@@ -89,8 +90,8 @@ export const authProvider: AuthBindings = {
},
};
},
- check: async (ctx) => {
- const { token } = nookies.get(ctx);
+ check: async () => {
+ const token = Cookies.get("token");
const { data } = await supabaseClient.auth.getUser(token);
const { user } = data;
@@ -127,7 +128,12 @@ export const authProvider: AuthBindings = {
return null;
},
onError: async (error) => {
- console.error(error);
+ if (error?.code === "PGRST301" || error?.code === 401) {
+ return {
+ logout: true,
+ };
+ }
+
return { error };
},
};
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/index.ts b/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/index.ts
new file mode 100644
index 000000000..b7f6d9fe9
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-supabase/src/providers/auth-provider/index.ts
@@ -0,0 +1,2 @@
+export * from './auth-provider'
+export * from './auth-provider.server'
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/providers/data-provider/index.ts b/refine-nextjs/plugins/data-provider-supabase/src/providers/data-provider/index.ts
new file mode 100644
index 000000000..afe23face
--- /dev/null
+++ b/refine-nextjs/plugins/data-provider-supabase/src/providers/data-provider/index.ts
@@ -0,0 +1,6 @@
+"use client";
+
+import { dataProvider as dataProviderSupabase } from "@refinedev/supabase";
+import { supabaseClient } from "@utility/supabase-client";
+
+export const dataProvider = dataProviderSupabase(supabaseClient);
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/utility/index.ts b/refine-nextjs/plugins/data-provider-supabase/src/utility/index.ts
deleted file mode 100644
index 1a2159651..000000000
--- a/refine-nextjs/plugins/data-provider-supabase/src/utility/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from "./supabaseClient";
diff --git a/refine-nextjs/plugins/data-provider-supabase/src/utility/supabaseClient.ts b/refine-nextjs/plugins/data-provider-supabase/src/utility/supabase-client.ts
similarity index 99%
rename from refine-nextjs/plugins/data-provider-supabase/src/utility/supabaseClient.ts
rename to refine-nextjs/plugins/data-provider-supabase/src/utility/supabase-client.ts
index 4368fd9f1..595273b8e 100644
--- a/refine-nextjs/plugins/data-provider-supabase/src/utility/supabaseClient.ts
+++ b/refine-nextjs/plugins/data-provider-supabase/src/utility/supabase-client.ts
@@ -11,4 +11,4 @@ export const supabaseClient = createClient(SUPABASE_URL, SUPABASE_KEY, {
auth: {
persistSession: true,
},
-});
\ No newline at end of file
+});
diff --git a/refine-nextjs/plugins/headless-example/package.json b/refine-nextjs/plugins/headless-example/package.json
new file mode 100644
index 000000000..20dc8d7ec
--- /dev/null
+++ b/refine-nextjs/plugins/headless-example/package.json
@@ -0,0 +1,8 @@
+{
+ "dependencies": {
+ "@refinedev/react-hook-form": "^4.8.14",
+ "@refinedev/nextjs-router": "^6.0.0",
+ "@refinedev/react-table": "^5.6.6",
+ "@tanstack/react-table": "^8.2.6"
+ }
+}
diff --git a/refine-nextjs/plugins/headless-example/src/app/blog-posts/create/page.tsx b/refine-nextjs/plugins/headless-example/src/app/blog-posts/create/page.tsx
new file mode 100644
index 000000000..efee9192c
--- /dev/null
+++ b/refine-nextjs/plugins/headless-example/src/app/blog-posts/create/page.tsx
@@ -0,0 +1,144 @@
+"use client"
+
+import {
+ IResourceComponentsProps,
+ useNavigation,
+ useSelect,
+} from "@refinedev/core";
+import { useForm } from "@refinedev/react-hook-form";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from "@queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_CREATE_MUTATION, CATEGORIES_SELECT_QUERY } from "@queries/blog-posts";
+<%_ } _%>
+
+export default function BlogPostCreate() {
+ const { list } = useNavigation();
+
+ const {
+ refineCore: { onFinish },
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: POST_CREATE_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ const { options: categoryOptions } = useSelect({
+ resource: "categories",
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
Create
+
+
+
+
+
+
+
+
Edit
+
+
+
+
+
+
+
+
+
+ );
+ },
+ },
+ ],
+ [],
+ );
+
+ const { edit, show, create } = useNavigation();
+
+ const {
+ getHeaderGroups,
+ getRowModel,
+ setOptions,
+ refineCore: {
+ tableQueryResult: { data: tableData },
+ },
+ getState,
+ setPageIndex,
+ getCanPreviousPage,
+ getPageCount,
+ getCanNextPage,
+ nextPage,
+ previousPage,
+ setPageSize,
+ } = useTable({
+ columns,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ refineCoreProps: {
+ meta: {
+ populate: ['category'],
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlQuery: POSTS_LIST_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ refineCoreProps: {
+ meta: {
+ select: '*, categories(id,title)',
+ },
+ },
+<%_ } _%>
+ });
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData } = useMany({
+ resource: "categories",
+ ids: tableData?.data?.map((item) => item?.<%- blogPostCategoryFieldName %>?.id).filter(Boolean) ?? [],
+ queryOptions: {
+ enabled: !!tableData?.data,
+ },
+ });
+
+ setOptions((prev) => ({
+ ...prev,
+ meta: {
+ ...prev.meta,
+ categoryData,
+ },
+ }));
+<%_ } _%>
+
+ return (
+
+
+
{"List"}
+
+
+
+
+
+ {getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => (
+ |
+ {!header.isPlaceholder &&
+ flexRender(
+ header.column.columnDef.header,
+ header.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+ {getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+ |
+ {flexRender(
+ cell.column.columnDef.cell,
+ cell.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ {" "}
+ {getState().pagination.pageIndex + 1} / {getPageCount()}{" "}
+
+
+
+ | {"Go"}:{" "}
+ {
+ const page = e.target.value
+ ? Number(e.target.value) - 1
+ : 0;
+ setPageIndex(page);
+ }}
+ />
+ {" "}
+
+
+
+
+
{"Show"}
+
+
+
+
+
+
+
+
{"ID"}
+
{record?.id ?? ""}
+
+
+
{"Title"}
+
{record?.title}
+
+
+
{"Content"}
+
{record?.content}
+
+
+
{"Category"}
+<%_ if (isGraphQL) { _%>
+
{record?.<%- blogPostCategoryFieldName %>?.title}
+<%_ } else { _%>
+
+ {categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )}
+
+<%_ } _%>
+
+
+
{"Status"}
+
{record?.status}
+
+
+
{"Created at"}
+
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ {new Date(record?.created_at).toLocaleString(undefined, {
+ timeZone: "UTC",
+ })}
+<%_ } else { _%>
+ {new Date(record?.createdAt).toLocaleString(undefined, {
+ timeZone: "UTC",
+ })}
+<%_ } _%>
+
+
+
+
+
+
Create
+
+
+
+
+
+
+
+
Edit
+
+
+
+
+
+
+
+
+
+ );
+ },
+ },
+ ],
+ [],
+ );
+
+ const { edit, show, create } = useNavigation();
+
+ const {
+ getHeaderGroups,
+ getRowModel,
+ setOptions,
+ getState,
+ setPageIndex,
+ getCanPreviousPage,
+ getPageCount,
+ getCanNextPage,
+ nextPage,
+ previousPage,
+ setPageSize,
+ } = useTable({
+ columns,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+ },
+<%_ } _%>
+ });
+
+ setOptions((prev) => ({
+ ...prev,
+ meta: {
+ ...prev.meta,
+ },
+ }));
+
+ return (
+
+
+
List
+
+
+
+
+
+ {getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => (
+ |
+ {!header.isPlaceholder &&
+ flexRender(
+ header.column.columnDef.header,
+ header.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+ {getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+ |
+ {flexRender(
+ cell.column.columnDef.cell,
+ cell.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ {" "}
+ {getState().pagination.pageIndex + 1} / {getPageCount()}{" "}
+
+
+
+ | Go:{" "}
+ {
+ const page = e.target.value
+ ? Number(e.target.value) - 1
+ : 0;
+ setPageIndex(page);
+ }}
+ />
+ {" "}
+
+
+
+
+
Show
+
+
+
+
+
+
+
+
ID
+
{record?.id ?? ""}
+
+
+
Title
+
{record?.title}
+
+
+
+
+
+ );
+};
+
diff --git a/refine-nextjs/plugins/mui-example/src/app/blog-posts/show/[id]/page.tsx b/refine-nextjs/plugins/mui-example/src/app/blog-posts/show/[id]/page.tsx
new file mode 100644
index 000000000..bb9632084
--- /dev/null
+++ b/refine-nextjs/plugins/mui-example/src/app/blog-posts/show/[id]/page.tsx
@@ -0,0 +1,106 @@
+"use client";
+
+
+import { Stack, Typography } from "@mui/material";
+import { IResourceComponentsProps, useOne, useShow } from "@refinedev/core";
+import {
+ DateField,
+ MarkdownField,
+ NumberField,
+ Show,
+ TextFieldComponent as TextField,
+} from "@refinedev/mui";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+import { BLOG_POSTS_QUERY } from "@queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_SHOW_QUERY } from "@queries/blog-posts";
+<%_ } _%>
+
+
+export default function BlogPostShow() {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: POST_SHOW_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData, isLoading: categoryIsLoading } = useOne({
+ resource: "categories",
+ id: record?.<%- blogPostCategoryFieldName %>?.id || "",
+ queryOptions: {
+ enabled: !!record,
+ },
+ });
+<%_ } _%>
+
+ return (
+
+
+
+ {"ID"}
+
+
+
+
+ {"Title"}
+
+
+
+
+ {"Content"}
+
+
+
+
+ {"Category"}
+
+<%_ if (isGraphQL) { _%>
+ {record?.<%- blogPostCategoryFieldName %>?.title}
+<%_ } else { _%>
+ {categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )}
+<%_ } _%>
+
+
+ {"Status"}
+
+
+
+
+ {"CreatedAt"}
+
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+
+<%_ } else { _%>
+
+<%_ } _%>
+
+
+ );
+};
diff --git a/refine-nextjs/plugins/mui-example/src/app/categories/create/page.tsx b/refine-nextjs/plugins/mui-example/src/app/categories/create/page.tsx
new file mode 100644
index 000000000..ffeb29568
--- /dev/null
+++ b/refine-nextjs/plugins/mui-example/src/app/categories/create/page.tsx
@@ -0,0 +1,60 @@
+"use client";
+
+import { Box, TextField } from "@mui/material";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Create } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "@queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_CREATE_MUTATION } from "@queries/categories";
+<%_ } _%>
+
+export default function CategoryCreate() {
+ const {
+ saveButtonProps,
+ refineCore: { formLoading },
+ register,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: CATEGORY_CREATE_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+
+ );
+};
diff --git a/refine-nextjs/plugins/mui-example/src/app/categories/edit/[id]/page.tsx b/refine-nextjs/plugins/mui-example/src/app/categories/edit/[id]/page.tsx
new file mode 100644
index 000000000..a5ac6a7a9
--- /dev/null
+++ b/refine-nextjs/plugins/mui-example/src/app/categories/edit/[id]/page.tsx
@@ -0,0 +1,59 @@
+"use client";
+
+import { Box, TextField } from "@mui/material";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Edit } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "@queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_EDIT_MUTATION } from "@queries/categories";
+<%_ } _%>
+
+export default function CategoryEdit() {
+ const {
+ saveButtonProps,
+ register,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: CATEGORY_EDIT_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+
+ );
+};
diff --git a/refine-nextjs/plugins/mui-example/src/app/categories/layout.tsx b/refine-nextjs/plugins/mui-example/src/app/categories/layout.tsx
new file mode 100644
index 000000000..8cb7254b0
--- /dev/null
+++ b/refine-nextjs/plugins/mui-example/src/app/categories/layout.tsx
@@ -0,0 +1,53 @@
+import React from "react";
+import { ThemedLayout } from "@components/themed-layout";
+<%_ if (_app.isNextAuthCheck) { _%>
+ import authOptions from "@app/api/auth/[...nextauth]/options";
+ import { getServerSession } from 'next-auth/next'
+ import { redirect } from 'next/navigation'
+<%_ } _%>
+<%_ if (_app.isAuthProviderCheck) { _%>
+ import { authProviderServer } from '@providers/auth-provider'
+ import { redirect } from 'next/navigation'
+<%_ } _%>
+
+export default async function Layout({ children }: React.PropsWithChildren) {
+ <%_ if (_app.isNextAuthCheck || _app.isAuthProviderCheck) { _%>
+ const data = await getData()
+
+ <%_ if (_app.isAuthProviderCheck) { _%>
+ if (!data.authenticated) {
+ return redirect(data?.redirectTo || '/login')
+ }
+ <%_ } _%>
+
+ <%_ if (_app.isNextAuthCheck) { _%>
+ if (!data.session?.user) {
+ return redirect('/login')
+ }
+ <%_ } _%>
+
+ <%_ } _%>
+
+ return {children};
+}
+
+
+<%_ if (_app.isNextAuthCheck) { _%>
+ async function getData() {
+ const session = await getServerSession(authOptions)
+ return {
+ session,
+ }
+ }
+<%_ } _%>
+
+<%_ if (_app.isAuthProviderCheck) { _%>
+ async function getData() {
+ const { authenticated, redirectTo } = await authProviderServer.check()
+
+ return {
+ authenticated,
+ redirectTo,
+ }
+ }
+<%_ } _%>
\ No newline at end of file
diff --git a/refine-nextjs/plugins/mui-example/src/app/categories/page.tsx b/refine-nextjs/plugins/mui-example/src/app/categories/page.tsx
new file mode 100644
index 000000000..4ebcc9a7e
--- /dev/null
+++ b/refine-nextjs/plugins/mui-example/src/app/categories/page.tsx
@@ -0,0 +1,74 @@
+"use client";
+
+import { DataGrid, GridColDef } from "@mui/x-data-grid";
+import { IResourceComponentsProps } from "@refinedev/core";
+import {
+ DeleteButton,
+ EditButton,
+ List,
+ ShowButton,
+ useDataGrid,
+} from "@refinedev/mui";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "@queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORIES_LIST_QUERY } from "@queries/categories";
+<%_ } _%>
+
+export default function CategoryList() {
+ const { dataGridProps } = useDataGrid({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+<%_ } _%>
+ });
+
+ const columns = React.useMemo(
+ () => [
+ {
+ field: "id",
+ headerName: "ID",
+ type: "number",
+ minWidth: 50,
+ },
+ {
+ field: "title",
+ flex: 1,
+ headerName: "Title",
+ minWidth: 200,
+ },
+ {
+ field: "actions",
+ headerName: "Actions",
+ sortable: false,
+ renderCell: function render({ row }) {
+ return (
+ <>
+
+
+
+
+ );
+ },
+ align: "center",
+ headerAlign: "center",
+ minWidth: 80,
+ },
+ ],
+ [],
+ );
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-nextjs/plugins/mui-example/src/app/categories/show/[id]/page.tsx b/refine-nextjs/plugins/mui-example/src/app/categories/show/[id]/page.tsx
new file mode 100644
index 000000000..68dd8442f
--- /dev/null
+++ b/refine-nextjs/plugins/mui-example/src/app/categories/show/[id]/page.tsx
@@ -0,0 +1,48 @@
+"use client"
+
+import { Stack, Typography } from "@mui/material";
+import { IResourceComponentsProps, useShow } from "@refinedev/core";
+import {
+ NumberField,
+ Show,
+ TextFieldComponent as TextField,
+} from "@refinedev/mui";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "@queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_SHOW_QUERY } from "@queries/categories";
+<%_ } _%>
+
+export default function CategoryShow() {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORY_SHOW_QUERY,
+ },
+<%_ } _%>
+ });
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+ return (
+
+
+
+ {"ID"}
+
+
+
+ {"Title"}
+
+
+
+
+ );
+};
diff --git a/refine-nextjs/plugins/mui-example/src/components/themed-layout/index.tsx b/refine-nextjs/plugins/mui-example/src/components/themed-layout/index.tsx
new file mode 100644
index 000000000..cb10f4ecc
--- /dev/null
+++ b/refine-nextjs/plugins/mui-example/src/components/themed-layout/index.tsx
@@ -0,0 +1,32 @@
+"use client";
+
+import { Header } from "@components/header";
+import {
+ ThemedLayoutV2,
+ <%_ if (selectedSvg || selectedTitle) { _%>
+ ThemedTitleV2
+ <%_ } _%>
+ } from "@refinedev/mui";
+import React from "react";
+
+export const ThemedLayout = ({ children }: React.PropsWithChildren) => {
+ return (
+ }
+ <%_ if (selectedSvg || selectedTitle) { _%>
+ Title={({ collapsed }) => (
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+ )}
+ <%_ } _%>
+ >
+ {children}
+
+ );
+};
diff --git a/refine-nextjs/plugins/mui/extend.js b/refine-nextjs/plugins/mui/extend.js
index 771c3c7a2..f78eb01a5 100644
--- a/refine-nextjs/plugins/mui/extend.js
+++ b/refine-nextjs/plugins/mui/extend.js
@@ -1,25 +1,18 @@
const base = {
_app: {
refineProps: ["notificationProvider={notificationProvider}"],
- refineMuiImports: [
- "notificationProvider",
- "RefineSnackbarProvider",
- "ThemedLayoutV2",
- ],
+ refineMuiImports: ["notificationProvider", "RefineSnackbarProvider"],
wrapper: [
- ["", ""],
- [""],
[
- ``,
+ "",
+ "",
],
+
["", ""],
],
- import: [
- `import GlobalStyles from "@mui/material/GlobalStyles";`,
- `import CssBaseline from "@mui/material/CssBaseline";`,
- ],
+ import: [],
localImport: [
- 'import { ColorModeContextProvider } from "@contexts";',
+ 'import { ColorModeContextProvider } from "@contexts/color-mode";',
'import { Header } from "@components/header";',
],
},
diff --git a/refine-nextjs/plugins/mui/package.json b/refine-nextjs/plugins/mui/package.json
index e094c892d..e9a2b7ae4 100644
--- a/refine-nextjs/plugins/mui/package.json
+++ b/refine-nextjs/plugins/mui/package.json
@@ -1,13 +1,16 @@
{
- "dependencies": {
- "@refinedev/mui": "^5.14.1",
- "@refinedev/react-hook-form": "^4.8.13",
- "@mui/icons-material": "^5.8.3",
- "@emotion/react": "^11.8.2",
- "@emotion/styled": "^11.8.1",
- "@mui/lab": "^5.0.0-alpha.85",
- "@mui/material": "^5.8.6",
- "@mui/x-data-grid": "^6.6.0",
- "nookies": "^2.5.2"
- }
+ "dependencies": {
+ "@refinedev/mui": "^5.14.4",
+ "@refinedev/react-hook-form": "^4.8.14",
+ "@mui/icons-material": "^5.8.3",
+ "@emotion/react": "^11.8.2",
+ "@emotion/styled": "^11.8.1",
+ "@mui/lab": "^5.0.0-alpha.85",
+ "@mui/material": "^5.8.6",
+ "@mui/x-data-grid": "^6.6.0",
+ "js-cookie": "^3.0.5"
+ },
+ "devDependencies": {
+ "@types/js-cookie": "^3.0.6"
+ }
}
diff --git a/refine-nextjs/plugins/mui/src/components/header/index.tsx b/refine-nextjs/plugins/mui/src/components/header/index.tsx
index 6940df913..cecce2c63 100644
--- a/refine-nextjs/plugins/mui/src/components/header/index.tsx
+++ b/refine-nextjs/plugins/mui/src/components/header/index.tsx
@@ -1,4 +1,4 @@
-import { ColorModeContext } from "@contexts";
+import { ColorModeContext } from "@contexts/color-mode";
import DarkModeOutlined from "@mui/icons-material/DarkModeOutlined";
import LightModeOutlined from "@mui/icons-material/LightModeOutlined";
import AppBar from "@mui/material/AppBar";
diff --git a/refine-nextjs/plugins/mui/src/contexts/index.tsx b/refine-nextjs/plugins/mui/src/contexts/color-mode/index.tsx
similarity index 67%
rename from refine-nextjs/plugins/mui/src/contexts/index.tsx
rename to refine-nextjs/plugins/mui/src/contexts/color-mode/index.tsx
index cc4a4376c..5af24aa0a 100644
--- a/refine-nextjs/plugins/mui/src/contexts/index.tsx
+++ b/refine-nextjs/plugins/mui/src/contexts/color-mode/index.tsx
@@ -1,3 +1,5 @@
+'use client'
+
import React, {
PropsWithChildren,
createContext,
@@ -7,7 +9,9 @@ import React, {
import useMediaQuery from "@mui/material/useMediaQuery";
import { ThemeProvider } from "@mui/material/styles";
import { RefineThemes } from "@refinedev/mui";
-import { parseCookies, setCookie } from "nookies";
+import Cookies from 'js-cookie'
+import GlobalStyles from "@mui/material/GlobalStyles";
+import CssBaseline from "@mui/material/CssBaseline";
type ColorModeContextType = {
mode: string;
@@ -18,11 +22,15 @@ export const ColorModeContext = createContext(
{} as ColorModeContextType,
);
-export const ColorModeContextProvider: React.FC = ({
- children,
-}) => {
+type ColorModeContextProviderProps = {
+ defaultMode?: string;
+};
+
+export const ColorModeContextProvider: React.FC<
+ PropsWithChildren
+> = ({ children, defaultMode }) => {
const [isMounted, setIsMounted] = useState(false);
- const [mode, setMode] = useState("light");
+ const [mode, setMode] = useState(defaultMode || "light");
useEffect(() => {
setIsMounted(true);
@@ -32,9 +40,8 @@ export const ColorModeContextProvider: React.FC = ({
useEffect(() => {
if (isMounted) {
- setMode(
- parseCookies()["theme"] || (systemTheme ? "dark" : "light"),
- );
+ const theme = Cookies.get('theme') || (systemTheme ? "dark" : "light")
+ setMode(theme)
}
}, [isMounted, systemTheme]);
@@ -42,7 +49,7 @@ export const ColorModeContextProvider: React.FC = ({
const nextTheme = mode === "light" ? "dark" : "light";
setMode(nextTheme);
- setCookie(null, "theme", nextTheme);
+ Cookies.set('theme', nextTheme)
};
return (
@@ -58,6 +65,8 @@ export const ColorModeContextProvider: React.FC = ({
mode === "light" ? RefineThemes.<%= selectedTheme %> : RefineThemes.<%= selectedTheme %>Dark
}
>
+
+
{children}
diff --git a/refine-nextjs/prompt.js b/refine-nextjs/prompt.js
index 22f5f9ef9..106edeede 100644
--- a/refine-nextjs/prompt.js
+++ b/refine-nextjs/prompt.js
@@ -51,11 +51,6 @@ module.exports = {
name: "data-provider-hasura",
hint: "Installs Hasura Data Provider.",
},
- {
- message: "Medusa",
- name: "data-provider-medusa",
- hint: "Installs Medusa Data Provider.",
- },
],
default: "data-provider-custom-json-rest",
},
@@ -80,21 +75,32 @@ module.exports = {
name: "mui",
hint: "Installs Material UI package.",
},
+ ],
+ default: "no",
+ },
+ {
+ name: "antd-example",
+ message: "Do you want to add example pages?:",
+ type: "select",
+ choices: [
{
- message: "Mantine",
- name: "mantine",
- hint: "Installs Mantine package.",
+ message: "No",
+ name: "no",
+ hint: "No examples will be installed.",
},
{
- message: "Chakra UI",
- name: "chakra",
- hint: "Installs Chakra UI package.",
+ message: "Yes (Recommended)",
+ name: "antd-example",
+ hint: "Installs example pages.",
},
],
+ skip: ({ answers }) =>
+ answers["ui-framework"] !== "antd" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
- name: "inferencer",
+ name: "mui-example",
message: "Do you want to add example pages?:",
type: "select",
choices: [
@@ -105,19 +111,17 @@ module.exports = {
},
{
message: "Yes (Recommended)",
- name: "inferencer",
+ name: "mui-example",
hint: "Installs example pages.",
},
],
skip: ({ answers }) =>
- answers["ui-framework"] === "no" ||
- answers["data-provider"] === "data-provider-graphql" ||
- answers["data-provider"] === "data-provider-medusa" ||
- answers["data-provider"] === "data-provider-nestjs-query",
+ answers["ui-framework"] !== "mui" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
- name: "inferencer-headless",
+ name: "headless-example",
message: "Do you want to add example pages?:",
type: "select",
choices: [
@@ -128,15 +132,14 @@ module.exports = {
},
{
message: "Yes (Recommended)",
- name: "inferencer-headless",
+ name: "headless-example",
hint: "Installs example pages.",
},
],
skip: ({ answers }) =>
- answers["ui-framework"] !== "no" ||
- answers["data-provider"] === "data-provider-graphql" ||
- answers["data-provider"] === "data-provider-medusa" ||
- answers["data-provider"] === "data-provider-nestjs-query",
+ answers["ui-framework"] === "antd" ||
+ answers["ui-framework"] === "mui" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
@@ -173,111 +176,9 @@ module.exports = {
skip: ({ answers }) =>
answers["data-provider"] === "data-provider-supabase" ||
answers["data-provider"] === "data-provider-strapi-v4" ||
- answers["data-provider"] === "data-provider-appwrite" ||
- answers["data-provider"] === "data-provider-medusa" ||
- answers["data-provider"] === "data-provider-nhost",
+ answers["data-provider"] === "data-provider-appwrite",
default: "none",
},
- {
- name: "i18n-no",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "no",
- },
- {
- name: "i18n-antd",
- message: "Do you need i18n (Internationalization) support?",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-antd",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "antd",
- },
- {
- name: "i18n-mui",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-mui",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "mui",
- },
- {
- name: "i18n-mantine",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-mantine",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "mantine",
- },
- {
- name: "i18n-chakra",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-chakra",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "chakra",
- },
],
ignores: [
{
@@ -309,17 +210,55 @@ module.exports = {
"src/styles/global.css",
],
},
+ {
+ plugin: ["data-provider-hasura"],
+ when: function (answers) {
+ return [
+ "headless-example",
+ "antd-example",
+ "mui-example",
+ ].every((item) => answers[item] === "no");
+ },
+ pattern: ["src/queries/blog-posts.ts", "src/queries/categories.ts"],
+ },
+ {
+ plugin: ["data-provider-nestjs-query"],
+ when: function (answers) {
+ return [
+ "headless-example",
+ "antd-example",
+ "mui-example",
+ ].every((item) => answers[item] === "no");
+ },
+ pattern: ["src/queries/blog-posts.ts", "src/queries/categories.ts"],
+ },
{
plugin: ["_base"],
when: function (answers) {
- return answers[`i18n-${answers["ui-framework"]}`] === "no";
+ if (
+ [
+ "data-provider-supabase",
+ "data-provider-strapi-v4",
+ "data-provider-appwrite",
+ ].includes(answers["data-provider"])
+ ) {
+ return false;
+ }
+
+ if (
+ [
+ "none",
+ "auth-provider-google",
+ "auth-provider-auth0",
+ "auth-provider-keycloak",
+ ].includes(answers["auth-provider"])
+ ) {
+ return true;
+ }
+
+ return false;
},
- pattern: [
- "public/locales/de/common.json",
- "public/locales/en/common.json",
- "public/images/flags/de.svg",
- "public/images/flags/en.svg",
- ],
+ pattern: ["src/components/auth-page/index.tsx"],
},
],
};
diff --git a/refine-nextjs/template/.eslintrc.json b/refine-nextjs/template/.eslintrc.json
new file mode 100644
index 000000000..bffb357a7
--- /dev/null
+++ b/refine-nextjs/template/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+ "extends": "next/core-web-vitals"
+}
diff --git a/refine-nextjs/template/_package.json b/refine-nextjs/template/_package.json
index 5f7fac6ae..74a48d364 100644
--- a/refine-nextjs/template/_package.json
+++ b/refine-nextjs/template/_package.json
@@ -14,13 +14,11 @@
},
"dependencies": {
"@refinedev/cli": "^2.16.21",
- "@refinedev/core": "^4.46.1",
- "@refinedev/devtools": "^1.1.29",
- "@refinedev/nextjs-router": "^5.5.5",
- "@refinedev/inferencer": "^4.5.16",
- "@refinedev/kbar": "^1.3.5",
- "next": "^13.0.6",
- "nookies": "^2.5.2",
+ "@refinedev/core": "^4.47.1",
+ "@refinedev/devtools": "^1.1.32",
+ "@refinedev/nextjs-router": "^6.0.0",
+ "@refinedev/kbar": "^1.3.6",
+ "next": "14.1.0",
"react": "^18.0.0",
"react-dom": "^18.0.0"
},
@@ -30,7 +28,9 @@
"@types/node": "^18.0.0",
"@typescript-eslint/parser": "5.48.0",
"typescript": "^4.7.4",
- "cross-env": "^7.0.3"
+ "cross-env": "^7.0.3",
+ "eslint": "^8",
+ "eslint-config-next": "14.1.0"
<%_ if (typeof projectId !== 'undefined' && projectId !== '') { _%>
},
"refine": {
diff --git a/refine-nextjs/template/_tsconfig.json b/refine-nextjs/template/_tsconfig.json
index 296efc5f0..c67b423fa 100644
--- a/refine-nextjs/template/_tsconfig.json
+++ b/refine-nextjs/template/_tsconfig.json
@@ -1,30 +1,28 @@
{
"compilerOptions": {
- "target": "es5",
- "lib": ["dom", "dom.iterable", "esnext"],
- "allowJs": true,
- "skipLibCheck": true,
- "strict": true,
- "forceConsistentCasingInFileNames": true,
- "noEmit": true,
- "esModuleInterop": true,
- "module": "esnext",
- "moduleResolution": "node",
- "resolveJsonModule": true,
- "isolatedModules": true,
- "jsx": "preserve",
- "baseUrl": ".",
- "paths": {
- "@components/*": ["src/components/*"],
- "@components": ["src/components"],
- "@contexts/*": ["src/contexts/*"],
- "@contexts": ["src/contexts"],
- "@styles/*": ["src/styles/*"],
- "@styles": ["src/styles"],
- "@public/*": ["public/*"],
- "@public": ["public"]
+ "target": "es5",
+ "lib": ["dom", "dom.iterable", "esnext"],
+ "allowJs": true,
+ "skipLibCheck": true,
+ "strict": true,
+ "forceConsistentCasingInFileNames": true,
+ "noEmit": true,
+ "esModuleInterop": true,
+ "module": "esnext",
+ "moduleResolution": "node",
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "jsx": "preserve",
+ "plugins": [
+ {
+ "name": "next"
}
+ ],
+ "paths": {
+ "@*": ["./src/*"],
+ "@pages/*": ["./pages/*"]
+ }
},
- "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+ "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
"exclude": ["node_modules"]
}
diff --git a/refine-nextjs/template/gitignore b/refine-nextjs/template/gitignore
index c340a29f4..0563835d3 100644
--- a/refine-nextjs/template/gitignore
+++ b/refine-nextjs/template/gitignore
@@ -1,8 +1,36 @@
-# npm
-node_modules
-# next.js build files
-.next
-# environment variables
-.env
-.env.*
-!.env.example
\ No newline at end of file
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
\ No newline at end of file
diff --git a/refine-nextjs/template/next-env.d.ts b/refine-nextjs/template/next-env.d.ts
index 528a283af..4f11a03dc 100644
--- a/refine-nextjs/template/next-env.d.ts
+++ b/refine-nextjs/template/next-env.d.ts
@@ -1,3 +1,5 @@
///
-///
-///
\ No newline at end of file
+///
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.
diff --git a/refine-nextjs/template/next.config.js b/refine-nextjs/template/next.config.js
deleted file mode 100644
index 234b927fb..000000000
--- a/refine-nextjs/template/next.config.js
+++ /dev/null
@@ -1,59 +0,0 @@
-<%# https://github.com/refinedev/refine/issues/5197 %>
-<%# We need to add @refinedev/nextjs-router to the next.config.js#transpilePackages to avoid ssr mismatches. %>
-
-<%# https://github.com/refinedev/refine/issues/4998 %>
-<%# Also if user selects ant design we need to add @refinedev/antd and if they selected example pages (inferencer is installed) we can add @refinedev/inferencer as well. %>
-
-<%_if (answers["ui-framework"] === "antd" && answers["inferencer"] === 'inferencer' && answers[`i18n-${answers["ui-framework"]}`] !== "no") {_%>
- const { i18n } = require("./next-i18next.config");
-
- module.exports = {
- i18n,
- transpilePackages: [
- "@refinedev/nextjs-router",
- "@refinedev/antd",
- "@refinedev/inferencer",
- ],
- };
-<%_ } else if (answers["ui-framework"] === "antd" && answers["inferencer"] === 'no' && answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const { i18n } = require("./next-i18next.config");
-
- module.exports = {
- i18n,
- transpilePackages: [
- "@refinedev/nextjs-router",
- "@refinedev/antd",
- ],
- };
-<%_ } else if (answers["ui-framework"] === "antd" && answers["inferencer"] === 'inferencer' && answers[`i18n-${answers["ui-framework"]}`] === "no") { _%>
- module.exports = {
- transpilePackages: [
- "@refinedev/nextjs-router",
- "@refinedev/antd",
- "@refinedev/inferencer",
- ],
- };
-<%_ } else if (answers["ui-framework"] === "antd" && answers["inferencer"] === 'no' && answers[`i18n-${answers["ui-framework"]}`] === "no") { _%>
- module.exports = {
- transpilePackages: [
- "@refinedev/nextjs-router",
- "@refinedev/antd",
- ],
- };
-<%_ } else if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const { i18n } = require("./next-i18next.config");
-
- module.exports = {
- i18n,
- transpilePackages: [
- "@refinedev/nextjs-router",
- ],
- };
-<%_ } else { _%>
- module.exports = {
- transpilePackages: [
- "@refinedev/nextjs-router",
- ],
- };
-<%_ } _%>
-
diff --git a/refine-nextjs/template/next.config.mjs b/refine-nextjs/template/next.config.mjs
new file mode 100644
index 000000000..2bee5e0c6
--- /dev/null
+++ b/refine-nextjs/template/next.config.mjs
@@ -0,0 +1,8 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+ <%_ if (answers["ui-framework"] === 'antd') { _%>
+ transpilePackages: ['@refinedev/antd'],
+ <%_ } _%>
+};
+
+export default nextConfig;
diff --git a/refine-nextjs/template/pages/[...catchAll].tsx b/refine-nextjs/template/pages/[...catchAll].tsx
deleted file mode 100644
index 1caf65348..000000000
--- a/refine-nextjs/template/pages/[...catchAll].tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { ErrorComponent } from "@refinedev/antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { ErrorComponent } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { ErrorComponent } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { ErrorComponent } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'no') { _%>
- import { ErrorComponent } from "@refinedev/core";
-<%_ } _%>
-import { GetServerSideProps } from "next";
-<%_ if (_app.isAuthProviderCheck) { _%>
-import { authProvider } from "src/authProvider";
-<%_ } _%>
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-<%_ } _%>
-
-export default function CatchAll() {
- return ;
-}
-
-export const getServerSideProps: GetServerSideProps<{}> = async (context) => {
- <%_ if (_app.isAuthProviderCheck) { _%>
- const { authenticated, redirectTo } = await authProvider.check(context);
- <%_ } _%>
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const translateProps = await serverSideTranslations(
- context.locale ?? "en",
- ["common"],
- );
- <%_ } _%>
-
- <%_ if (_app.isAuthProviderCheck) { _%>
- if (!authenticated) {
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- },
- redirect: {
- destination: `${redirectTo}?to=${encodeURIComponent(
- context.req.url || "/"
- )}`,
- permanent: false,
- },
- };
- }
- <%_ } _%>
-
- return {
- props: {
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- ...translateProps,
- <%_ } _%>
- },
- };
-};
-
diff --git a/refine-nextjs/template/pages/_app.tsx b/refine-nextjs/template/pages/_app.tsx
deleted file mode 100644
index c950b5223..000000000
--- a/refine-nextjs/template/pages/_app.tsx
+++ /dev/null
@@ -1,167 +0,0 @@
-import React from "react";
-import { AppProps } from "next/app";
-import type { NextPage } from "next";
-import { Refine, GitHubBanner, <%- (_app.refineImports || []).join("\n,") _%> } from '@refinedev/core';
-import { DevtoolsPanel, DevtoolsProvider } from "@refinedev/devtools";
-import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
-<%_ if (answers["ui-framework"] === 'antd') { _%>
- import { <%- (_app.refineAntdImports || []).join("\n,") _%> } from '@refinedev/antd';
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { <%- (_app.refineMuiImports || []).join("\n,") _%> } from '@refinedev/mui';
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { <%- (_app.refineMantineImports || []).join("\n,") _%> } from '@refinedev/mantine';
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { <%- (_app.refineChakraImports || []).join("\n,") _%> } from '@refinedev/chakra-ui';
-<%_ } _%>
-import routerProvider, { UnsavedChangesNotifier, DocumentTitleHandler } from "@refinedev/nextjs-router";
-
-<%- (_app.import || []).join("\n") _%>
-
-<%- (_app.localImport || []).join("\n") _%>
-
-<%- (_app.relativeImport || []).join("\n") _%>
-
-<%- (_app.afterImport || []).join("\n") _%>
-
-<%
- var top = _app.wrapper.map(wrapper => wrapper[0] || "");
- var bottom = _app.wrapper.map(wrapper => wrapper[1] || "").reverse();
-%>
-
-export type NextPageWithLayout = NextPage & {
- noLayout?: boolean;
- };
-
- type AppPropsWithLayout = AppProps & {
- Component: NextPageWithLayout;
- };
-
-function MyApp({ Component, pageProps }: AppPropsWithLayout): JSX.Element {
- const renderComponent = () => {
- if (Component.noLayout) {
- return ;
- }
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return (
-
-
-
- );
- <%_ } else {_%>
- return (
- }
- <%_ if (answers["ui-framework"] === 'antd') { _%>
- Sider={(props) => }
- <%_ } _%>
- <%_ if (selectedSvg || selectedTitle) { _%>
- Title={({ collapsed }) => (
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- >
-
-
- );
- <%_ } _%>
- };
-
- <%- (_app.innerHooks || []).join("\n") %>
- <%- (_app.inner || []).join("\n") %>
- return (
- <>
-
-
- <%- top.join("\n") %>
-
-
- <%_ if (answers["inferencer"] === 'inferencer' || answers["inferencer-headless"] === 'inferencer-headless') { _%>
- resources={[
- <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
- {
- name: "blog-posts",
- list: "/blog-posts",
- create: "/blog-posts/create",
- edit: "/blog-posts/edit/:id",
- show: "/blog-posts/show/:id",
- meta: {
- canDelete: true,
- },
- },
- {
- name: "categories",
- list: "/categories",
- create: "/categories/create",
- edit: "/categories/edit/:id",
- show: "/categories/show/:id",
- meta: {
- canDelete: true,
- },
- }
- <%_ } else { _%>
- {
- name: "blog_posts",
- list: "/blog-posts",
- create: "/blog-posts/create",
- edit: "/blog-posts/edit/:id",
- show: "/blog-posts/show/:id",
- meta: {
- canDelete: true,
- },
- },
- {
- name: "categories",
- list: "/categories",
- create: "/categories/create",
- edit: "/categories/edit/:id",
- show: "/categories/show/:id",
- meta: {
- canDelete: true,
- },
- }
- <%_ } _%>
- ]}
- <%_ } _%>
- options={{
- syncWithLocation: true,
- warnWhenUnsavedChanges: true,
- useNewQueryKeys: true,
- <%_ if (typeof projectId !== 'undefined' && projectId !== '') { _%>
- projectId: "<%= projectId %>",
- <%_ } _%>
- <%- (_app.refineOptions || []).join("\n") %>
- }}
- >
- {renderComponent()}
-
-
-
-
-
-
- <%- bottom.join("\n") %>
-
-
- );
-};
-
-
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== 'no') { _%>
-export default appWithTranslation(MyApp);
-<%_ } else {_%>
-export default MyApp;
-<%_ } _%>
diff --git a/refine-nextjs/template/pages/index.tsx b/refine-nextjs/template/pages/index.tsx
deleted file mode 100644
index de6111984..000000000
--- a/refine-nextjs/template/pages/index.tsx
+++ /dev/null
@@ -1,7 +0,0 @@
-import { WelcomePage } from "@refinedev/core";
-
-export default function Index() {
- return ;
-}
-
-Index.noLayout = true;
diff --git a/refine-nextjs/template/public/favicon.ico b/refine-nextjs/template/public/favicon.ico
deleted file mode 100644
index 2f05c5f48..000000000
Binary files a/refine-nextjs/template/public/favicon.ico and /dev/null differ
diff --git a/refine-nextjs/template/src/app/icon.ico b/refine-nextjs/template/src/app/icon.ico
new file mode 100644
index 000000000..a3df394d6
Binary files /dev/null and b/refine-nextjs/template/src/app/icon.ico differ
diff --git a/refine-nextjs/template/src/app/layout.tsx b/refine-nextjs/template/src/app/layout.tsx
new file mode 100644
index 000000000..6ee9d9972
--- /dev/null
+++ b/refine-nextjs/template/src/app/layout.tsx
@@ -0,0 +1,124 @@
+import { Metadata } from "next";
+<%- (_app.nextjsImport || []).join("\n") _%>
+import React, { Suspense } from 'react'
+import { Refine, GitHubBanner, <%- (_app.refineImports || []).join("\n,") _%> } from '@refinedev/core';
+import { DevtoolsProvider } from '@providers/devtools'
+import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
+<%_ if (answers["ui-framework"] === 'antd') { _%>
+ import { <%- (_app.refineAntdImports || []).join("\n,") _%> } from '@refinedev/antd';
+<%_ } _%>
+<%_ if (answers["ui-framework"] === 'mui') { _%>
+ import { <%- (_app.refineMuiImports || []).join("\n,") _%> } from '@refinedev/mui';
+<%_ } _%>
+import routerProvider from "@refinedev/nextjs-router";
+
+<%- (_app.import || []).join("\n") _%>
+
+<%- (_app.localImport || []).join("\n") _%>
+
+<%- (_app.relativeImport || []).join("\n") _%>
+
+<%- (_app.afterImport || []).join("\n") _%>
+
+<%
+ var top = _app.wrapper.map(wrapper => wrapper[0] || "");
+ var bottom = _app.wrapper.map(wrapper => wrapper[1] || "").reverse();
+%>
+
+export const metadata: Metadata = {
+ title: "Refine",
+ description: "Generated by create refine app",
+ icons: {
+ icon: "/favicon.ico",
+ },
+};
+
+export default function RootLayout({
+ children,
+}: Readonly<{
+ children: React.ReactNode;
+}>) {
+
+ <%- (_app.innerHooks || []).join("\n") %>
+ <%- (_app.inner || []).join("\n") %>
+ <%- (_app.nextjsInner || []).join("\n") %>
+
+ return (
+
+
+
+
+
+ <%- top.join("\n") %>
+
+
+ <%_ if (_app.hasRoutes === true) { _%>
+ resources={[
+ <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
+ {
+ name: "blog-posts",
+ list: "/blog-posts",
+ create: "/blog-posts/create",
+ edit: "/blog-posts/edit/:id",
+ show: "/blog-posts/show/:id",
+ meta: {
+ canDelete: true,
+ },
+ },
+ {
+ name: "categories",
+ list: "/categories",
+ create: "/categories/create",
+ edit: "/categories/edit/:id",
+ show: "/categories/show/:id",
+ meta: {
+ canDelete: true,
+ },
+ }
+ <%_ } else { _%>
+ {
+ name: "blog_posts",
+ list: "/blog-posts",
+ create: "/blog-posts/create",
+ edit: "/blog-posts/edit/:id",
+ show: "/blog-posts/show/:id",
+ meta: {
+ canDelete: true,
+ },
+ },
+ {
+ name: "categories",
+ list: "/categories",
+ create: "/categories/create",
+ edit: "/categories/edit/:id",
+ show: "/categories/show/:id",
+ meta: {
+ canDelete: true,
+ },
+ }
+ <%_ } _%>
+ ]}
+ <%_ } _%>
+ options={{
+ syncWithLocation: true,
+ warnWhenUnsavedChanges: true,
+ useNewQueryKeys: true,
+ <%_ if (typeof projectId !== 'undefined' && projectId !== '') { _%>
+ projectId: "<%= projectId %>",
+ <%_ } _%>
+ <%- (_app.refineOptions || []).join("\n") %>
+ }}
+ >
+ {children}
+
+
+
+ <%- bottom.join("\n") %>
+
+
+
+
+ );
+}
diff --git a/refine-nextjs/template/src/app/not-found.tsx b/refine-nextjs/template/src/app/not-found.tsx
new file mode 100644
index 000000000..514181f07
--- /dev/null
+++ b/refine-nextjs/template/src/app/not-found.tsx
@@ -0,0 +1,23 @@
+"use client"
+
+import { Suspense } from 'react'
+<%_ if (answers["ui-framework"] === 'antd') { _%>
+ import { ErrorComponent } from "@refinedev/antd";
+<%_ } _%>
+<%_ if (answers["ui-framework"] === 'mui') { _%>
+ import { ErrorComponent } from "@refinedev/mui";
+<%_ } _%>
+<%_ if (answers["ui-framework"] === 'no') { _%>
+ import { ErrorComponent } from "@refinedev/core";
+<%_ } _%>
+import { Authenticated } from '@refinedev/core'
+
+export default function NotFound() {
+ return (
+
+
+
+
+
+ )
+}
diff --git a/refine-nextjs/template/src/app/page.tsx b/refine-nextjs/template/src/app/page.tsx
new file mode 100644
index 000000000..6a747213d
--- /dev/null
+++ b/refine-nextjs/template/src/app/page.tsx
@@ -0,0 +1,30 @@
+"use client";
+
+import { Suspense } from 'react'
+
+<%_ if (_app.hasRoutes === true) { _%>
+import { NavigateToResource } from "@refinedev/nextjs-router";
+import { Authenticated } from "@refinedev/core";
+
+export default function IndexPage() {
+ return (
+
+
+
+
+
+ )
+}
+<%_ } _%>
+
+<%_ if (_app.hasRoutes === false) { _%>
+import { WelcomePage } from '@refinedev/core'
+
+export default function IndexPage() {
+ return (
+
+
+
+ )
+}
+<%_ } _%>
\ No newline at end of file
diff --git a/refine-react/plugins/_base/extend.js b/refine-react/plugins/_base/extend.js
deleted file mode 100644
index 7eccbf54f..000000000
--- a/refine-react/plugins/_base/extend.js
+++ /dev/null
@@ -1,208 +0,0 @@
-const base = {
- _app: {
- isAuthRoutes: false,
- isNoAuthRoutes: false,
- hasRoutes: true,
- isCustomLoginPage: false,
- hasStrictMode: true,
- authPageProps: [],
- loginPageProps: [],
- refineProps: [],
- localImport: [],
- refineImports: [`Authenticated`],
- refineAntdImports: [],
- refineChakraImports: [],
- refineMuiImports: [],
- refineMantineImports: [],
- },
- selectedTheme: "Blue",
- selectedTitle: undefined,
- selectedSvg: undefined,
-};
-
-module.exports = {
- extend(answers) {
- const uiFramework = answers["ui-framework"];
- const dataProvider = answers["data-provider"];
- const inferencer = answers["inferencer"];
-
- switch (uiFramework) {
- case "antd":
- base._app.refineAntdImports.push([
- `AuthPage`,
- `ErrorComponent`,
- ]);
- break;
- case "mui":
- base._app.refineMuiImports.push([`AuthPage`, `ErrorComponent`]);
- break;
- case "mantine":
- base._app.refineMantineImports.push([
- `AuthPage`,
- `ErrorComponent`,
- ]);
- break;
- case "chakra":
- base._app.refineChakraImports.push([
- `AuthPage`,
- `ErrorComponent`,
- ]);
- break;
- default:
- base._app.refineImports.push([`AuthPage`, `ErrorComponent`]);
- break;
- }
-
- if (inferencer === "no" && answers["inferencer-headless"] === "no") {
- base._app.hasRoutes = false;
- }
-
- if (answers["auth-provider"] === "none") {
- if (
- [
- "data-provider-appwrite",
- "data-provider-supabase",
- "auth-provider-auth0",
- "data-provider-strapi-v4",
- ].includes(dataProvider)
- ) {
- base._app.isAuthRoutes = true;
- } else {
- base._app.isNoAuthRoutes = true;
- }
- } else {
- base._app.isAuthRoutes = true;
- }
-
- if (
- answers["auth-provider"] === "auth-provider-auth0" ||
- answers["auth-provider"] === "auth-provider-google" ||
- answers["auth-provider"] === "auth-provider-keycloak" ||
- answers["auth-provider"] === "auth-provider-custom"
- ) {
- base._app.isCustomLoginPage = true;
- }
-
- // ## hasStrictMode
- if (answers["auth-provider"] === "auth-provider-keycloak") {
- base._app.hasStrictMode = false;
- }
- // ## hasStrictMode
-
- // ## authPageProps
- let defaultValuePropsName = "initialValues";
- let defaultValues = `email: "demo@refine.dev", password: "demodemo"`;
- // change supabase login credentials
- if (dataProvider === "data-provider-supabase") {
- defaultValues = `email: "info@refine.dev", password: "refine-supabase"`;
- }
-
- // mui || chakra
- if (uiFramework === "mui" || uiFramework === "chakra") {
- defaultValuePropsName = "defaultValues";
- }
-
- base._app.authPageProps = [
- `formProps={{ ${defaultValuePropsName}:{ ${defaultValues} } }}`,
- ];
-
- // update for headless
- if (uiFramework === "no") {
- base._app.authPageProps = [
- `
- renderContent={(content) => (
-
-
- ${defaultValues
- .replace(/"/g, "")
- .replace(/,/g, "
")}
-
- {content}
-
- {breadcrumbs.map((breadcrumb) => {
- return (
- -
- {breadcrumb.href ? (
- {breadcrumb.label}
- ) : (
- {breadcrumb.label}
- )}
-
- );
- })}
-
- );
-};
diff --git a/refine-react/plugins/_base/src/components/layout/index.tsx b/refine-react/plugins/_base/src/components/layout/index.tsx
deleted file mode 100644
index a0d73d763..000000000
--- a/refine-react/plugins/_base/src/components/layout/index.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import { PropsWithChildren } from "react";
-import { Breadcrumb } from "../breadcrumb";
-import { Menu } from "../menu";
-
-export const Layout: React.FC = ({ children }) => {
- return (
-
- );
-};
diff --git a/refine-react/plugins/_base/src/components/menu/index.tsx b/refine-react/plugins/_base/src/components/menu/index.tsx
deleted file mode 100644
index 174fe7ebc..000000000
--- a/refine-react/plugins/_base/src/components/menu/index.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import {
- <%_ if (_app.isAuthRoutes) { _%>
- useLogout,
- <%_ } _%>
- useMenu
-} from "@refinedev/core";
-import { NavLink } from "react-router-dom";
-
-export const Menu = () => {
- <%_ if (_app.isAuthRoutes) { _%>
- const { mutate: logout } = useLogout();
- <%_ } _%>
- const { menuItems } = useMenu();
-
- return (
-
- );
-};
diff --git a/refine-react/plugins/antd/extend.js b/refine-react/plugins/antd/extend.js
deleted file mode 100644
index 20fec102e..000000000
--- a/refine-react/plugins/antd/extend.js
+++ /dev/null
@@ -1,22 +0,0 @@
-const base = {
- _app: {
- import: [`import { App as AntdApp } from "antd"`],
- refineImports: [],
- refineAntdImports: ["useNotificationProvider", "ThemedLayoutV2"],
- refineProps: ["notificationProvider={useNotificationProvider}"],
- wrapper: [
- [``, ``],
- [``, ``],
- ],
- localImport: [
- `import { ColorModeContextProvider } from "./contexts/color-mode";`,
- `import { Header } from "./components/header";`,
- ],
- },
-};
-
-module.exports = {
- extend() {
- return base;
- },
-};
diff --git a/refine-react/plugins/antd/meta.json b/refine-react/plugins/antd/meta.json
deleted file mode 100644
index cf09020d0..000000000
--- a/refine-react/plugins/antd/meta.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "name": "Ant Design",
- "url": "https://refine.dev/docs/ui-frameworks/antd/tutorial/"
-}
diff --git a/refine-react/plugins/antd/package.json b/refine-react/plugins/antd/package.json
deleted file mode 100644
index a490611f5..000000000
--- a/refine-react/plugins/antd/package.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
- "dependencies": {
- "@refinedev/antd": "^5.37.1",
- "antd": "^5.0.5",
- "@ant-design/icons": "^5.0.1"
- }
-}
diff --git a/refine-react/plugins/antd/src/components/header/index.tsx b/refine-react/plugins/antd/src/components/header/index.tsx
deleted file mode 100644
index 6ce06add5..000000000
--- a/refine-react/plugins/antd/src/components/header/index.tsx
+++ /dev/null
@@ -1,65 +0,0 @@
-import type { RefineThemedLayoutV2HeaderProps } from "@refinedev/antd";
-import { useGetIdentity } from "@refinedev/core";
-import {
- Avatar,
- Layout as AntdLayout,
- Space,
- Switch,
- theme,
- Typography,
-} from "antd";
-import React, { useContext } from "react";
-import { ColorModeContext } from "../../contexts/color-mode";
-
-const { Text } = Typography;
-const { useToken } = theme;
-
-type IUser = {
- id: number;
- name: string;
- avatar: string;
-};
-
-export const Header: React.FC = ({
- isSticky,
-}) => {
- const { token } = useToken();
- const { data: user } = useGetIdentity();
- const { mode, setMode } = useContext(ColorModeContext);
-
- const headerStyles: React.CSSProperties = {
- backgroundColor: token.colorBgElevated,
- display: "flex",
- justifyContent: "flex-end",
- alignItems: "center",
- padding: "0px 24px",
- height: "64px",
- };
-
- if (isSticky) {
- headerStyles.position = "sticky";
- headerStyles.top = 0;
- headerStyles.zIndex = 1;
- }
-
- return (
-
-
-
- setMode(mode === "light" ? "dark" : "light")
- }
- defaultChecked={mode === "dark"}
- />
-
- {user?.name && {user.name}}
- {user?.avatar && (
-
- )}
-
-
-
- );
-};
diff --git a/refine-react/plugins/antd/src/components/index.ts b/refine-react/plugins/antd/src/components/index.ts
deleted file mode 100644
index 924cc88d1..000000000
--- a/refine-react/plugins/antd/src/components/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { Header } from "./header";
diff --git a/refine-react/plugins/antd/src/contexts/color-mode/index.tsx b/refine-react/plugins/antd/src/contexts/color-mode/index.tsx
deleted file mode 100644
index a87c318b1..000000000
--- a/refine-react/plugins/antd/src/contexts/color-mode/index.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import { PropsWithChildren, createContext, useEffect, useState } from "react";
-import { ConfigProvider, theme } from "antd";
-import { RefineThemes } from "@refinedev/antd";
-
-type ColorModeContextType = {
- mode: string;
- setMode: (mode: string) => void;
-};
-
-export const ColorModeContext = createContext(
- {} as ColorModeContextType,
-);
-
-export const ColorModeContextProvider: React.FC = ({
- children,
-}) => {
- const colorModeFromLocalStorage = localStorage.getItem("colorMode");
- const isSystemPreferenceDark = window?.matchMedia(
- "(prefers-color-scheme: dark)",
- ).matches;
-
- const systemPreference = isSystemPreferenceDark ? "dark" : "light";
- const [mode, setMode] = useState(
- colorModeFromLocalStorage || systemPreference,
- );
-
- useEffect(() => {
- window.localStorage.setItem("colorMode", mode);
- }, [mode]);
-
- const setColorMode = () => {
- if (mode === "light") {
- setMode("dark");
- } else {
- setMode("light");
- }
- };
-
- const { darkAlgorithm, defaultAlgorithm } = theme;
-
- return (
-
- ,
- algorithm:
- mode === "light" ? defaultAlgorithm : darkAlgorithm,
- }}
- >
- {children}
-
-
- );
-};
diff --git a/refine-react/plugins/auth-provider-auth0/extend.js b/refine-react/plugins/auth-provider-auth0/extend.js
deleted file mode 100644
index 6444e4b28..000000000
--- a/refine-react/plugins/auth-provider-auth0/extend.js
+++ /dev/null
@@ -1,96 +0,0 @@
-const base = {
- _app: {
- refineImports: [`Authenticated`, `AuthBindings`],
- import: [
- `import axios from "axios";`,
- `import { useAuth0 } from "@auth0/auth0-react";`,
- ],
- localImport: [`import { Login } from "pages/login";`],
- innerHooks: [
- `const { isLoading, user, logout, getIdTokenClaims } = useAuth0();`,
- ],
- inner: [
- `
- if (isLoading) {
- return loading...
- }`,
- `
- const authProvider: AuthBindings = {
- login: async () => {
- return {
- success: true,
- };
- },
- logout: async () => {
- logout({ returnTo: window.location.origin });
- return {
- success: true,
- };
- },
- onError: async (error) => {
- console.error(error);
- return { error };
- },
- check: async () => {
- try {
- const token = await getIdTokenClaims();
- if (token) {
- axios.defaults.headers.common = {`,
- "Authorization: `Bearer ${token.__raw}`",
- `
- };
- return {
- authenticated: true,
- };
- } else {
- return {
- authenticated: false,
- error: {
- message: "Check failed",
- name: "Token not found",
- },
- redirectTo: "/login",
- logout: true,
- };
- }
- } catch (error: any) {
- return {
- authenticated: false,
- error: new Error(error),
- redirectTo: "/login",
- logout: true,
- };
- }
- },
- getPermissions: async () => null,
- getIdentity: async () => {
- if (user) {
- return {
- ...user,
- avatar: user.picture,
- };
- }
- return null;
- },
- };
- `,
- ],
- refineProps: ["authProvider={authProvider}"],
- mainWrapper: [
- [
- ``,
- ``,
- ],
- ],
- },
-};
-
-module.exports = {
- extend(answers) {
- return base;
- },
-};
diff --git a/refine-react/plugins/auth-provider-auth0/meta.json b/refine-react/plugins/auth-provider-auth0/meta.json
deleted file mode 100644
index 5b8a4f236..000000000
--- a/refine-react/plugins/auth-provider-auth0/meta.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "name": "Auth0 Auth Providder",
- "url": "https://refine.dev/docs/guides-and-concepts/auth/auth0/"
-}
diff --git a/refine-react/plugins/auth-provider-auth0/package.json b/refine-react/plugins/auth-provider-auth0/package.json
deleted file mode 100644
index 111f42a19..000000000
--- a/refine-react/plugins/auth-provider-auth0/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
- "dependencies": {
- "@auth0/auth0-react": "^1.5.0",
- "axios": "^1.6.2"
- }
-}
\ No newline at end of file
diff --git a/refine-react/plugins/auth-provider-auth0/public/refine.svg b/refine-react/plugins/auth-provider-auth0/public/refine.svg
deleted file mode 100644
index 2eb16e9ed..000000000
--- a/refine-react/plugins/auth-provider-auth0/public/refine.svg
+++ /dev/null
@@ -1,10 +0,0 @@
-
\ No newline at end of file
diff --git a/refine-react/plugins/auth-provider-auth0/src/pages/login.tsx b/refine-react/plugins/auth-provider-auth0/src/pages/login.tsx
deleted file mode 100644
index b66d151df..000000000
--- a/refine-react/plugins/auth-provider-auth0/src/pages/login.tsx
+++ /dev/null
@@ -1,265 +0,0 @@
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { useTranslate } from "@refinedev/core";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === "antd") { _%>
-import { ThemedTitleV2 } from "@refinedev/antd";
-import { Button, Typography, Layout, Space } from "antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
-import Box from "@mui/material/Box";
-import Button from "@mui/material/Button";
-import Container from "@mui/material/Container";
-import Typography from "@mui/material/Typography";
-import { ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-
-import { useAuth0 } from "@auth0/auth0-react";
-
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "components/app-icon";
-<%_ } _%>
-
-export const Login: React.FC = () => {
- const { loginWithRedirect } = useAuth0();
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const t = useTranslate();
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "antd") { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
- Powered by
-
- Auth0
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mui') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
- Powered by
-
- Auth0
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
- Powered by
-
- Auth0
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Auth0
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return(
-
-
-
- Powered by
-
- Auth0
-
-
-
-
- Powered by
-
- Google
-
-
Loading...
;
- }
- `,
- `
- const authProvider: AuthBindings = {
- login: async () => {
- const urlSearchParams = new URLSearchParams(window.location.search);
- const { to } = Object.fromEntries(urlSearchParams.entries());
- await keycloak.login({`,
- "redirectUri: to ? `${ window.location.origin }${ to }` : undefined",
- `});
- return {
- success: true,
- };
- },
- logout: async () => {
- try {
- await keycloak.logout({
- redirectUri: window.location.origin,
- });
- return {
- success: true,
- redirectTo: "/login",
- };
- } catch (error) {
- return {
- success: false,
- error: new Error("Logout failed"),
- };
- }
- },
- onError: async (error) => {
- console.error(error);
- return { error };
- },
- check: async () => {
- try {
- const { token } = keycloak;
- if (token) {
- axios.defaults.headers.common = {`,
- "Authorization: `Bearer ${ token }`",
- `};
- return {
- authenticated: true,
- };
- } else {
- return {
- authenticated: false,
- logout: true,
- redirectTo: "/login",
- error: {
- message: "Check failed",
- name: "Token not found",
- },
- };
- }
- } catch (error) {
- return {
- authenticated: false,
- logout: true,
- redirectTo: "/login",
- error: {
- message: "Check failed",
- name: "Token not found",
- },
- };
- }
- },
- getPermissions: async () => null,
- getIdentity: async () => {
- if (keycloak?.tokenParsed) {
- return {
- name: keycloak.tokenParsed.family_name,
- };
- }
- return null;
- },
- };
- `,
- ],
- refineProps: ["authProvider={authProvider}"],
- mainWrapper: [
- [
- ``,
- ``,
- ],
- ],
- },
-};
-
-module.exports = {
- extend() {
- return base;
- },
-};
diff --git a/refine-react/plugins/auth-provider-keycloak/meta.json b/refine-react/plugins/auth-provider-keycloak/meta.json
deleted file mode 100644
index 426641985..000000000
--- a/refine-react/plugins/auth-provider-keycloak/meta.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "name": "Keycloak Auth Providder",
- "url": "https://refine.dev/docs/guides-and-concepts/auth/auth0/"
-}
diff --git a/refine-react/plugins/auth-provider-keycloak/package.json b/refine-react/plugins/auth-provider-keycloak/package.json
deleted file mode 100644
index 5243b325b..000000000
--- a/refine-react/plugins/auth-provider-keycloak/package.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
- "dependencies": {
- "keycloak-js": "^20.0.3",
- "@react-keycloak/web": "^3.4.0",
- "axios": "^1.6.2"
- }
-}
\ No newline at end of file
diff --git a/refine-react/plugins/auth-provider-keycloak/public/refine.svg b/refine-react/plugins/auth-provider-keycloak/public/refine.svg
deleted file mode 100644
index 2eb16e9ed..000000000
--- a/refine-react/plugins/auth-provider-keycloak/public/refine.svg
+++ /dev/null
@@ -1,10 +0,0 @@
-
\ No newline at end of file
diff --git a/refine-react/plugins/auth-provider-keycloak/src/pages/login.tsx b/refine-react/plugins/auth-provider-keycloak/src/pages/login.tsx
deleted file mode 100644
index d7ae0e934..000000000
--- a/refine-react/plugins/auth-provider-keycloak/src/pages/login.tsx
+++ /dev/null
@@ -1,260 +0,0 @@
-import { useTranslate, useLogin } from "@refinedev/core";
-<%_ if (answers["ui-framework"] === "antd") { _%>
-import { ThemedTitleV2 } from "@refinedev/antd";
-import { Button, Typography, Layout, Space } from "antd";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
-import Box from "@mui/material/Box";
-import Button from "@mui/material/Button";
-import Container from "@mui/material/Container";
-import Typography from "@mui/material/Typography";
-import { ThemedTitleV2 } from "@refinedev/mui";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
-<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
-import { AppIcon } from "components/app-icon";
-<%_ } _%>
-
-export const Login: React.FC = () => {
- const { mutate: login } = useLogin();
-
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const t = useTranslate();
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "antd") { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
- Powered by
-
- Keycloak
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mui') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
- Powered by
-
- Keycloak
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
- Powered by
-
- Keycloak
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Keycloak
-
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === "no") { _%>
- return(
-
-
-
- Powered by
-
- Keycloak
-
-
-
-This [Refine](<%- refineGitUrl %>) project was generated with [create refine-app](<%- createRefineAppGitUrl %>).
-
-## Getting Started
-
-A React Framework for building internal tools, admin panels, dashboards & B2B apps with unmatched flexibility ✨
-
-Refine's hooks and components simplifies the development process and eliminates the repetitive tasks by providing industry-standard solutions for crucial aspects of a project, including authentication, access control, routing, networking, state management, and i18n.
-
-## Available Scripts
-
-### Running the development server.
-
-```bash
- <%= pmRun %> dev
-```
-
-### Building for production.
-
-```bash
- <%= pmRun %> build
-```
-
-### Running the production server.
-
-```bash
- <%= pmRun %> start
-```
-
-## Learn More
-
-To learn more about **Refine**, please check out the [Documentation](<%- refineDocsUrl %>)
-
-<% const list = pluginsData.filter((plugin) => plugin.url.length > 0) -%>
-<% for (var i = 0; i < list.length; i++ ) { -%>
-<% if (list[i].url.length > 0) { -%>
-- **<%= list[i].name -%>** [Docs](<%- list[i].url %>)
-<% } -%>
-<% } %>
-
-## License
-
-MIT
diff --git a/refine-react/template/_package.json b/refine-react/template/_package.json
deleted file mode 100644
index 09afa308a..000000000
--- a/refine-react/template/_package.json
+++ /dev/null
@@ -1,52 +0,0 @@
-{
- "name": "<%= name %>",
- "version": "0.1.0",
- "private": true,
- "dependencies": {
- "@refinedev/cli": "^2.16.21",
- "@refinedev/core": "^4.46.1",
- "@refinedev/devtools": "^1.1.29",
- "@refinedev/inferencer": "^4.5.16",
- "@refinedev/kbar": "^1.3.5",
- "react": "^18.0.0",
- "react-dom": "^18.0.0",
- "react-scripts": "^5.0.0",
- "react-router-dom": "^6.8.1"
- },
- "devDependencies": {
- "@types/react": "^18.0.0",
- "@types/react-dom": "^18.0.0",
- "@types/node": "^12.20.11",
- "typescript": "^4.7.4",
- "@testing-library/jest-dom": "^5.16.4",
- "@testing-library/react": "^13.1.1",
- "@testing-library/user-event": "^14.1.1",
- "@types/jest": "^29.2.4",
- "web-vitals": "^1.1.1"
- },
- "scripts": {
- "dev": "refine dev",
- "build": "refine build",
- "test": "react-scripts test",
- "eject": "react-scripts eject",
- "refine": "refine"
- },
- "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"
- ]
- <%_ if (typeof projectId !== 'undefined' && projectId !== '') { _%>
- },
- "refine": {
- "projectId": "<%= projectId %>"
- }
- <%_ } else { _%>
- }
- <%_ } _%>
-}
diff --git a/refine-react/template/_tsconfig.json b/refine-react/template/_tsconfig.json
deleted file mode 100644
index cfcf343e5..000000000
--- a/refine-react/template/_tsconfig.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
- "compilerOptions": {
- "target": "es5",
- "lib": [
- "dom",
- "dom.iterable",
- "esnext"
- ],
- "allowJs": true,
- "strict": true,
- "skipLibCheck": true,
- "esModuleInterop": true,
- "allowSyntheticDefaultImports": true,
- "forceConsistentCasingInFileNames": true,
- "noFallthroughCasesInSwitch": true,
- "module": "esnext",
- "moduleResolution": "node",
- "resolveJsonModule": true,
- "isolatedModules": true,
- "noEmit": true,
- "jsx": "react-jsx",
- "baseUrl": "src",
- "paths": {
- "*": ["./*"]
- }
- },
- "include": [
- "src"
- ]
-}
diff --git a/refine-react/template/gitignore b/refine-react/template/gitignore
deleted file mode 100644
index 24cdedf82..000000000
--- a/refine-react/template/gitignore
+++ /dev/null
@@ -1,23 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# production
-/build
-
-# misc
-.DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
\ No newline at end of file
diff --git a/refine-react/template/public/favicon.ico b/refine-react/template/public/favicon.ico
deleted file mode 100644
index 2f05c5f48..000000000
Binary files a/refine-react/template/public/favicon.ico and /dev/null differ
diff --git a/refine-react/template/public/index.html b/refine-react/template/public/index.html
deleted file mode 100644
index 131758dc3..000000000
--- a/refine-react/template/public/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- refine - Build your React-based CRUD applications, without constraints.
-
- <%- (_app.publicScripts || []).join("\n") _%>
-
-
-
-
-
-
diff --git a/refine-react/template/src/App.tsx b/refine-react/template/src/App.tsx
deleted file mode 100644
index 6196e4e68..000000000
--- a/refine-react/template/src/App.tsx
+++ /dev/null
@@ -1,273 +0,0 @@
-import {
- Refine,
- GitHubBanner,
- WelcomePage,
- <%- (_app.refineImports || []).join("\n,") _%>,
-} from '@refinedev/core';
-import { DevtoolsPanel, DevtoolsProvider } from "@refinedev/devtools";
-import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
-
-<%_ if (answers["ui-framework"] === 'antd') { _%>
-import { <%- (_app.refineAntdImports || []).join("\n,") _%> } from '@refinedev/antd';
-import "@refinedev/antd/dist/reset.css";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mui') { _%>
- import { <%- (_app.refineMuiImports || []).join("\n,") _%> } from '@refinedev/mui';
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { <%- (_app.refineMantineImports || []).join("\n,") _%> } from '@refinedev/mantine';
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { <%- (_app.refineChakraImports || []).join("\n,") _%> } from '@refinedev/chakra-ui';
-<%_ } _%>
-
-<%- (_app.import || []).join("\n") _%>
-
-<%- (_app.localImport || []).join("\n") _%>
-
-<%- (_app.relativeImport || []).join("\n") _%>
-
-<%- (_app.afterImport || []).join("\n") _%>
-
-<%
- var top = _app.wrapper.map(wrapper => wrapper[0] || "");
- var bottom = _app.wrapper.map(wrapper => wrapper[1] || "").reverse();
-%>
-
-
-function App() {
- <%- (_app.innerHooks || []).join("\n") %>
-
- <%- (_app.inner || []).join("\n") %>
-
- return (
-
-
-
- <%- top.join("\n") %>
-
-
- <%_ if (_app.hasRoutes === true) { _%>
- resources={[
- <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
- {
- name: "blog-posts",
- list: "/blog-posts",
- create: "/blog-posts/create",
- edit: "/blog-posts/edit/:id",
- show: "/blog-posts/show/:id",
- meta: {
- canDelete: true,
- },
- },
- <%_ } else { _%>
- {
- name: "blog_posts",
- list: "/blog-posts",
- create: "/blog-posts/create",
- edit: "/blog-posts/edit/:id",
- show: "/blog-posts/show/:id",
- meta: {
- canDelete: true,
- },
- },
- <%_ } _%>
- {
- name: "categories",
- list: "/categories",
- create: "/categories/create",
- edit: "/categories/edit/:id",
- show: "/categories/show/:id",
- meta: {
- canDelete: true,
- },
- },
- ]}
- <%_ } _%>
- options={{
- syncWithLocation: true,
- warnWhenUnsavedChanges: true,
- useNewQueryKeys: true,
- <%_ if (typeof projectId !== 'undefined' && projectId !== '') { _%>
- projectId: "<%= projectId %>",
- <%_ } _%>
- <%- (_app.refineOptions || []).join("\n") %>
- }}
- >
- <%_ if (_app.hasRoutes === true && _app.isAuthRoutes) { _%>
-
- }
- >
- <%_ if (answers["ui-framework"] === 'no') { _%>
-
-
-
- <%_ } else { _%>
- }
- <%_ if (selectedSvg || selectedTitle) { _%>
- Title={({ collapsed }) => (
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- >
-
-
- <%_ } _%>
-
- }
- >
-
-
- <%_ } else { _%>
-
- <%_ } _%>
- } />
-
- } />
- } />
- } />
- } />
-
-
- } />
- } />
- } />
- } />
-
- } />
-
- }>
-
-
- }
- >
- <%_ if (_app.isCustomLoginPage) { _%>
- } <%- (_app.loginPageProps || []).join("\n") %> />
- <%_ if (answers["auth-provider"] === 'auth-provider-custom') { _%>
- } />
- } />
- <%_ } _%>
- <%_ } else { _%>
-
- title={(
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- <%- (_app.authPageProps || []).join("\n") %>
- />
- )}
- />
- }
- />
- }
- />
- <%_ } _%>
-
-
- <%_ } _%>
-
- <%_ if (_app.hasRoutes === true && _app.isNoAuthRoutes) { _%>
-
-
-
-
-
- <%_ } else { _%>
- }
- <%_ if (selectedSvg || selectedTitle) { _%>
- Title={({ collapsed }) => (
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
- )}
- <%_ } _%>
- >
-
-
- <%_ } _%>
- )}
- >
-
-
- <%_ } else { _%>
-
- <%_ } _%>
- } />
-
- } />
- } />
- } />
- } />
-
-
- } />
- } />
- } />
- } />
-
- } />
-
-
- <%_ } _%>
-
- <%_ if (_app.hasRoutes === false) { _%>
-
- } />
-
- <%_ } _%>
-
-
-
-
-
-
- <%- bottom.join("\n") %>
-
-
- );
-};
-
-export default App;
diff --git a/refine-react/template/src/index.tsx b/refine-react/template/src/index.tsx
deleted file mode 100644
index a8b56924a..000000000
--- a/refine-react/template/src/index.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import React from "react";
-import { createRoot } from "react-dom/client";
-<%_ if (answers["auth-provider"] === "auth-provider-auth0") { _%>
-import { Auth0Provider } from "@auth0/auth0-react";
-<%_ } _%>
-
-<%_ if (answers["auth-provider"] === "auth-provider-keycloak") { _%>
-import Keycloak from "keycloak-js";
-import { ReactKeycloakProvider } from "@react-keycloak/web";
-<%_ } _%>
-
-
-import reportWebVitals from "./reportWebVitals";
-import App from "./App";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import "./i18n";
-<%_ } _%>
-
-<%_ if (answers["auth-provider"] === "auth-provider-keycloak") { _%>
-const keycloak = new Keycloak({
- clientId: "refine-demo",
- url: "https://lemur-0.cloud-iam.com/auth",
- realm: "refine",
-});
-<%_ } _%>
-
-const container = document.getElementById("root") as HTMLElement;
-const root = createRoot(container);
-
-<%
- var mainWrapper = _app.mainWrapper || [];
- var top = mainWrapper.map(wrapper => wrapper[0] || "");
- var bottom = mainWrapper.map(wrapper => wrapper[1] || "").reverse();
-%>
-
-
-root.render(
- <%_ if (_app.hasStrictMode === true) { _%>
-
- <%_ } _%>
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-
- <%_ } _%>
- <%- top.join("\n") %>
-
- <%- bottom.join("\n") %>
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-
- <%_ } _%>
- <%_ if (_app.hasStrictMode === true) { _%>
-
- <%_ } _%>
-);
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
diff --git a/refine-react/template/src/meta.json b/refine-react/template/src/meta.json
deleted file mode 100644
index b23a9005f..000000000
--- a/refine-react/template/src/meta.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "name": "<%= name %>",
- "plugins": []
-}
diff --git a/refine-react/template/src/react-app-env.d.ts b/refine-react/template/src/react-app-env.d.ts
deleted file mode 100644
index 6431bc5fc..000000000
--- a/refine-react/template/src/react-app-env.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-///
diff --git a/refine-react/template/src/reportWebVitals.ts b/refine-react/template/src/reportWebVitals.ts
deleted file mode 100644
index 49a2a16e0..000000000
--- a/refine-react/template/src/reportWebVitals.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { ReportHandler } from 'web-vitals';
-
-const reportWebVitals = (onPerfEntry?: ReportHandler) => {
- if (onPerfEntry && onPerfEntry instanceof Function) {
- import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
- getCLS(onPerfEntry);
- getFID(onPerfEntry);
- getFCP(onPerfEntry);
- getLCP(onPerfEntry);
- getTTFB(onPerfEntry);
- });
- }
-};
-
-export default reportWebVitals;
diff --git a/refine-react/template/src/setupTests.ts b/refine-react/template/src/setupTests.ts
deleted file mode 100644
index 8f2609b7b..000000000
--- a/refine-react/template/src/setupTests.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// jest-dom adds custom jest matchers for asserting on DOM nodes.
-// allows you to do things like:
-// expect(element).toHaveTextContent(/react/i)
-// learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom';
diff --git a/refine-remix/plugins/_base/extend.js b/refine-remix/plugins/_base/extend.js
index ab8d1f6bc..49d0e8354 100644
--- a/refine-remix/plugins/_base/extend.js
+++ b/refine-remix/plugins/_base/extend.js
@@ -2,18 +2,23 @@ const base = {
_app: {
isNextAuthCheck: false,
isAuthProviderCheck: false,
+ hasRoutes: true,
loader: [],
authPageProps: [],
localImport: [],
refineAntdImports: [],
- refineChakraImports: [],
refineMuiImports: [],
- refineMantineImports: [],
styleImport: [],
},
selectedTheme: "Blue",
selectedTitle: undefined,
selectedSvg: undefined,
+ isGraphQL: false,
+ blogPostCategoryFieldName: "category",
+ blogPostCategoryTableField: `"category"`,
+ blogPostCategoryIdFormField: `["category", "id"]`,
+ blogPostStatusOptions: [],
+ blogPostStatusDefaultValue: `"draft"`,
};
module.exports = {
@@ -51,8 +56,8 @@ module.exports = {
defaultValues = `email: "info@refine.dev", password: "refine-supabase"`;
}
- // mui || chakra
- if (uiFramework === "mui" || uiFramework === "chakra") {
+ // mui
+ if (uiFramework === "mui") {
defaultValuePropsName = "defaultValues";
}
@@ -85,7 +90,15 @@ module.exports = {
`,
];
}
- // ## authPageProps
+
+ // ## hasRoutes
+ if (
+ ["headless-example", "antd-example", "mui-example"].every(
+ (item) => answers[item] === "no",
+ )
+ ) {
+ base._app.hasRoutes = false;
+ }
// ## selected theme
const themeFromAnswers = answers["theme"];
@@ -110,15 +123,9 @@ module.exports = {
if (answers["ui-framework"] === "antd") {
base._app.refineAntdImports.push("ThemedTitleV2");
}
- if (answers["ui-framework"] === "mantine") {
- base._app.refineMantineImports.push("ThemedTitleV2");
- }
if (answers["ui-framework"] === "mui") {
base._app.refineMuiImports.push("ThemedTitleV2");
}
- if (answers["ui-framework"] === "chakra") {
- base._app.refineChakraImports.push("ThemedTitleV2");
- }
}
if (
@@ -135,6 +142,81 @@ module.exports = {
base._app.styleImport.push('{ rel: "stylesheet", href: styles }');
}
+ // ## isGraphQL
+ if (
+ ["data-provider-hasura", "data-provider-nestjs-query"].includes(
+ dataProvider,
+ )
+ ) {
+ base.isGraphQL = true;
+ }
+
+ // ## blogPostCategoryFieldName
+ if (dataProvider === "data-provider-supabase") {
+ base.blogPostCategoryFieldName = "categories";
+ } else {
+ base.blogPostCategoryFieldName = "category";
+ }
+
+ // ## blogPostCategoryIdFormField
+ if (dataProvider === "data-provider-hasura") {
+ base.blogPostCategoryIdFormField = `"category_id"`;
+ } else if (dataProvider === "data-provider-nestjs-query") {
+ base.blogPostCategoryIdFormField = `"categoryId"`;
+ } else if (dataProvider === "data-provider-supabase") {
+ base.blogPostCategoryIdFormField = `"categoryId"`;
+ } else {
+ if (uiFramework === "mui" || uiFramework === "no") {
+ base.blogPostCategoryIdFormField = `"category.id"`;
+ } else {
+ base.blogPostCategoryIdFormField = `["category", "id"]`;
+ }
+ }
+
+ // ## blogPostCategoryTableField
+ if (base.isGraphQL) {
+ if (uiFramework === "no") {
+ base.blogPostCategoryTableField = `"category.title"`;
+ }
+ if (uiFramework === "antd") {
+ base.blogPostCategoryTableField = `['category', 'title']`;
+ }
+ if (uiFramework === "mui") {
+ base.blogPostCategoryTableField = `"category"`;
+ }
+ } else {
+ if (dataProvider === "data-provider-supabase") {
+ base.blogPostCategoryTableField = `"categories"`;
+ } else {
+ base.blogPostCategoryTableField = `"category"`;
+ }
+ }
+
+ // ## blogPostStatusOptions
+ if (dataProvider === "data-provider-nestjs-query") {
+ base.blogPostStatusOptions = JSON.stringify([
+ { value: "DRAFT", label: "Draft" },
+ { value: "PUBLISHED", label: "Published" },
+ { value: "REJECTED", label: "Rejected" },
+ ]);
+ } else {
+ base.blogPostStatusOptions = JSON.stringify([
+ { value: "draft", label: "Draft" },
+ { value: "published", label: "Published" },
+ { value: "rejected", label: "Rejected" },
+ ]);
+ }
+ if (uiFramework === "no" || uiFramework === "mui") {
+ base.blogPostStatusOptions = JSON.parse(base.blogPostStatusOptions);
+ }
+
+ // ## blogPostStatusDefaultValue
+ if (dataProvider === "data-provider-nestjs-query") {
+ base.blogPostStatusDefaultValue = `"DRAFT"`;
+ } else {
+ base.blogPostStatusDefaultValue = `"draft"`;
+ }
+
return base;
},
};
diff --git a/refine-remix/plugins/inferencer-headless/app/routes/_index.tsx b/refine-remix/plugins/antd-example/app/routes/_index.tsx
similarity index 100%
rename from refine-remix/plugins/inferencer-headless/app/routes/_index.tsx
rename to refine-remix/plugins/antd-example/app/routes/_index.tsx
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.$.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.$.tsx
new file mode 100644
index 000000000..1549b00cc
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.$.tsx
@@ -0,0 +1,8 @@
+import { ErrorComponent } from "@refinedev/antd";
+
+/**
+ * We're using a splat route to catch all routes that don't match any other route and render the `ErrorComponent` as 404 page.
+ */
+export default function Index() {
+ return ;
+}
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts._index.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts._index.tsx
new file mode 100644
index 000000000..316f2805f
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts._index.tsx
@@ -0,0 +1,119 @@
+import {
+ DateField,
+ DeleteButton,
+ EditButton,
+ List,
+ MarkdownField,
+ ShowButton,
+ useTable,
+} from "@refinedev/antd";
+import { BaseRecord, IResourceComponentsProps, useMany } from "@refinedev/core";
+import { Space, Table } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+import { BLOG_POSTS_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POSTS_LIST_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+export default function BlogPostList() {
+ const { tableProps } = useTable({
+ syncWithLocation: true,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: POSTS_LIST_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData, isLoading: categoryIsLoading } = useMany({
+ resource: "categories",
+ ids: tableProps?.dataSource?.map((item) => item?.<%- blogPostCategoryFieldName %>?.id).filter(Boolean) ?? [],
+ queryOptions: {
+ enabled: !!tableProps?.dataSource,
+ },
+ });
+<%_ } _%>
+
+ return (
+
+
+
+
+ {
+ if (!value) return '-'
+ return
+ }}
+ />
+ }
+ title={"Category"}
+ <%_ if (!isGraphQL) { _%>
+ render={(value) =>
+ categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ categoryData?.data?.find(
+ (item) => item.id === value?.id,
+ )?.title
+ )
+ }
+ <%_ } _%>
+ />
+
+
+ dataIndex={["created_at"]}
+<%_ } else { _%>
+ dataIndex={["createdAt"]}
+<%_ } _%>
+ title={"Created at"}
+ render={(value: any) => }
+ />
+ (
+
+
+
+
+
+ )}
+ />
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.create.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.create.tsx
new file mode 100644
index 000000000..5f5f419da
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.create.tsx
@@ -0,0 +1,95 @@
+import { Create, useForm, useSelect } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Form, Input, Select } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_CREATE_MUTATION, CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+export default function BlogPostCreate() {
+ const { formProps, saveButtonProps } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: POST_CREATE_MUTATION,
+ },
+<%_ } _%>
+ });
+
+ const { selectProps: categorySelectProps } = useSelect({
+ resource: "categories",
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.edit.$id.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.edit.$id.tsx
new file mode 100644
index 000000000..af174a024
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.edit.$id.tsx
@@ -0,0 +1,108 @@
+import { Edit, useForm, useSelect } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Form, Input, Select } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_EDIT_MUTATION, CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+export default function BlogPostEdit() {
+ const { formProps, saveButtonProps, queryResult } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: POST_EDIT_MUTATION,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+
+ const blogPostsData = queryResult?.data?.data;
+
+ const { selectProps: categorySelectProps } = useSelect({
+ resource: "categories",
+ defaultValue: blogPostsData?.<%- blogPostCategoryFieldName %>?.id,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.show.$id.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.show.$id.tsx
new file mode 100644
index 000000000..6556a22e5
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.blog-posts.show.$id.tsx
@@ -0,0 +1,81 @@
+import {
+ DateField,
+ MarkdownField,
+ NumberField,
+ Show,
+ TextField,
+} from "@refinedev/antd";
+import { IResourceComponentsProps, useOne, useShow } from "@refinedev/core";
+import { Typography } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_SHOW_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+const { Title } = Typography;
+
+export default function BlogPostShow() {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: POST_SHOW_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData, isLoading: categoryIsLoading } = useOne({
+ resource: "categories",
+ id: record?.<%- blogPostCategoryFieldName %>?.id || "",
+ queryOptions: {
+ enabled: !!record,
+ },
+ });
+<%_ } _%>
+
+ return (
+
+ {"ID"}
+
+ {"Title"}
+
+ {"Content"}
+
+ {"Category"}
+<%_ if (isGraphQL) { _%>
+ ?.title} />
+<%_ } else { _%>
+ Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )} />
+<%_ } _%>
+ {"Status"}
+
+ {"CreatedAt"}
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.categories._index.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.categories._index.tsx
new file mode 100644
index 000000000..09bfdc119
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.categories._index.tsx
@@ -0,0 +1,64 @@
+import {
+ DeleteButton,
+ EditButton,
+ List,
+ ShowButton,
+ useTable,
+} from "@refinedev/antd";
+import { BaseRecord, IResourceComponentsProps } from "@refinedev/core";
+import { Space, Table } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORIES_LIST_QUERY } from "../queries/categories";
+<%_ } _%>
+
+export default function CategoryList() {
+ const { tableProps } = useTable({
+ syncWithLocation: true,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+ (
+
+
+
+
+
+ )}
+ />
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.categories.create.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.categories.create.tsx
new file mode 100644
index 000000000..ca0335602
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.categories.create.tsx
@@ -0,0 +1,43 @@
+import { Create, useForm } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Form, Input } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_CREATE_MUTATION } from "../queries/categories";
+<%_ } _%>
+
+export default function CategoryCreate() {
+ const { formProps, saveButtonProps } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: CATEGORY_CREATE_MUTATION,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.categories.edit.$id.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.categories.edit.$id.tsx
new file mode 100644
index 000000000..e057e5456
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.categories.edit.$id.tsx
@@ -0,0 +1,43 @@
+import { Edit, useForm } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Form, Input } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_EDIT_MUTATION } from "../queries/categories";
+<%_ } _%>
+
+export default function CategoryEdit() {
+ const { formProps, saveButtonProps } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: CATEGORY_EDIT_MUTATION,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.categories.show.$id.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.categories.show.$id.tsx
new file mode 100644
index 000000000..9fc3f538d
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.categories.show.$id.tsx
@@ -0,0 +1,39 @@
+import { NumberField, Show, TextField } from "@refinedev/antd";
+import { IResourceComponentsProps, useShow } from "@refinedev/core";
+import { Typography } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_SHOW_QUERY } from "../queries/categories";
+<%_ } _%>
+
+const { Title } = Typography;
+
+export default function CategoryShow() {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORY_SHOW_QUERY,
+ },
+<%_ } _%>
+ });
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+ return (
+
+ {"ID"}
+
+ {"Title"}
+
+
+ );
+};
diff --git a/refine-remix/plugins/antd-example/app/routes/_layout.tsx b/refine-remix/plugins/antd-example/app/routes/_layout.tsx
new file mode 100644
index 000000000..10eff07eb
--- /dev/null
+++ b/refine-remix/plugins/antd-example/app/routes/_layout.tsx
@@ -0,0 +1,80 @@
+import { ThemedLayoutV2, ThemedSiderV2, ThemedTitleV2 } from "@refinedev/antd";
+import { Outlet } from "@remix-run/react";
+import { Header } from "~/components/header";
+<%_ if (_app.isAuthProviderCheck) { _%>
+ import type { LoaderArgs } from "@remix-run/node";
+ import { redirect } from "@remix-run/node";
+ import { authProvider } from "~/authProvider";
+<%_ } _%>
+
+<%_ if (_app.isNextAuthCheck) { _%>
+ import type { LoaderArgs } from "@remix-run/node";
+ import { redirect } from "@remix-run/node";
+ import { authenticator } from "~/utils/auth.server";
+<%_ } _%>
+
+export default function BaseLayout() {
+ return (
+ }
+ Sider={(props) => }
+ <%_ if (selectedSvg || selectedTitle) { _%>
+ Title={({ collapsed }) => (
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+ )}
+ <%_ } _%>
+ >
+
+
+ );
+}
+
+
+<%_ if (_app.isAuthProviderCheck) { _%>
+ /**
+ * We're checking if the current session is authenticated.
+ * If not, we're redirecting the user to the login page.
+ * This is applied for all routes that are nested under this layout (_protected).
+ */
+ export async function loader({ request }: LoaderArgs) {
+ const { authenticated, redirectTo } = await authProvider.check(request);
+
+ if (!authenticated) {
+ throw redirect(redirectTo ?? "/login");
+ }
+
+ return {};
+ }
+<%_ } _%>
+
+<%_ if (_app.isNextAuthCheck) { _%>
+/**
+ * We're checking if the current session is authenticated.
+ * If not, we're redirecting the user to the login page.
+ * This is applied for all routes that are nested under this layout (_protected).
+ */
+export const loader = async ({ request }: LoaderArgs) => {
+ const session = await authenticator.isAuthenticated(request);
+ const pathname = new URL(request.url).pathname;
+
+ let to = ``;
+ // ignore only `/` routes
+ if (pathname !== "/") {
+ to = `?to=${pathname}`;
+ }
+
+ if (!session) {
+ return redirect(`/login${to}`);
+ }
+
+ return {};
+};
+<%_ } _%>
\ No newline at end of file
diff --git a/refine-remix/plugins/antd/package.json b/refine-remix/plugins/antd/package.json
index a490611f5..167139382 100644
--- a/refine-remix/plugins/antd/package.json
+++ b/refine-remix/plugins/antd/package.json
@@ -1,7 +1,7 @@
{
- "dependencies": {
- "@refinedev/antd": "^5.37.1",
- "antd": "^5.0.5",
- "@ant-design/icons": "^5.0.1"
- }
+ "dependencies": {
+ "@refinedev/antd": "^5.37.4",
+ "antd": "^5.0.5",
+ "@ant-design/icons": "^5.0.1"
+ }
}
diff --git a/refine-remix/plugins/auth-provider-auth0/app/routes/_auth.login.tsx b/refine-remix/plugins/auth-provider-auth0/app/routes/_auth.login.tsx
index 833187558..d19d2ad08 100644
--- a/refine-remix/plugins/auth-provider-auth0/app/routes/_auth.login.tsx
+++ b/refine-remix/plugins/auth-provider-auth0/app/routes/_auth.login.tsx
@@ -9,14 +9,6 @@ import Container from "@mui/material/Container";
import Typography from "@mui/material/Typography";
import { ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
import { AppIcon } from "@components/app-icon";
<%_ } _%>
@@ -124,105 +116,6 @@ export default function Login() {
);
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
-
- Powered by
-
- Auth0
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Auth0
-
-
-
- );
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "no") { _%>
return(
} from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
- <%_ } _%>
import { Header } from "@components/header";
import { authenticator } from "~/utils/auth.server";
@@ -100,3 +84,5 @@ export const loader = async ({ request }: LoaderArgs) => {
return {};
};
+
+
diff --git a/refine-remix/plugins/auth-provider-auth0/extend.js b/refine-remix/plugins/auth-provider-auth0/extend.js
index fca7cc35f..19e7181d5 100644
--- a/refine-remix/plugins/auth-provider-auth0/extend.js
+++ b/refine-remix/plugins/auth-provider-auth0/extend.js
@@ -3,20 +3,18 @@ const base = {
localImport: [
`import type { LoaderArgs } from "@remix-run/node";`,
`import { json } from "@remix-run/node";`,
- `import { authenticator } from "~/utils/auth.server";`
+ `import { authenticator } from "~/utils/auth.server";`,
],
refineProps: ["authProvider={authProvider}"],
refineImports: [`AuthBindings`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
- refineChakraImports: [],
loader: [
`export const loader = async ({ request }: LoaderArgs) => {
const profile = await authenticator.isAuthenticated(request);
const to = new URL(request.url).searchParams.get("to");
return json({ profile, to });
- };`
+ };`,
],
inner: [
`
@@ -62,8 +60,8 @@ const base = {
return null;
},
- };`
- ]
+ };`,
+ ],
},
};
diff --git a/refine-remix/plugins/auth-provider-custom/app/routes/_auth.forgot-password.tsx b/refine-remix/plugins/auth-provider-custom/app/routes/_auth.forgot-password.tsx
index fb6a06eea..6af6b6187 100644
--- a/refine-remix/plugins/auth-provider-custom/app/routes/_auth.forgot-password.tsx
+++ b/refine-remix/plugins/auth-provider-custom/app/routes/_auth.forgot-password.tsx
@@ -14,22 +14,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/auth-provider-custom/app/routes/_auth.login.tsx b/refine-remix/plugins/auth-provider-custom/app/routes/_auth.login.tsx
index 9e329dff8..79a1fa3da 100644
--- a/refine-remix/plugins/auth-provider-custom/app/routes/_auth.login.tsx
+++ b/refine-remix/plugins/auth-provider-custom/app/routes/_auth.login.tsx
@@ -14,22 +14,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/auth-provider-custom/app/routes/_auth.register.tsx b/refine-remix/plugins/auth-provider-custom/app/routes/_auth.register.tsx
index ec014083c..1c93809e1 100644
--- a/refine-remix/plugins/auth-provider-custom/app/routes/_auth.register.tsx
+++ b/refine-remix/plugins/auth-provider-custom/app/routes/_auth.register.tsx
@@ -14,22 +14,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/auth-provider-custom/app/routes/_layout.tsx b/refine-remix/plugins/auth-provider-custom/app/routes/_layout.tsx
index 60a404d51..d9cecc2be 100644
--- a/refine-remix/plugins/auth-provider-custom/app/routes/_layout.tsx
+++ b/refine-remix/plugins/auth-provider-custom/app/routes/_layout.tsx
@@ -18,22 +18,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
- <%_ } _%>
import { Header } from "@components/header";
import { authProvider } from "~/authProvider";
diff --git a/refine-remix/plugins/auth-provider-custom/extend.js b/refine-remix/plugins/auth-provider-custom/extend.js
index 2fbab86e9..ecb37cfee 100644
--- a/refine-remix/plugins/auth-provider-custom/extend.js
+++ b/refine-remix/plugins/auth-provider-custom/extend.js
@@ -3,9 +3,7 @@ const base = {
localImport: ['import { authProvider } from "~/authProvider";'],
refineProps: ["authProvider={authProvider}"],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
- refineChakraImports: [],
},
};
diff --git a/refine-remix/plugins/auth-provider-google/app/routes/_auth.login.tsx b/refine-remix/plugins/auth-provider-google/app/routes/_auth.login.tsx
index aaa6be50e..1a50e1b54 100644
--- a/refine-remix/plugins/auth-provider-google/app/routes/_auth.login.tsx
+++ b/refine-remix/plugins/auth-provider-google/app/routes/_auth.login.tsx
@@ -9,14 +9,6 @@ import Container from "@mui/material/Container";
import Typography from "@mui/material/Typography";
import { ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
import { AppIcon } from "@components/app-icon";
<%_ } _%>
@@ -123,105 +115,6 @@ export default function Login() {
);
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
-
- Powered by
-
- Google
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Google
-
-
-
- );
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "no") { _%>
return(
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
import { Header } from "@components/header";
import { authenticator } from "~/utils/auth.server";
diff --git a/refine-remix/plugins/auth-provider-google/extend.js b/refine-remix/plugins/auth-provider-google/extend.js
index fca7cc35f..19e7181d5 100644
--- a/refine-remix/plugins/auth-provider-google/extend.js
+++ b/refine-remix/plugins/auth-provider-google/extend.js
@@ -3,20 +3,18 @@ const base = {
localImport: [
`import type { LoaderArgs } from "@remix-run/node";`,
`import { json } from "@remix-run/node";`,
- `import { authenticator } from "~/utils/auth.server";`
+ `import { authenticator } from "~/utils/auth.server";`,
],
refineProps: ["authProvider={authProvider}"],
refineImports: [`AuthBindings`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
- refineChakraImports: [],
loader: [
`export const loader = async ({ request }: LoaderArgs) => {
const profile = await authenticator.isAuthenticated(request);
const to = new URL(request.url).searchParams.get("to");
return json({ profile, to });
- };`
+ };`,
],
inner: [
`
@@ -62,8 +60,8 @@ const base = {
return null;
},
- };`
- ]
+ };`,
+ ],
},
};
diff --git a/refine-remix/plugins/auth-provider-keycloak/app/routes/_auth.login.tsx b/refine-remix/plugins/auth-provider-keycloak/app/routes/_auth.login.tsx
index 7d6f32244..0534d668b 100644
--- a/refine-remix/plugins/auth-provider-keycloak/app/routes/_auth.login.tsx
+++ b/refine-remix/plugins/auth-provider-keycloak/app/routes/_auth.login.tsx
@@ -9,14 +9,6 @@ import Container from "@mui/material/Container";
import Typography from "@mui/material/Typography";
import { ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
import { AppIcon } from "@components/app-icon";
<%_ } _%>
@@ -124,105 +116,6 @@ export default function Login() {
);
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
-
- Powered by
-
- Keycloak
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Keycloak
-
-
-
- );
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "no") { _%>
return(
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
import { Header } from "@components/header";
import { authenticator } from "~/utils/auth.server";
diff --git a/refine-remix/plugins/auth-provider-keycloak/extend.js b/refine-remix/plugins/auth-provider-keycloak/extend.js
index fca7cc35f..19e7181d5 100644
--- a/refine-remix/plugins/auth-provider-keycloak/extend.js
+++ b/refine-remix/plugins/auth-provider-keycloak/extend.js
@@ -3,20 +3,18 @@ const base = {
localImport: [
`import type { LoaderArgs } from "@remix-run/node";`,
`import { json } from "@remix-run/node";`,
- `import { authenticator } from "~/utils/auth.server";`
+ `import { authenticator } from "~/utils/auth.server";`,
],
refineProps: ["authProvider={authProvider}"],
refineImports: [`AuthBindings`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
- refineChakraImports: [],
loader: [
`export const loader = async ({ request }: LoaderArgs) => {
const profile = await authenticator.isAuthenticated(request);
const to = new URL(request.url).searchParams.get("to");
return json({ profile, to });
- };`
+ };`,
],
inner: [
`
@@ -62,8 +60,8 @@ const base = {
return null;
},
- };`
- ]
+ };`,
+ ],
},
};
diff --git a/refine-remix/plugins/chakra/app/components/header/index.tsx b/refine-remix/plugins/chakra/app/components/header/index.tsx
deleted file mode 100644
index cff652e1d..000000000
--- a/refine-remix/plugins/chakra/app/components/header/index.tsx
+++ /dev/null
@@ -1,93 +0,0 @@
-import {
- Avatar,
- Box,
- BoxProps,
- HStack,
- Icon,
- IconButton,
- Text,
- useColorMode,
- useColorModeValue,
-} from "@chakra-ui/react";
-import {
- HamburgerMenu,
- RefineThemedLayoutV2HeaderProps,
-} from "@refinedev/chakra-ui";
-import { useGetIdentity } from "@refinedev/core";
-import { IconMoon, IconSun } from "@tabler/icons";
-import React from "react";
-
-type IUser = {
- id: number;
- name: string;
- avatar: string;
-};
-
-export const Header: React.FC
= ({
- sticky,
-}) => {
- const { data: user } = useGetIdentity();
-
- const { colorMode, toggleColorMode } = useColorMode();
-
- const bgColor = useColorModeValue(
- "refine.header.bg.light",
- "refine.header.bg.dark",
- );
-
- let stickyProps: BoxProps = {};
- if (sticky) {
- stickyProps = {
- position: "sticky",
- top: 0,
- zIndex: 1,
- };
- }
-
- return (
-
-
-
-
-
-
-
- {(user?.avatar || user?.name) && (
-
- {user?.name && (
-
- {user.name}
-
- )}
-
-
- )}
-
-
- );
-};
diff --git a/refine-remix/plugins/chakra/app/context.tsx b/refine-remix/plugins/chakra/app/context.tsx
deleted file mode 100644
index 2cb97ff64..000000000
--- a/refine-remix/plugins/chakra/app/context.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import React, { createContext } from 'react'
-
-export interface ServerStyleContextData {
- key: string
- ids: Array
- css: string
-}
-
-export const ServerStyleContext = createContext(null)
-
-export interface ClientStyleContextData {
- reset: () => void
-}
-
-export const ClientStyleContext = createContext(null)
\ No newline at end of file
diff --git a/refine-remix/plugins/chakra/app/createEmotionCache.ts b/refine-remix/plugins/chakra/app/createEmotionCache.ts
deleted file mode 100644
index 2d205675c..000000000
--- a/refine-remix/plugins/chakra/app/createEmotionCache.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import createCache from "@emotion/cache";
-
-export default function createEmotionCache() {
- return createCache({ key: "cha" });
-}
-
-export const defaultCache = createEmotionCache();
diff --git a/refine-remix/plugins/chakra/app/entry.client.tsx b/refine-remix/plugins/chakra/app/entry.client.tsx
deleted file mode 100644
index 2af90d058..000000000
--- a/refine-remix/plugins/chakra/app/entry.client.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import { CacheProvider } from "@emotion/react";
-import { RemixBrowser } from "@remix-run/react";
-import React, { startTransition, StrictMode } from "react";
-import { hydrateRoot } from "react-dom/client";
-import { ClientStyleContext } from "./context";
-import createEmotionCache, { defaultCache } from "./createEmotionCache";
-
-interface ClientCacheProviderProps {
- children: React.ReactNode;
-}
-
-function ClientCacheProvider({ children }: ClientCacheProviderProps) {
- const [cache, setCache] = React.useState(defaultCache);
-
- function reset() {
- setCache(createEmotionCache());
- }
-
- return (
-
- {children}
-
- );
-}
-
-startTransition(() => {
- hydrateRoot(
- document,
-
-
-
-
- ,
- );
-});
diff --git a/refine-remix/plugins/chakra/app/entry.server.tsx b/refine-remix/plugins/chakra/app/entry.server.tsx
deleted file mode 100644
index e5591f291..000000000
--- a/refine-remix/plugins/chakra/app/entry.server.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { renderToString } from 'react-dom/server'
-import { CacheProvider } from '@emotion/react'
-import createEmotionServer from '@emotion/server/create-instance'
-import { RemixServer } from '@remix-run/react'
-import type { EntryContext } from '@remix-run/node' // Depends on the runtime you choose
-
-import { ServerStyleContext } from './context'
-import createEmotionCache from './createEmotionCache'
-
-export default function handleRequest(
- request: Request,
- responseStatusCode: number,
- responseHeaders: Headers,
- remixContext: EntryContext,
-) {
- const cache = createEmotionCache()
- const { extractCriticalToChunks } = createEmotionServer(cache)
-
- const html = renderToString(
-
-
-
-
- ,
- )
-
- const chunks = extractCriticalToChunks(html)
-
- const markup = renderToString(
-
-
-
-
- ,
- )
-
- responseHeaders.set('Content-Type', 'text/html')
-
- return new Response(`${markup}`, {
- status: responseStatusCode,
- headers: responseHeaders,
- })
-}
\ No newline at end of file
diff --git a/refine-remix/plugins/chakra/app/root.tsx b/refine-remix/plugins/chakra/app/root.tsx
deleted file mode 100644
index ccf8ee82d..000000000
--- a/refine-remix/plugins/chakra/app/root.tsx
+++ /dev/null
@@ -1,174 +0,0 @@
-import React, { useContext, useEffect } from 'react'
-import { withEmotionCache } from '@emotion/react'
-import {
- Links,
- LiveReload,
- Meta,
- Outlet,
- Scripts,
- ScrollRestoration,
- useLoaderData,
-} from '@remix-run/react'
-import { MetaFunction, LinksFunction } from '@remix-run/node' // Depends on the runtime you choose
-import { Refine, GitHubBanner, <%- (_app.refineImports || []).join("\n,") _%> } from '@refinedev/core';
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import {ChakraProvider} from "@chakra-ui/react";
- import { RefineThemes, <%- (_app.refineChakraImports || []).join("\n,") _%> } from '@refinedev/chakra-ui';
-<%_ } _%>
-import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
-import routerProvider, { UnsavedChangesNotifier } from "@refinedev/remix-router";
-
-
-import { ServerStyleContext, ClientStyleContext } from './context'
-
-<%- (_app.import || []).join("\n") _%>
-
-<%- (_app.localImport || []).join("\n") _%>
-
-<%- (_app.relativeImport || []).join("\n") _%>
-
-<%- (_app.afterImport || []).join("\n") _%>
-
-export const meta: MetaFunction = () => ([
- {
- title: 'New Remix App',
- }
-]);
-
-<%
- var top = _app.wrapper.map(wrapper => wrapper[0] || "");
- var bottom = _app.wrapper.map(wrapper => wrapper[1] || "").reverse();
-%>
-
-export let links: LinksFunction = () => {
- return [
- { rel: 'preconnect', href: 'https://fonts.googleapis.com' },
- { rel: 'preconnect', href: 'https://fonts.gstatic.com' },
- {
- rel: 'stylesheet',
- href: 'https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700;800&display=swap'
- },
- ]
-}
-
-interface DocumentProps {
- children: React.ReactNode;
-}
-
-const Document = withEmotionCache(
- ({ children }: DocumentProps, emotionCache) => {
- const serverStyleData = useContext(ServerStyleContext);
- const clientStyleData = useContext(ClientStyleContext);
-
- // Only executed on client
- useEffect(() => {
- // re-link sheet container
- emotionCache.sheet.container = document.head;
- // re-inject tags
- const tags = emotionCache.sheet.tags;
- emotionCache.sheet.flush();
- tags.forEach((tag) => {
- (emotionCache.sheet as any)._insertTag(tag);
- });
- // reset cache to reapply global styles
- clientStyleData?.reset();
- }, []);
-
- return (
-
-
-
-
-
-
- {serverStyleData?.map(({ key, ids, css }) => (
-
- ))}
-
-
- {children}
-
-
-
-
-
- );
- }
-);
-
-export default function App() {
- <%- (_app.innerHooks || []).join("\n") %>
- <%- (_app.inner || []).join("\n") %>
-
- return (
-
-
- {/* You can change the theme colors here. example: theme={RefineThemes.Magenta} */}
- }>
-
- <%- top.join("\n") %>
-
- <%_ if (answers["inferencer"] === 'inferencer' || answers["inferencer-headless"] === 'inferencer-headless') { _%>
- resources={[
- <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
- {
- name: "blog-posts",
- list: "/blog-posts",
- create: "/blog-posts/create",
- edit: "/blog-posts/edit/:id",
- show: "/blog-posts/show/:id",
- meta: {
- canDelete: true,
- },
- },
- <%_ } else { _%>
- {
- name: "blog_posts",
- list: "/blog-posts",
- create: "/blog-posts/create",
- edit: "/blog-posts/edit/:id",
- show: "/blog-posts/show/:id",
- meta: {
- canDelete: true,
- },
- },
- <%_ } _%>
- {
- name: "categories",
- list: "/categories",
- create: "/categories/create",
- edit: "/categories/edit/:id",
- show: "/categories/show/:id",
- meta: {
- canDelete: true,
- },
- }
- ]}
- <%_ } _%>
- options={{
- syncWithLocation: true,
- warnWhenUnsavedChanges: true,
- useNewQueryKeys: true,
- <%_ if (typeof projectId !== 'undefined' && projectId !== '') { _%>
- projectId: "<%= projectId %>",
- <%_ } _%>
- }}
- >
-
-
-
-
- <%- bottom.join("\n") %>
-
-
-
- );
-}
-
-<%- (_app.loader || []).join("\n,") _%>
diff --git a/refine-remix/plugins/chakra/extend.js b/refine-remix/plugins/chakra/extend.js
deleted file mode 100644
index 6c66711af..000000000
--- a/refine-remix/plugins/chakra/extend.js
+++ /dev/null
@@ -1,17 +0,0 @@
-const base = {
- _app: {
- refineProps: [
- "notificationProvider={notificationProvider}",
- ],
- import: [],
- refineChakraImports: [
- "notificationProvider",
- ],
- },
-};
-
-module.exports = {
- extend() {
- return base;
- },
-};
diff --git a/refine-remix/plugins/chakra/meta.json b/refine-remix/plugins/chakra/meta.json
deleted file mode 100644
index 454e96c88..000000000
--- a/refine-remix/plugins/chakra/meta.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "name": "Chakra UI",
- "url": "https://refine.dev/docs/"
-}
diff --git a/refine-remix/plugins/chakra/package.json b/refine-remix/plugins/chakra/package.json
deleted file mode 100644
index 160d01e39..000000000
--- a/refine-remix/plugins/chakra/package.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
- "dependencies": {
- "@refinedev/chakra-ui": "^2.27.1",
- "@refinedev/react-hook-form": "^4.8.13",
- "@refinedev/react-table": "^5.6.5",
- "@tabler/icons": "^1.1.0",
- "@emotion/server": "^11.10.0",
- "@emotion/cache": "^11.10.5",
- "@chakra-ui/react": "^2.5.1"
- }
-}
diff --git a/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.forgot-password.tsx b/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.forgot-password.tsx
index 65ef33909..a4172e7fd 100644
--- a/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.forgot-password.tsx
+++ b/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.forgot-password.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.login.tsx b/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.login.tsx
index 2f3342017..65b34132c 100644
--- a/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.login.tsx
+++ b/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.login.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.register.tsx b/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.register.tsx
index 513637767..b695bb50b 100644
--- a/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.register.tsx
+++ b/refine-remix/plugins/data-provider-appwrite/app/routes/_auth.register.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-appwrite/app/routes/_layout.tsx b/refine-remix/plugins/data-provider-appwrite/app/routes/_layout.tsx
index 2e8a7117b..b3e81e7db 100644
--- a/refine-remix/plugins/data-provider-appwrite/app/routes/_layout.tsx
+++ b/refine-remix/plugins/data-provider-appwrite/app/routes/_layout.tsx
@@ -18,22 +18,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
import { Header } from "@components/header";
import { authProvider } from "~/authProvider";
diff --git a/refine-remix/plugins/data-provider-appwrite/extend.js b/refine-remix/plugins/data-provider-appwrite/extend.js
index 50650cce5..d0848d00c 100644
--- a/refine-remix/plugins/data-provider-appwrite/extend.js
+++ b/refine-remix/plugins/data-provider-appwrite/extend.js
@@ -18,7 +18,6 @@ const base = {
],
refineOptions: [`liveMode: "auto",`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
},
};
diff --git a/refine-remix/plugins/data-provider-appwrite/package.json b/refine-remix/plugins/data-provider-appwrite/package.json
index 34ed894b2..591aff18c 100644
--- a/refine-remix/plugins/data-provider-appwrite/package.json
+++ b/refine-remix/plugins/data-provider-appwrite/package.json
@@ -3,7 +3,7 @@
"@refinedev/appwrite": "^6.4.6",
"cookie": "^0.5.0",
"js-cookie": "^3.0.1",
- "@refinedev/kbar": "^1.3.5",
+ "@refinedev/kbar": "^1.3.6",
"uuid": "^9.0.0"
},
"devDependencies": {
diff --git a/refine-remix/plugins/data-provider-hasura/app/inferencerPredefinedMeta.ts b/refine-remix/plugins/data-provider-hasura/app/inferencerPredefinedMeta.ts
deleted file mode 100644
index 67f26ed5b..000000000
--- a/refine-remix/plugins/data-provider-hasura/app/inferencerPredefinedMeta.ts
+++ /dev/null
@@ -1,202 +0,0 @@
-import gql from "graphql-tag";
-
-/**
- * This `meta` object is used to define the necessary metadata for inferencer to work with.
- *
- * They will be used to infer the fields of the response of the data provider.
- * Also they will be included in the generated code, making them easily editable after you generate the boilerplate code for your resource.
- */
-export const inferencerPredefinedMeta = {
- blog_posts: {
- getList: {
- gqlQuery: gql`
- query BlogPostsList(
- $offset: Int!
- $limit: Int!
- $order_by: [blog_posts_order_by!]
- $where: blog_posts_bool_exp
- ) {
- blog_posts(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- content
- category_id
- created_at
- status
- category {
- id
- title
- }
- }
- blog_posts_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getOne: {
- gqlQuery: gql`
- query GetBlogPost($id: uuid!) {
- blog_posts_by_pk(id: $id) {
- id
- title
- content
- category_id
- created_at
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- create: {
- foo: "bar",
- objFoo: {
- bar: "baz",
- },
- gqlMutation: gql`
- mutation CreateBlogPosts($object: blog_posts_insert_input!) {
- insert_blog_posts_one(object: $object) {
- id
- title
- content
- created_at
- category_id
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- update: {
- gqlMutation: gql`
- mutation UpdateBlogPosts(
- $id: uuid!
- $object: blog_posts_set_input!
- ) {
- update_blog_posts_by_pk(
- pk_columns: { id: $id }
- _set: $object
- ) {
- id
- title
- content
- created_at
- category_id
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- },
- categories: {
- default: {
- gqlQuery: gql`
- query CategoriesList(
- $offset: Int
- $limit: Int
- $order_by: [categories_order_by!]
- $where: categories_bool_exp
- ) {
- categories(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- created_at
- }
- categories_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getList: {
- gqlQuery: gql`
- query CategoriesList(
- $offset: Int
- $limit: Int
- $order_by: [categories_order_by!]
- $where: categories_bool_exp
- ) {
- categories(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- created_at
- }
- categories_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getOne: {
- gqlQuery: gql`
- query GetCategory($id: uuid!) {
- categories_by_pk(id: $id) {
- id
- title
- created_at
- }
- }
- `,
- },
- create: {
- gqlMutation: gql`
- mutation CreateCategory($object: categories_insert_input!) {
- insert_categories_one(object: $object) {
- id
- title
- created_at
- }
- }
- `,
- },
- update: {
- gqlMutation: gql`
- mutation UpdateCategory(
- $id: uuid!
- $object: categories_set_input!
- ) {
- update_categories_by_pk(
- pk_columns: { id: $id }
- _set: $object
- ) {
- id
- title
- created_at
- }
- }
- `,
- },
- },
-};
diff --git a/refine-remix/plugins/data-provider-hasura/app/queries/blog-posts.ts b/refine-remix/plugins/data-provider-hasura/app/queries/blog-posts.ts
new file mode 100644
index 000000000..76bfc8400
--- /dev/null
+++ b/refine-remix/plugins/data-provider-hasura/app/queries/blog-posts.ts
@@ -0,0 +1,13 @@
+export const BLOG_POSTS_QUERY = [
+ "id",
+ "title",
+ "status",
+ "created_at",
+ "category_id",
+ "content",
+ {
+ category: ["id", "title"],
+ },
+];
+
+export const BLOG_POSTS_CATEGORIES_SELECT_QUERY = ["id", "title"];
diff --git a/refine-remix/plugins/data-provider-hasura/app/queries/categories.ts b/refine-remix/plugins/data-provider-hasura/app/queries/categories.ts
new file mode 100644
index 000000000..9a6a5ccd8
--- /dev/null
+++ b/refine-remix/plugins/data-provider-hasura/app/queries/categories.ts
@@ -0,0 +1 @@
+export const CATEGORIES_QUERY = ["id", "title"];
diff --git a/refine-remix/plugins/data-provider-nestjs-query/app/queries/blog-posts.ts b/refine-remix/plugins/data-provider-nestjs-query/app/queries/blog-posts.ts
new file mode 100644
index 000000000..3e77249eb
--- /dev/null
+++ b/refine-remix/plugins/data-provider-nestjs-query/app/queries/blog-posts.ts
@@ -0,0 +1,85 @@
+import gql from "graphql-tag";
+
+export const POST_CREATE_MUTATION = gql`
+ mutation PostCreate($input: CreateOneBlogPostInput!) {
+ createOneBlogPost(input: $input) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ }
+ }
+`;
+
+export const POST_EDIT_MUTATION = gql`
+ mutation PostEdit($input: UpdateOneBlogPostInput!) {
+ updateOneBlogPost(input: $input) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ }
+ }
+`;
+
+export const POSTS_LIST_QUERY = gql`
+ query BlogPostsList(
+ $paging: OffsetPaging!
+ $filter: BlogPostFilter
+ $sorting: [BlogPostSort!]!
+ ) {
+ blogPosts(paging: $paging, filter: $filter, sorting: $sorting) {
+ nodes {
+ id
+ title
+ categoryId
+ category {
+ id
+ title
+ }
+ status
+ content
+ createdAt
+ }
+ totalCount
+ }
+ }
+`;
+
+export const POST_SHOW_QUERY = gql`
+ query PostShow($id: ID!) {
+ blogPost(id: $id) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ createdAt
+ }
+ }
+`;
+
+export const CATEGORIES_SELECT_QUERY = gql`
+ query CategoriesSelect($filter: CategoryFilter!) {
+ categories(filter: $filter) {
+ nodes {
+ id
+ title
+ }
+ }
+ }
+`;
diff --git a/refine-remix/plugins/data-provider-nestjs-query/app/queries/categories.ts b/refine-remix/plugins/data-provider-nestjs-query/app/queries/categories.ts
new file mode 100644
index 000000000..8e4e6e0b1
--- /dev/null
+++ b/refine-remix/plugins/data-provider-nestjs-query/app/queries/categories.ts
@@ -0,0 +1,45 @@
+import gql from "graphql-tag";
+
+export const CATEGORY_CREATE_MUTATION = gql`
+ mutation CategoryCreate($input: CreateOneCategoryInput!) {
+ createOneCategory(input: $input) {
+ id
+ title
+ }
+ }
+`;
+
+export const CATEGORY_EDIT_MUTATION = gql`
+ mutation CategoryEdit($input: UpdateOneCategoryInput!) {
+ updateOneCategory(input: $input) {
+ id
+ title
+ }
+ }
+`;
+
+export const CATEGORIES_LIST_QUERY = gql`
+ query CategoriesList(
+ $paging: OffsetPaging!
+ $filter: CategoryFilter
+ $sorting: [CategorySort!]!
+ ) {
+ categories(paging: $paging, filter: $filter, sorting: $sorting) {
+ nodes {
+ id
+ title
+ createdAt
+ }
+ totalCount
+ }
+ }
+`;
+export const CATEGORY_SHOW_QUERY = gql`
+ query CategoryShow($id: ID!) {
+ category(id: $id) {
+ id
+ title
+ createdAt
+ }
+ }
+`;
diff --git a/refine-remix/plugins/data-provider-nestjs-query/package.json b/refine-remix/plugins/data-provider-nestjs-query/package.json
index f3d4e67e7..6506d516e 100644
--- a/refine-remix/plugins/data-provider-nestjs-query/package.json
+++ b/refine-remix/plugins/data-provider-nestjs-query/package.json
@@ -1,5 +1,16 @@
{
- "dependencies": {
- "@refinedev/nestjs-query": "^1.1.1"
- }
-}
\ No newline at end of file
+ "scripts": {
+ "codegen": "graphql-codegen"
+ },
+ "dependencies": {
+ "@refinedev/nestjs-query": "^1.1.1",
+ "graphql-tag": "^2.12.6",
+ "graphql-ws": "^5.9.1"
+ },
+ "devDependencies": {
+ "@graphql-codegen/cli": "^5.0.0",
+ "@graphql-codegen/typescript": "^4.0.1",
+ "@graphql-codegen/typescript-operations": "^4.0.1",
+ "@graphql-codegen/import-types-preset": "^3.0.0"
+ }
+}
diff --git a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.forgot-password.tsx b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.forgot-password.tsx
index ead3bd6c0..e96620066 100644
--- a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.forgot-password.tsx
+++ b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.forgot-password.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.login.tsx b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.login.tsx
index cce191546..e28d342c9 100644
--- a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.login.tsx
+++ b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.login.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.register.tsx b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.register.tsx
index 6deea02f5..a51030f6b 100644
--- a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.register.tsx
+++ b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_auth.register.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_layout.tsx b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_layout.tsx
index 2e8a7117b..b3e81e7db 100644
--- a/refine-remix/plugins/data-provider-strapi-v4/app/routes/_layout.tsx
+++ b/refine-remix/plugins/data-provider-strapi-v4/app/routes/_layout.tsx
@@ -18,22 +18,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
import { Header } from "@components/header";
import { authProvider } from "~/authProvider";
diff --git a/refine-remix/plugins/data-provider-strapi-v4/extend.js b/refine-remix/plugins/data-provider-strapi-v4/extend.js
index 636d3bff7..6717a7593 100644
--- a/refine-remix/plugins/data-provider-strapi-v4/extend.js
+++ b/refine-remix/plugins/data-provider-strapi-v4/extend.js
@@ -10,7 +10,6 @@ const base = {
"dataProvider={DataProvider(API_URL + `/api`, axiosInstance)}",
],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
},
};
@@ -24,9 +23,6 @@ module.exports = {
base._app.refineMuiImports.push("AuthPage");
}
- if (answers["ui-framework"] === "mantine") {
- base._app.refineMantineImports.push("AuthPage");
- }
return base;
},
};
diff --git a/refine-remix/plugins/data-provider-supabase/app/routes/_auth.forgot-password.tsx b/refine-remix/plugins/data-provider-supabase/app/routes/_auth.forgot-password.tsx
index ead3bd6c0..e96620066 100644
--- a/refine-remix/plugins/data-provider-supabase/app/routes/_auth.forgot-password.tsx
+++ b/refine-remix/plugins/data-provider-supabase/app/routes/_auth.forgot-password.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-supabase/app/routes/_auth.login.tsx b/refine-remix/plugins/data-provider-supabase/app/routes/_auth.login.tsx
index cce191546..e28d342c9 100644
--- a/refine-remix/plugins/data-provider-supabase/app/routes/_auth.login.tsx
+++ b/refine-remix/plugins/data-provider-supabase/app/routes/_auth.login.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-supabase/app/routes/_auth.register.tsx b/refine-remix/plugins/data-provider-supabase/app/routes/_auth.register.tsx
index 6deea02f5..a51030f6b 100644
--- a/refine-remix/plugins/data-provider-supabase/app/routes/_auth.register.tsx
+++ b/refine-remix/plugins/data-provider-supabase/app/routes/_auth.register.tsx
@@ -4,12 +4,6 @@
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/mantine";
- <%_ } _%>
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { AuthPage, ThemedTitleV2 } from "@refinedev/chakra-ui";
- <%_ } _%>
<%_ if (answers[`ui-framework`] === "no") { _%>
import { AuthPage } from "@refinedev/core";
<%_ } _%>
diff --git a/refine-remix/plugins/data-provider-supabase/app/routes/_layout.tsx b/refine-remix/plugins/data-provider-supabase/app/routes/_layout.tsx
index 2e8a7117b..b3e81e7db 100644
--- a/refine-remix/plugins/data-provider-supabase/app/routes/_layout.tsx
+++ b/refine-remix/plugins/data-provider-supabase/app/routes/_layout.tsx
@@ -18,22 +18,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- ThemedLayoutV2,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
import { Header } from "@components/header";
import { authProvider } from "~/authProvider";
diff --git a/refine-remix/plugins/data-provider-supabase/extend.js b/refine-remix/plugins/data-provider-supabase/extend.js
index a46f460c7..be819e229 100644
--- a/refine-remix/plugins/data-provider-supabase/extend.js
+++ b/refine-remix/plugins/data-provider-supabase/extend.js
@@ -6,8 +6,6 @@ const base = {
`import { supabaseClient } from "~/utility";`,
],
refineAntdImports: [],
- refineMantineImports: [],
- refineChakraImports: [],
refineMuiImports: [],
refineProps: [
"dataProvider={dataProvider(supabaseClient)}",
@@ -25,13 +23,6 @@ module.exports = {
base._app.refineMuiImports.push("AuthPage");
}
- if (answers["ui-framework"] === "mantine") {
- base._app.refineMantineImports.push("AuthPage");
- }
-
- if (answers["ui-framework"] === "chakra") {
- base._app.refineChakraImports.push("AuthPage");
- }
return base;
},
};
diff --git a/refine-remix/plugins/inferencer/app/routes/_index.tsx b/refine-remix/plugins/headless-example/app/routes/_index.tsx
similarity index 100%
rename from refine-remix/plugins/inferencer/app/routes/_index.tsx
rename to refine-remix/plugins/headless-example/app/routes/_index.tsx
diff --git a/refine-remix/plugins/headless-example/app/routes/_layout.$.tsx b/refine-remix/plugins/headless-example/app/routes/_layout.$.tsx
new file mode 100644
index 000000000..ee93e5023
--- /dev/null
+++ b/refine-remix/plugins/headless-example/app/routes/_layout.$.tsx
@@ -0,0 +1,8 @@
+import { ErrorComponent } from "@refinedev/core";
+
+/**
+ * We're using a splat route to catch all routes that don't match any other route and render the `ErrorComponent` as 404 page.
+ */
+export default function Index() {
+ return ;
+}
diff --git a/refine-remix/plugins/headless-example/app/routes/_layout.blog-posts._index.tsx b/refine-remix/plugins/headless-example/app/routes/_layout.blog-posts._index.tsx
new file mode 100644
index 000000000..1ecf3a7d5
--- /dev/null
+++ b/refine-remix/plugins/headless-example/app/routes/_layout.blog-posts._index.tsx
@@ -0,0 +1,281 @@
+import {
+ GetManyResponse,
+ IResourceComponentsProps,
+ useMany,
+ useNavigation,
+} from "@refinedev/core";
+import { useTable } from "@refinedev/react-table";
+import { ColumnDef, flexRender } from "@tanstack/react-table";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+import { BLOG_POSTS_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POSTS_LIST_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+
+export default function BlogPostList() {
+ const columns = React.useMemo[]>(
+ () => [
+ {
+ id: "id",
+ accessorKey: "id",
+ header: "ID",
+ },
+ {
+ id: "title",
+ accessorKey: "title",
+ header: "Title",
+ },
+ {
+ id: "content",
+ accessorKey: "content",
+ header: "Content",
+ },
+ {
+ id: "category",
+ header: "Category",
+ accessorKey: <%- blogPostCategoryTableField %>,
+ <%_ if (!isGraphQL) { _%>
+ cell: function render({ getValue, table }) {
+ const meta = table.options.meta as {
+ categoryData: GetManyResponse;
+ };
+
+ try {
+ const category = meta.categoryData?.data?.find(
+ (item) => item.id == getValue()?.id,
+ );
+
+ return category?.title ?? "Loading...";
+ } catch (error) {
+ return null;
+ }
+ },
+ <%_ } _%>
+ },
+ {
+ id: "status",
+ accessorKey: "status",
+ header: "Status",
+ },
+ {
+ id: "createdAt",
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ accessorKey: "created_at",
+<%_ } else { _%>
+ accessorKey: "createdAt",
+<%_ } _%>
+ header: "Created At",
+ cell: function render({ getValue }) {
+ return new Date(getValue()).toLocaleString(undefined, {
+ timeZone: "UTC",
+ });
+ },
+ },
+ {
+ id: "actions",
+ accessorKey: "id",
+ header: "Actions",
+ cell: function render({ getValue }) {
+ return (
+
+
+
+
+ );
+ },
+ },
+ ],
+ [],
+ );
+
+ const { edit, show, create } = useNavigation();
+
+ const {
+ getHeaderGroups,
+ getRowModel,
+ setOptions,
+ refineCore: {
+ tableQueryResult: { data: tableData },
+ },
+ getState,
+ setPageIndex,
+ getCanPreviousPage,
+ getPageCount,
+ getCanNextPage,
+ nextPage,
+ previousPage,
+ setPageSize,
+ } = useTable({
+ columns,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ refineCoreProps: {
+ meta: {
+ populate: ['category'],
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlQuery: POSTS_LIST_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ refineCoreProps: {
+ meta: {
+ select: '*, categories(id,title)',
+ },
+ },
+<%_ } _%>
+ });
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData } = useMany({
+ resource: "categories",
+ ids: tableData?.data?.map((item) => item?.<%- blogPostCategoryFieldName %>?.id).filter(Boolean) ?? [],
+ queryOptions: {
+ enabled: !!tableData?.data,
+ },
+ });
+
+ setOptions((prev) => ({
+ ...prev,
+ meta: {
+ ...prev.meta,
+ categoryData,
+ },
+ }));
+<%_ } _%>
+
+ return (
+
+
+
{"List"}
+
+
+
+
+
+ {getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => (
+ |
+ {!header.isPlaceholder &&
+ flexRender(
+ header.column.columnDef.header,
+ header.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+ {getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+ |
+ {flexRender(
+ cell.column.columnDef.cell,
+ cell.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ {" "}
+ {getState().pagination.pageIndex + 1} / {getPageCount()}{" "}
+
+
+
+ | {"Go"}:{" "}
+ {
+ const page = e.target.value
+ ? Number(e.target.value) - 1
+ : 0;
+ setPageIndex(page);
+ }}
+ />
+ {" "}
+
+
+
+
+
Create
+
+
+
+
+
+
+
+
Edit
+
+
+
+
+
+
+
+
{"Show"}
+
+
+
+
+
+
+
+
{"ID"}
+
{record?.id ?? ""}
+
+
+
{"Title"}
+
{record?.title}
+
+
+
{"Content"}
+
{record?.content}
+
+
+
{"Category"}
+<%_ if (isGraphQL) { _%>
+
{record?.<%- blogPostCategoryFieldName %>?.title}
+<%_ } else { _%>
+
+ {categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )}
+
+<%_ } _%>
+
+
+
{"Status"}
+
{record?.status}
+
+
+
{"Created at"}
+
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ {new Date(record?.created_at).toLocaleString(undefined, {
+ timeZone: "UTC",
+ })}
+<%_ } else { _%>
+ {new Date(record?.createdAt).toLocaleString(undefined, {
+ timeZone: "UTC",
+ })}
+<%_ } _%>
+
+
+
+
+
+
+
+ );
+ },
+ },
+ ],
+ [],
+ );
+
+ const { edit, show, create } = useNavigation();
+
+ const {
+ getHeaderGroups,
+ getRowModel,
+ setOptions,
+ getState,
+ setPageIndex,
+ getCanPreviousPage,
+ getPageCount,
+ getCanNextPage,
+ nextPage,
+ previousPage,
+ setPageSize,
+ } = useTable({
+ columns,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+ },
+<%_ } _%>
+ });
+
+ setOptions((prev) => ({
+ ...prev,
+ meta: {
+ ...prev.meta,
+ },
+ }));
+
+ return (
+
+
+
List
+
+
+
+
+
+ {getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => (
+ |
+ {!header.isPlaceholder &&
+ flexRender(
+ header.column.columnDef.header,
+ header.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+ {getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+ |
+ {flexRender(
+ cell.column.columnDef.cell,
+ cell.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ {" "}
+ {getState().pagination.pageIndex + 1} / {getPageCount()}{" "}
+
+
+
+ | Go:{" "}
+ {
+ const page = e.target.value
+ ? Number(e.target.value) - 1
+ : 0;
+ setPageIndex(page);
+ }}
+ />
+ {" "}
+
+
+
+
+
Create
+
+
+
+
+
+
+
+
Edit
+
+
+
+
+
+
+
+
Show
+
+
+
+
+
+
+
+
ID
+
{record?.id ?? ""}
+
+
+
Title
+
{record?.title}
+
+
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.create.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.create.tsx
new file mode 100644
index 000000000..ba027821f
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.create.tsx
@@ -0,0 +1,145 @@
+import { Autocomplete, Box, MenuItem, Select, TextField } from '@mui/material'
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Create, useAutocomplete } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+import React from "react";
+import { Controller } from "react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_CREATE_MUTATION, CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+export default function BlogPostCreate() {
+ const {
+ saveButtonProps,
+ refineCore: { formLoading, onFinish },
+ handleSubmit,
+ register,
+ control,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: POST_CREATE_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ const { autocompleteProps: categoryAutocompleteProps } = useAutocomplete({
+ resource: "categories",
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+ }
+ rules={{ required: "This field is required" }}
+ // eslint-disable-next-line
+ defaultValue={null as any}
+ render={({ field }) => (
+ {
+ field.onChange(value.id)
+ }}
+ getOptionLabel={(item) => {
+ return (
+ categoryAutocompleteProps?.options?.find((p) => {
+ const itemId = typeof item === 'object' ? item?.id?.toString() : item?.toString()
+ const pId = p?.id?.toString()
+ return itemId === pId
+ })?.title ?? ''
+ )
+ }}
+ isOptionEqualToValue={(option, value) => {
+ const optionId = option?.id?.toString()
+ const valueId = typeof value === 'object' ? value?.id?.toString() : value?.toString()
+ return value === undefined || optionId === valueId
+ }}
+ renderInput={(params) => (
+ ?.id}
+ helperText={
+ (errors as any)?.<%- blogPostCategoryFieldName %>?.id?.message
+ }
+ required
+ />
+ )}
+ />
+ )}
+ />
+ {
+ return (
+
+ );
+ }}
+ />
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.edit.$id.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.edit.$id.tsx
new file mode 100644
index 000000000..f1076efda
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.edit.$id.tsx
@@ -0,0 +1,165 @@
+import { Autocomplete, Box, Select, TextField } from "@mui/material";
+import MenuItem from "@mui/material/MenuItem";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Edit, useAutocomplete } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+import React from "react";
+import { Controller } from "react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_EDIT_MUTATION, CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+export default function BlogPostEdit() {
+ const {
+ saveButtonProps,
+ refineCore: { queryResult, formLoading, onFinish },
+ handleSubmit,
+ register,
+ control,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ refineCoreProps: {
+ meta: {
+ populate: ['category'],
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: POST_EDIT_MUTATION,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ refineCoreProps: {
+ meta: {
+ select: '*, categories(id,title)',
+ },
+ },
+<%_ } _%>
+ });
+
+ const blogPostsData = queryResult?.data?.data;
+
+ const { autocompleteProps: categoryAutocompleteProps } = useAutocomplete({
+ resource: "categories",
+ defaultValue: blogPostsData?.<%- blogPostCategoryFieldName %>?.id,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+
+ return (
+
+
+
+
+ }
+ rules={{ required: "This field is required" }}
+ // eslint-disable-next-line
+ defaultValue={null as any}
+ render={({ field }) => (
+ {
+ field.onChange(value.id)
+ }}
+ getOptionLabel={(item) => {
+ return (
+ categoryAutocompleteProps?.options?.find((p) => {
+ const itemId = typeof item === 'object' ? item?.id?.toString() : item?.toString()
+ const pId = p?.id?.toString()
+ return itemId === pId
+ })?.title ?? ''
+ )
+ }}
+ isOptionEqualToValue={(option, value) => {
+ const optionId = option?.id?.toString()
+ const valueId = typeof value === 'object' ? value?.id?.toString() : value?.toString()
+ return value === undefined || optionId === valueId
+ }}
+ renderInput={(params) => (
+ ?.id}
+ helperText={
+ (errors as any)?.<%- blogPostCategoryFieldName %>?.id?.message
+ }
+ required
+ />
+ )}
+ />
+ )}
+ />
+ {
+ return (
+
+ );
+ }}
+ />
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.show.$id.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.show.$id.tsx
new file mode 100644
index 000000000..912d3c818
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.blog-posts.show.$id.tsx
@@ -0,0 +1,97 @@
+import { Stack, Typography } from "@mui/material";
+import { IResourceComponentsProps, useOne, useShow } from "@refinedev/core";
+import {
+ DateField,
+ MarkdownField,
+ NumberField,
+ Show,
+ TextFieldComponent as TextField,
+} from "@refinedev/mui";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_SHOW_QUERY } from "../queries/blog-posts";
+<%_ } _%>
+
+
+export default function BlogPostShow() {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: POST_SHOW_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData, isLoading: categoryIsLoading } = useOne({
+ resource: "categories",
+ id: record?.<%- blogPostCategoryFieldName %>?.id || "",
+ queryOptions: {
+ enabled: !!record,
+ },
+ });
+<%_ } _%>
+
+ return (
+
+
+
+ {"ID"}
+
+
+
+
+ {"Title"}
+
+
+
+
+ {"Content"}
+
+
+
+<%_ if (isGraphQL) { _%>
+ {record?.<%- blogPostCategoryFieldName %>?.title}
+<%_ } else { _%>
+ {categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )}
+<%_ } _%>
+
+
+ {"Status"}
+
+
+
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+
+<%_ } else { _%>
+
+<%_ } _%>
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.categories._index.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.categories._index.tsx
new file mode 100644
index 000000000..48e45547e
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.categories._index.tsx
@@ -0,0 +1,72 @@
+import { DataGrid, GridColDef } from "@mui/x-data-grid";
+import { IResourceComponentsProps } from "@refinedev/core";
+import {
+ DeleteButton,
+ EditButton,
+ List,
+ ShowButton,
+ useDataGrid,
+} from "@refinedev/mui";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORIES_LIST_QUERY } from "../queries/categories";
+<%_ } _%>
+
+export default function CategoryList() {
+ const { dataGridProps } = useDataGrid({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+<%_ } _%>
+ });
+
+ const columns = React.useMemo(
+ () => [
+ {
+ field: "id",
+ headerName: "ID",
+ type: "number",
+ minWidth: 50,
+ },
+ {
+ field: "title",
+ flex: 1,
+ headerName: "Title",
+ minWidth: 200,
+ },
+ {
+ field: "actions",
+ headerName: "Actions",
+ sortable: false,
+ renderCell: function render({ row }) {
+ return (
+ <>
+
+
+
+
+ );
+ },
+ align: "center",
+ headerAlign: "center",
+ minWidth: 80,
+ },
+ ],
+ [],
+ );
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.categories.create.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.categories.create.tsx
new file mode 100644
index 000000000..407b7c6d1
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.categories.create.tsx
@@ -0,0 +1,58 @@
+import { Box, TextField } from "@mui/material";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Create } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_CREATE_MUTATION } from "../queries/categories";
+<%_ } _%>
+
+export default function CategoryCreate() {
+ const {
+ saveButtonProps,
+ refineCore: { formLoading },
+ register,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: CATEGORY_CREATE_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.categories.edit.$id.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.categories.edit.$id.tsx
new file mode 100644
index 000000000..89c12f4eb
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.categories.edit.$id.tsx
@@ -0,0 +1,57 @@
+import { Box, TextField } from "@mui/material";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Edit } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_EDIT_MUTATION } from"../queries/categories";
+<%_ } _%>
+
+export default function CategoryEdit() {
+ const {
+ saveButtonProps,
+ register,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: CATEGORY_EDIT_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.categories.show.$id.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.categories.show.$id.tsx
new file mode 100644
index 000000000..92372c87c
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.categories.show.$id.tsx
@@ -0,0 +1,46 @@
+import { Stack, Typography } from "@mui/material";
+import { IResourceComponentsProps, useShow } from "@refinedev/core";
+import {
+ NumberField,
+ Show,
+ TextFieldComponent as TextField,
+} from "@refinedev/mui";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from "../queries/categories";
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_SHOW_QUERY } from "../queries/categories";
+<%_ } _%>
+
+export default function CategoryShow() {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORY_SHOW_QUERY,
+ },
+<%_ } _%>
+ });
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+ return (
+
+
+
+ {"ID"}
+
+
+
+ {"Title"}
+
+
+
+
+ );
+};
diff --git a/refine-remix/plugins/mui-example/app/routes/_layout.tsx b/refine-remix/plugins/mui-example/app/routes/_layout.tsx
new file mode 100644
index 000000000..27e9a5eff
--- /dev/null
+++ b/refine-remix/plugins/mui-example/app/routes/_layout.tsx
@@ -0,0 +1,80 @@
+import { ThemedLayoutV2, ThemedSiderV2, ThemedTitleV2 } from "@refinedev/mui";
+import { Outlet } from "@remix-run/react";
+import { Header } from "~/components/header";
+<%_ if (_app.isAuthProviderCheck) { _%>
+ import type { LoaderArgs } from "@remix-run/node";
+ import { redirect } from "@remix-run/node";
+ import { authProvider } from "~/authProvider";
+<%_ } _%>
+
+<%_ if (_app.isNextAuthCheck) { _%>
+ import type { LoaderArgs } from "@remix-run/node";
+ import { redirect } from "@remix-run/node";
+ import { authenticator } from "~/utils/auth.server";
+<%_ } _%>
+
+export default function BaseLayout() {
+ return (
+ }
+ Sider={(props) => }
+ <%_ if (selectedSvg || selectedTitle) { _%>
+ Title={({ collapsed }) => (
+
+ text="<%= selectedTitle %>"
+ <%_ } _%>
+ <%_ if (selectedSvg) { _%>
+ icon={}
+ <%_ } _%>
+ />
+ )}
+ <%_ } _%>
+ >
+
+
+ );
+}
+
+
+<%_ if (_app.isAuthProviderCheck) { _%>
+ /**
+ * We're checking if the current session is authenticated.
+ * If not, we're redirecting the user to the login page.
+ * This is applied for all routes that are nested under this layout (_protected).
+ */
+ export async function loader({ request }: LoaderArgs) {
+ const { authenticated, redirectTo } = await authProvider.check(request);
+
+ if (!authenticated) {
+ throw redirect(redirectTo ?? "/login");
+ }
+
+ return {};
+ }
+<%_ } _%>
+
+<%_ if (_app.isNextAuthCheck) { _%>
+/**
+ * We're checking if the current session is authenticated.
+ * If not, we're redirecting the user to the login page.
+ * This is applied for all routes that are nested under this layout (_protected).
+ */
+export const loader = async ({ request }: LoaderArgs) => {
+ const session = await authenticator.isAuthenticated(request);
+ const pathname = new URL(request.url).pathname;
+
+ let to = ``;
+ // ignore only `/` routes
+ if (pathname !== "/") {
+ to = `?to=${pathname}`;
+ }
+
+ if (!session) {
+ return redirect(`/login${to}`);
+ }
+
+ return {};
+};
+<%_ } _%>
\ No newline at end of file
diff --git a/refine-remix/plugins/mui/app/root.tsx b/refine-remix/plugins/mui/app/root.tsx
index 434cb2a90..8b0b18b37 100644
--- a/refine-remix/plugins/mui/app/root.tsx
+++ b/refine-remix/plugins/mui/app/root.tsx
@@ -104,7 +104,7 @@ export default function App() {
- <%_ if (answers["inferencer"] === 'inferencer' || answers["inferencer-headless"] === 'inferencer-headless') { _%>
+ <%_ if (_app.hasRoutes === true) { _%>
resources={[
<%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
{
diff --git a/refine-remix/plugins/mui/package.json b/refine-remix/plugins/mui/package.json
index 11762faef..2c7a9d514 100644
--- a/refine-remix/plugins/mui/package.json
+++ b/refine-remix/plugins/mui/package.json
@@ -1,12 +1,12 @@
{
- "dependencies": {
- "@refinedev/mui": "^5.14.1",
- "@refinedev/react-hook-form": "^4.8.13",
- "@mui/icons-material": "^5.8.3",
- "@emotion/react": "^11.8.2",
- "@emotion/styled": "^11.8.1",
- "@mui/lab": "^5.0.0-alpha.85",
- "@mui/material": "^5.8.6",
- "@mui/x-data-grid": "^6.6.0"
- }
+ "dependencies": {
+ "@refinedev/mui": "^5.14.4",
+ "@refinedev/react-hook-form": "^4.8.14",
+ "@mui/icons-material": "^5.8.3",
+ "@emotion/react": "^11.8.2",
+ "@emotion/styled": "^11.8.1",
+ "@mui/lab": "^5.0.0-alpha.85",
+ "@mui/material": "^5.8.6",
+ "@mui/x-data-grid": "^6.6.0"
+ }
}
diff --git a/refine-remix/prompt.js b/refine-remix/prompt.js
index b33db5b4c..64b720fe1 100644
--- a/refine-remix/prompt.js
+++ b/refine-remix/prompt.js
@@ -51,11 +51,6 @@ module.exports = {
name: "data-provider-hasura",
hint: "Installs Hasura Data Provider.",
},
- {
- message: "Medusa",
- name: "data-provider-medusa",
- hint: "Installs Medusa Data Provider.",
- },
],
default: "data-provider-custom-json-rest",
},
@@ -80,21 +75,32 @@ module.exports = {
name: "mui",
hint: "Installs Material UI package.",
},
+ ],
+ default: "no",
+ },
+ {
+ name: "antd-example",
+ message: "Do you want to add example pages?:",
+ type: "select",
+ choices: [
{
- message: "Mantine",
- name: "mantine",
- hint: "Installs Mantine package.",
+ message: "No",
+ name: "no",
+ hint: "No examples will be installed.",
},
{
- message: "Chakra UI",
- name: "chakra",
- hint: "Installs Chakra UI package.",
+ message: "Yes (Recommended)",
+ name: "antd-example",
+ hint: "Installs example pages.",
},
],
+ skip: ({ answers }) =>
+ answers["ui-framework"] !== "antd" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
- name: "inferencer",
+ name: "mui-example",
message: "Do you want to add example pages?:",
type: "select",
choices: [
@@ -105,19 +111,17 @@ module.exports = {
},
{
message: "Yes (Recommended)",
- name: "inferencer",
+ name: "mui-example",
hint: "Installs example pages.",
},
],
skip: ({ answers }) =>
- answers["ui-framework"] === "no" ||
- answers["data-provider"] === "data-provider-graphql" ||
- answers["data-provider"] === "data-provider-medusa" ||
- answers["data-provider"] === "data-provider-nestjs-query",
+ answers["ui-framework"] !== "mui" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
- name: "inferencer-headless",
+ name: "headless-example",
message: "Do you want to add example pages?:",
type: "select",
choices: [
@@ -128,15 +132,14 @@ module.exports = {
},
{
message: "Yes (Recommended)",
- name: "inferencer-headless",
+ name: "headless-example",
hint: "Installs example pages.",
},
],
skip: ({ answers }) =>
- answers["ui-framework"] !== "no" ||
- answers["data-provider"] === "data-provider-graphql" ||
- answers["data-provider"] === "data-provider-medusa" ||
- answers["data-provider"] === "data-provider-nestjs-query",
+ answers["ui-framework"] === "antd" ||
+ answers["ui-framework"] === "mui" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
@@ -174,7 +177,6 @@ module.exports = {
answers["data-provider"] === "data-provider-supabase" ||
answers["data-provider"] === "data-provider-strapi-v4" ||
answers["data-provider"] === "data-provider-appwrite" ||
- answers["data-provider"] === "data-provider-medusa" ||
answers["data-provider"] === "data-provider-nhost",
default: "none",
},
@@ -209,5 +211,27 @@ module.exports = {
"app/global.css",
],
},
+ {
+ plugin: ["data-provider-hasura"],
+ when: function (answers) {
+ return [
+ "headless-example",
+ "antd-example",
+ "mui-example",
+ ].every((item) => answers[item] === "no");
+ },
+ pattern: ["app/queries/blog-posts.ts", "app/queries/categories.ts"],
+ },
+ {
+ plugin: ["data-provider-nestjs-query"],
+ when: function (answers) {
+ return [
+ "headless-example",
+ "antd-example",
+ "mui-example",
+ ].every((item) => answers[item] === "no");
+ },
+ pattern: ["app/queries/blog-posts.ts", "app/queries/categories.ts"],
+ },
],
};
diff --git a/refine-remix/template/_package.json b/refine-remix/template/_package.json
index be0f7a0d5..a12a61f51 100644
--- a/refine-remix/template/_package.json
+++ b/refine-remix/template/_package.json
@@ -11,11 +11,10 @@
},
"dependencies": {
"@refinedev/cli": "^2.16.22",
- "@refinedev/core": "^4.46.2",
- "@refinedev/devtools": "^1.1.30",
+ "@refinedev/core": "^4.47.1",
+ "@refinedev/devtools": "^1.1.32",
"@refinedev/remix-router": "^3.0.0",
- "@refinedev/inferencer": "^4.5.17",
- "@refinedev/kbar": "^1.3.5",
+ "@refinedev/kbar": "^1.3.6",
"@remix-run/node": "^2.4.1",
"@remix-run/react": "^2.4.1",
"@remix-run/serve": "^2.4.1",
diff --git a/refine-remix/template/app/root.tsx b/refine-remix/template/app/root.tsx
index cd62402d0..9540614aa 100644
--- a/refine-remix/template/app/root.tsx
+++ b/refine-remix/template/app/root.tsx
@@ -17,12 +17,6 @@ import { DevtoolsPanel, DevtoolsProvider } from "@refinedev/devtools";
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { <%- (_app.refineMuiImports || []).join("\n,") _%> } from '@refinedev/mui';
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { <%- (_app.refineMantineImports || []).join("\n,") _%> } from '@refinedev/mantine';
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { <%- (_app.refineChakraImports || []).join("\n,") _%> } from '@refinedev/chakra-ui';
-<%_ } _%>
import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
import routerProvider, { UnsavedChangesNotifier } from "@refinedev/remix-router";
@@ -66,7 +60,7 @@ export default function App() {
- <%_ if (answers["inferencer"] === 'inferencer' || answers["inferencer-headless"] === 'inferencer-headless') { _%>
+ <%_ if (_app.hasRoutes === true) { _%>
resources={[
<%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
{
diff --git a/refine-vite/plugins/_base/extend.js b/refine-vite/plugins/_base/extend.js
index df2180cb9..768f58fae 100644
--- a/refine-vite/plugins/_base/extend.js
+++ b/refine-vite/plugins/_base/extend.js
@@ -11,20 +11,23 @@ const base = {
localImport: [],
refineImports: [`Authenticated`],
refineAntdImports: [],
- refineChakraImports: [],
refineMuiImports: [],
- refineMantineImports: [],
},
selectedTheme: "Blue",
selectedTitle: undefined,
selectedSvg: undefined,
+ isGraphQL: false,
+ blogPostCategoryFieldName: "category",
+ blogPostCategoryTableField: `"category"`,
+ blogPostCategoryIdFormField: `["category", "id"]`,
+ blogPostStatusOptions: [],
+ blogPostStatusDefaultValue: `"draft"`,
};
module.exports = {
extend(answers) {
const uiFramework = answers["ui-framework"];
const dataProvider = answers["data-provider"];
- const inferencer = answers["inferencer"];
switch (uiFramework) {
case "antd":
@@ -36,24 +39,16 @@ module.exports = {
case "mui":
base._app.refineMuiImports.push([`AuthPage`, `ErrorComponent`]);
break;
- case "mantine":
- base._app.refineMantineImports.push([
- `AuthPage`,
- `ErrorComponent`,
- ]);
- break;
- case "chakra":
- base._app.refineChakraImports.push([
- `AuthPage`,
- `ErrorComponent`,
- ]);
- break;
default:
base._app.refineImports.push([`AuthPage`, `ErrorComponent`]);
break;
}
- if (inferencer === "no" && answers["inferencer-headless"] === "no") {
+ if (
+ ["headless-example", "antd-example", "mui-example"].every(
+ (item) => answers[item] === "no",
+ )
+ ) {
base._app.hasRoutes = false;
}
@@ -97,8 +92,8 @@ module.exports = {
defaultValues = `email: "info@refine.dev", password: "refine-supabase"`;
}
- // mui || chakra
- if (uiFramework === "mui" || uiFramework === "chakra") {
+ // mui
+ if (uiFramework === "mui") {
defaultValuePropsName = "defaultValues";
}
@@ -137,10 +132,7 @@ module.exports = {
if (base._app.isAuthRoutes || base._app.isNoAuthRoutes) {
// ignore this data providers
if (
- ![
- "data-provider-graphql",
- "data-provider-medusa",
- ].includes(dataProvider) &&
+ !["data-provider-graphql"].includes(dataProvider) &&
base._app.hasRoutes === true
) {
base._app.localImport.push(
@@ -175,15 +167,10 @@ module.exports = {
if (answers["ui-framework"] === "antd") {
base._app.refineAntdImports.push("ThemedTitleV2");
}
- if (answers["ui-framework"] === "mantine") {
- base._app.refineMantineImports.push("ThemedTitleV2");
- }
+
if (answers["ui-framework"] === "mui") {
base._app.refineMuiImports.push("ThemedTitleV2");
}
- if (answers["ui-framework"] === "chakra") {
- base._app.refineChakraImports.push("ThemedTitleV2");
- }
}
if (
@@ -202,6 +189,81 @@ module.exports = {
base._app.localImport.push(`import "./App.css";`);
}
+ // ## isGraphQL
+ if (
+ ["data-provider-hasura", "data-provider-nestjs-query"].includes(
+ dataProvider,
+ )
+ ) {
+ base.isGraphQL = true;
+ }
+
+ // ## blogPostCategoryFieldName
+ if (dataProvider === "data-provider-supabase") {
+ base.blogPostCategoryFieldName = "categories";
+ } else {
+ base.blogPostCategoryFieldName = "category";
+ }
+
+ // ## blogPostCategoryIdFormField
+ if (dataProvider === "data-provider-hasura") {
+ base.blogPostCategoryIdFormField = `"category_id"`;
+ } else if (dataProvider === "data-provider-nestjs-query") {
+ base.blogPostCategoryIdFormField = `"categoryId"`;
+ } else if (dataProvider === "data-provider-supabase") {
+ base.blogPostCategoryIdFormField = `"categoryId"`;
+ } else {
+ if (uiFramework === "mui" || uiFramework === "no") {
+ base.blogPostCategoryIdFormField = `"category.id"`;
+ } else {
+ base.blogPostCategoryIdFormField = `["category", "id"]`;
+ }
+ }
+
+ // ## blogPostCategoryTableField
+ if (base.isGraphQL) {
+ if (uiFramework === "no") {
+ base.blogPostCategoryTableField = `"category.title"`;
+ }
+ if (uiFramework === "antd") {
+ base.blogPostCategoryTableField = `['category', 'title']`;
+ }
+ if (uiFramework === "mui") {
+ base.blogPostCategoryTableField = `"category"`;
+ }
+ } else {
+ if (dataProvider === "data-provider-supabase") {
+ base.blogPostCategoryTableField = `"categories"`;
+ } else {
+ base.blogPostCategoryTableField = `"category"`;
+ }
+ }
+
+ // ## blogPostStatusOptions
+ if (dataProvider === "data-provider-nestjs-query") {
+ base.blogPostStatusOptions = JSON.stringify([
+ { value: "DRAFT", label: "Draft" },
+ { value: "PUBLISHED", label: "Published" },
+ { value: "REJECTED", label: "Rejected" },
+ ]);
+ } else {
+ base.blogPostStatusOptions = JSON.stringify([
+ { value: "draft", label: "Draft" },
+ { value: "published", label: "Published" },
+ { value: "rejected", label: "Rejected" },
+ ]);
+ }
+ if (uiFramework === "no" || uiFramework === "mui") {
+ base.blogPostStatusOptions = JSON.parse(base.blogPostStatusOptions);
+ }
+
+ // ## blogPostStatusDefaultValue
+ if (dataProvider === "data-provider-nestjs-query") {
+ base.blogPostStatusDefaultValue = `"DRAFT"`;
+ } else {
+ base.blogPostStatusDefaultValue = `"draft"`;
+ }
+
// ## localImport
return base;
},
diff --git a/refine-vite/plugins/_base/public/images/flags/de.svg b/refine-vite/plugins/_base/public/images/flags/de.svg
deleted file mode 100644
index 949404e5b..000000000
--- a/refine-vite/plugins/_base/public/images/flags/de.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/refine-vite/plugins/_base/public/images/flags/en.svg b/refine-vite/plugins/_base/public/images/flags/en.svg
deleted file mode 100644
index 76b105652..000000000
--- a/refine-vite/plugins/_base/public/images/flags/en.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/refine-vite/plugins/_base/public/locales/de/common.json b/refine-vite/plugins/_base/public/locales/de/common.json
deleted file mode 100644
index ee59c3d39..000000000
--- a/refine-vite/plugins/_base/public/locales/de/common.json
+++ /dev/null
@@ -1,204 +0,0 @@
-{
- "pages": {
- "login": {
- "title": "Melden Sie sich bei Ihrem Konto an",
- "signin": "Einloggen",
- "signup": "Anmelden",
- "divider": "oder",
- "fields": {
- "email": "Email",
- "password": "Passwort"
- },
- "errors": {
- "validEmail": "Ungültige E-Mail-Adresse"
- },
- "buttons": {
- "submit": "Anmeldung",
- "forgotPassword": "Passwort vergessen?",
- "noAccount": "Sie haben kein Konto?",
- "rememberMe": "Erinnere dich an mich"
- }
- },
- "forgotPassword": {
- "title": "Haben Sie Ihr Passwort vergessen?",
- "fields": {
- "email": "Email"
- },
- "errors": {
- "validEmail": "Ungültige E-Mail-Adresse"
- },
- "buttons": {
- "submit": "Anweisungen zum Zurücksetzen senden"
- }
- },
- "register": {
- "title": "Registrieren Sie sich für Ihr Konto",
- "fields": {
- "email": "Email",
- "password": "Passwort"
- },
- "errors": {
- "validEmail": "Ungültige E-Mail-Adresse"
- },
- "buttons": {
- "submit": "Registrieren",
- "haveAccount": "Ein Konto haben?"
- }
- },
- "updatePassword": {
- "title": "Kennwort aktualisieren",
- "fields": {
- "password": "Neues Passwort",
- "confirmPassword": "Bestätige neues Passwort"
- },
- "errors": {
- "confirmPasswordNotMatch": "Passwörter stimmen nicht überein"
- },
- "buttons": {
- "submit": "Aktualisieren"
- }
- },
- "error": {
- "info": "Sie haben vergessen, {{action}} component zu {{resource}} hinzufügen.",
- "404": "Leider existiert diese Seite nicht.",
- "resource404": "Haben Sie die {{resource}} resource erstellt?",
- "backHome": "Zurück"
- }
- },
- "actions": {
- "list": "Aufführen",
- "create": "Erstellen",
- "edit": "Bearbeiten",
- "show": "Zeigen"
- },
- "buttons": {
- "create": "Erstellen",
- "save": "Speichern",
- "logout": "Abmelden",
- "delete": "Löschen",
- "edit": "Bearbeiten",
- "cancel": "Abbrechen",
- "confirm": "Sicher?",
- "filter": "Filter",
- "clear": "Löschen",
- "refresh": "Erneuern",
- "show": "Zeigen",
- "undo": "Undo",
- "import": "Importieren",
- "clone": "Klon",
- "notAccessTitle": "Sie haben keine zugriffsberechtigung"
- },
- "warnWhenUnsavedChanges": "Nicht gespeicherte Änderungen werden nicht übernommen.",
- "notifications": {
- "success": "Erfolg",
- "error": "Fehler (status code: {{statusCode}})",
- "undoable": "Sie haben {{seconds}} Sekunden Zeit für Undo.",
- "createSuccess": "{{resource}} erfolgreich erstellt.",
- "createError": "Fehler beim Erstellen {{resource}} (status code: {{statusCode}})",
- "deleteSuccess": "{{resource}} erfolgreich gelöscht.",
- "deleteError": "Fehler beim Löschen {{resource}} (status code: {{statusCode}})",
- "editSuccess": "{{resource}} erfolgreich bearbeitet.",
- "editError": "Fehler beim Bearbeiten {{resource}} (status code: {{statusCode}})",
- "importProgress": "{{processed}}/{{total}} importiert"
- },
- "loading": "Wird geladen",
- "tags": {
- "clone": "Klon"
- },
- "dashboard": {
- "title": "Dashboard"
- },
- <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
- "blog-posts": {
- "blog-posts": "Blogbeiträge",
- <%_ } else { _%>
- "blog_posts": {
- "blog_posts": "Blogbeiträge",
- <%_ } _%>
- "fields": {
- "id": "Id",
- "title": "Titel",
- "content": "Inhalt",
- "status": "Status",
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-supabase" || answers["data-provider"] === "data-provider-hasura") { _%>
- "created_at": "Erstellt am",
- <%_ } else { _%>
- "createdAt": "Erstellt am",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-nestjsx-crud") { _%>
- "updatedAt": "Aktualisiert am",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-supabase" || answers["data-provider"] === "data-provider-appwrite") { _%>
- "categoryId": "Kategorien"
- <%_ } else if (answers["data-provider"] === "data-provider-hasura") { _%>
- "category_id": "Kategorien",
- "category": "Kategorien"
- <%_ } else { _%>
- "category": "Kategorien"
- <%_ } _%>
- },
- "titles": {
- "create": "Erstellen",
- "edit": "Bearbeiten",
- "list": "Einträge",
- "show": "Eintrag zeigen"
- }
- },
- "categories": {
- "categories": "Kategorien",
- "fields": {
- "id": "Id",
- "title": "Titel",
- <%_ if (answers["data-provider"] === "data-provider-airtable") { _%>
- "Posts": "Einträge",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-nestjsx-crud") { _%>
- "updatedAt": "Aktualisiert am",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-supabase" || answers["data-provider"] === "data-provider-hasura") { _%>
- "created_at": "Erstellt am"
- <%_ } else { _%>
- "createdAt": "Erstellt am"
- <%_ } _%>
- },
- "titles": {
- "create": "Erstellen",
- "edit": "Bearbeiten",
- "list": "Einträge",
- "show": "Eintrag zeigen"
- }
- },
- "documentTitle": {
- "default": "refine",
- "suffix": " | refine",
- <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
- "blog-posts": {
- <%_ } else { _%>
- "blog_posts": {
- <%_ } _%>
- "list": "Blogbeiträge | refine",
- "show": "#{{id}} Show Blogeintrag | refine",
- "edit": "#{{id}} Edit Blogeintrag | refine",
- "create": "Create new Blogeintrag | refine",
- "clone": "#{{id}} Clone Blogeintrag | refine"
- },
- "categories": {
- "list": "Kategorien | refine",
- "show": "#{{id}} Zeigen Kategorien | refine",
- "edit": "#{{id}} Bearbeiten Kategorien | refine",
- "create": "Neue Kategorie Erstellen | refine",
- "clone": "#{{id}} Klon Kategorie | refine"
- }
- },
- "table": {
- "actions": "Aktionen"
- <%_ if (answers["ui-framework"] === "no") { _%>
- },
- "pagination": {
- "go": "Gehen Sie zur Seite",
- "show": "Zeigen"
- }
- <%_ } else { _%>
- }
- <%_ } _%>
-}
diff --git a/refine-vite/plugins/_base/public/locales/en/common.json b/refine-vite/plugins/_base/public/locales/en/common.json
deleted file mode 100644
index 744a4a6b2..000000000
--- a/refine-vite/plugins/_base/public/locales/en/common.json
+++ /dev/null
@@ -1,205 +0,0 @@
-{
- "pages": {
- "login": {
- "title": "Sign in to your account",
- "signin": "Sign in",
- "signup": "Sign up",
- "divider": "or",
- "fields": {
- "email": "Email",
- "password": "Password"
- },
- "errors": {
- "validEmail": "Invalid email address"
- },
- "buttons": {
- "submit": "Login",
- "forgotPassword": "Forgot password?",
- "noAccount": "Don’t have an account?",
- "rememberMe": "Remember me"
- }
- },
- "forgotPassword": {
- "title": "Forgot your password?",
- "fields": {
- "email": "Email"
- },
- "errors": {
- "validEmail": "Invalid email address"
- },
- "buttons": {
- "submit": "Send reset instructions"
- }
- },
- "register": {
- "title": "Sign up for your account",
- "fields": {
- "email": "Email",
- "password": "Password"
- },
- "errors": {
- "validEmail": "Invalid email address"
- },
- "buttons": {
- "submit": "Register",
- "haveAccount": "Have an account?"
- }
- },
- "updatePassword": {
- "title": "Update password",
- "fields": {
- "password": "New Password",
- "confirmPassword": "Confirm new password"
- },
- "errors": {
- "confirmPasswordNotMatch": "Passwords do not match"
- },
- "buttons": {
- "submit": "Update"
- }
- },
- "error": {
- "info": "You may have forgotten to add the {{action}} component to {{resource}} resource.",
- "404": "Sorry, the page you visited does not exist.",
- "resource404": "Are you sure you have created the {{resource}} resource.",
- "backHome": "Back Home"
- }
- },
- "actions": {
- "list": "List",
- "create": "Create",
- "edit": "Edit",
- "show": "Show"
- },
- "buttons": {
- "create": "Create",
- "save": "Save",
- "logout": "Logout",
- "delete": "Delete",
- "edit": "Edit",
- "cancel": "Cancel",
- "confirm": "Are you sure?",
- "filter": "Filter",
- "clear": "Clear",
- "refresh": "Refresh",
- "show": "Show",
- "undo": "Undo",
- "import": "Import",
- "clone": "Clone",
- "notAccessTitle": "You don't have permission to access"
- },
- "warnWhenUnsavedChanges": "Are you sure you want to leave? You have unsaved changes.",
- "notifications": {
- "success": "Successful",
- "error": "Error (status code: {{statusCode}})",
- "undoable": "You have {{seconds}} seconds to undo",
- "createSuccess": "Successfully created {{resource}}",
- "createError": "There was an error creating {{resource}} (status code: {{statusCode}})",
- "deleteSuccess": "Successfully deleted {{resource}}",
- "deleteError": "Error when deleting {{resource}} (status code: {{statusCode}})",
- "editSuccess": "Successfully edited {{resource}}",
- "editError": "Error when editing {{resource}} (status code: {{statusCode}})",
- "importProgress": "Importing: {{processed}}/{{total}}"
- },
- "loading": "Loading",
- "tags": {
- "clone": "Clone"
- },
- "dashboard": {
- "title": "Dashboard"
- },
- <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
- "blog-posts": {
- "blog-posts": "Blog Posts",
- <%_ } else { _%>
- "blog_posts": {
- "blog_posts": "Blog Posts",
- <%_ } _%>
- "fields": {
- "id": "Id",
- "title": "Title",
- "content": "Content",
- "status": "Status",
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-supabase" || answers["data-provider"] === "data-provider-hasura") { _%>
- "created_at": "Created At",
- <%_ } else { _%>
- "createdAt": "Created At",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-nestjsx-crud") { _%>
- "updatedAt": "Updated At",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-supabase" || answers["data-provider"] === "data-provider-appwrite") { _%>
- "categoryId": "Category"
- <%_ } else if (answers["data-provider"] === "data-provider-hasura") { _%>
- "category_id": "Category",
- "category": "Category"
- <%_ } else { _%>
- "category": "Category"
- <%_ } _%>
- },
- "titles": {
- "create": "Create Blog Post",
- "edit": "Edit Blog Post",
- "list": "Blog Posts",
- "show": "Show Blog Post"
- }
- },
- "categories": {
- "categories": "Categories",
- "fields": {
- "id": "Id",
- "title": "Title",
- <%_ if (answers["data-provider"] === "data-provider-airtable") { _%>
- "Posts": "Posts",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-nestjsx-crud") { _%>
- "updatedAt": "Updated At",
- <%_ } _%>
- <%_ if (answers["data-provider"] === "data-provider-appwrite" || answers["data-provider"] === "data-provider-supabase" || answers["data-provider"] === "data-provider-hasura") { _%>
- "created_at": "Created At"
- <%_ } else { _%>
- "createdAt": "Created At"
- <%_ } _%>
- },
- "titles": {
- "create": "Create Category",
- "edit": "Edit Category",
- "list": "Categories",
- "show": "Show Category"
- }
- },
- "documentTitle": {
- "default": "refine",
- "suffix": " | refine",
- <%_ if (answers["data-provider"] === 'data-provider-strapi-v4') { _%>
- "blog-posts": {
- <%_ } else { _%>
- "blog_posts": {
- <%_ } _%>
- "list": "Blog Posts | refine",
- "show": "#{{id}} Show Blog Post | refine",
- "edit": "#{{id}} Edit Blog Post | refine",
- "create": "Create new Blog Post | refine",
- "clone": "#{{id}} Clone Blog Post | refine"
- },
- "categories": {
- "list": "Categories | refine",
- "show": "#{{id}} Show Category | refine",
- "edit": "#{{id}} Edit Category | refine",
- "create": "Create new Category | refine",
- "clone": "#{{id}} Clone Category | refine"
- }
-
- },
- "table": {
- "actions": "Actions"
- <%_ if (answers["ui-framework"] === "no") { _%>
- },
- "pagination": {
- "go": "Go to Page",
- "show": "Show"
- }
- <%_ } else { _%>
- }
- <%_ } _%>
-}
diff --git a/refine-vite/plugins/antd-example/package.json b/refine-vite/plugins/antd-example/package.json
new file mode 100644
index 000000000..e56fe1a64
--- /dev/null
+++ b/refine-vite/plugins/antd-example/package.json
@@ -0,0 +1,5 @@
+{
+ "dependencies": {
+ "@uiw/react-md-editor": "^3.19.5"
+ }
+}
diff --git a/refine-vite/plugins/antd-example/src/pages/blog-posts/create.tsx b/refine-vite/plugins/antd-example/src/pages/blog-posts/create.tsx
new file mode 100644
index 000000000..fd13da3ef
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/blog-posts/create.tsx
@@ -0,0 +1,97 @@
+import { Create, useForm, useSelect } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import MDEditor from "@uiw/react-md-editor";
+import { Form, Input, Select } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_CREATE_MUTATION, CATEGORIES_SELECT_QUERY } from './queries'
+<%_ } _%>
+
+export const BlogPostCreate: React.FC = () => {
+ const { formProps, saveButtonProps } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: POST_CREATE_MUTATION,
+ },
+<%_ } _%>
+ });
+
+
+ const { selectProps: categorySelectProps } = useSelect({
+ resource: "categories",
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd-example/src/pages/blog-posts/edit.tsx b/refine-vite/plugins/antd-example/src/pages/blog-posts/edit.tsx
new file mode 100644
index 000000000..db7a62a25
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/blog-posts/edit.tsx
@@ -0,0 +1,114 @@
+import { Edit, useForm, useSelect } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import MDEditor from "@uiw/react-md-editor";
+import { Form, Input, Select } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_EDIT_MUTATION, CATEGORIES_SELECT_QUERY } from './queries'
+<%_ } _%>
+
+export const BlogPostEdit: React.FC = () => {
+ const { formProps, saveButtonProps, queryResult, formLoading } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: POST_EDIT_MUTATION,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+
+ const blogPostsData = queryResult?.data?.data;
+
+ const { selectProps: categorySelectProps } = useSelect({
+ resource: "categories",
+ defaultValue: blogPostsData?.<%- blogPostCategoryFieldName %>?.id,
+ queryOptions: {
+ enabled: !!blogPostsData?.<%- blogPostCategoryFieldName %>?.id,
+ },
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd-example/src/pages/blog-posts/index.ts b/refine-vite/plugins/antd-example/src/pages/blog-posts/index.ts
new file mode 100644
index 000000000..59ff01780
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/blog-posts/index.ts
@@ -0,0 +1,4 @@
+export * from "./create";
+export * from "./edit";
+export * from "./list";
+export * from "./show";
diff --git a/refine-vite/plugins/antd-example/src/pages/blog-posts/list.tsx b/refine-vite/plugins/antd-example/src/pages/blog-posts/list.tsx
new file mode 100644
index 000000000..fc451ebed
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/blog-posts/list.tsx
@@ -0,0 +1,120 @@
+import {
+ DateField,
+ DeleteButton,
+ EditButton,
+ List,
+ MarkdownField,
+ ShowButton,
+ useTable,
+} from "@refinedev/antd";
+import { BaseRecord, IResourceComponentsProps, useMany } from "@refinedev/core";
+import { Space, Table } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+import { BLOG_POSTS_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POSTS_LIST_QUERY } from './queries'
+<%_ } _%>
+
+export const BlogPostList: React.FC = () => {
+ const { tableProps } = useTable({
+ syncWithLocation: true,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: POSTS_LIST_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData, isLoading: categoryIsLoading } = useMany({
+ resource: "categories",
+ ids: tableProps?.dataSource?.map((item) => item?.<%- blogPostCategoryFieldName %>?.id).filter(Boolean) ?? [],
+ queryOptions: {
+ enabled: !!tableProps?.dataSource,
+ },
+ })
+<%_ } _%>
+
+
+ return (
+
+
+
+
+ {
+ if (!value) return '-'
+ return
+ }}
+ />
+ }
+ title={"Category"}
+ <%_ if (!isGraphQL) { _%>
+ render={(value) =>
+ categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ categoryData?.data?.find(
+ (item) => item.id === value?.id,
+ )?.title
+ )
+ }
+ <%_ } _%>
+ />
+
+
+ dataIndex={["created_at"]}
+<%_ } else { _%>
+ dataIndex={["createdAt"]}
+<%_ } _%>
+ title={"Created at"}
+ render={(value: any) => }
+ />
+ (
+
+
+
+
+
+ )}
+ />
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd-example/src/pages/blog-posts/show.tsx b/refine-vite/plugins/antd-example/src/pages/blog-posts/show.tsx
new file mode 100644
index 000000000..b484b7445
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/blog-posts/show.tsx
@@ -0,0 +1,82 @@
+import {
+ DateField,
+ MarkdownField,
+ NumberField,
+ Show,
+ TextField,
+} from "@refinedev/antd";
+import { IResourceComponentsProps, useOne, useShow } from "@refinedev/core";
+import { Typography } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_SHOW_QUERY } from './queries'
+<%_ } _%>
+
+const { Title } = Typography;
+
+export const BlogPostShow: React.FC = () => {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: POST_SHOW_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData, isLoading: categoryIsLoading } = useOne({
+ resource: "categories",
+ id: record?.<%- blogPostCategoryFieldName %>?.id || "",
+ queryOptions: {
+ enabled: !!record,
+ },
+ });
+<%_ } _%>
+
+
+ return (
+
+ {"ID"}
+
+ {"Title"}
+
+ {"Content"}
+
+ {"Category"}
+<%_ if (isGraphQL) { _%>
+ ?.title} />
+<%_ } else { _%>
+ Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )} />
+<%_ } _%>
+ {"Status"}
+
+ {"CreatedAt"}
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd-example/src/pages/categories/create.tsx b/refine-vite/plugins/antd-example/src/pages/categories/create.tsx
new file mode 100644
index 000000000..834d71253
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/categories/create.tsx
@@ -0,0 +1,43 @@
+import { Create, useForm } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Form, Input } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_CREATE_MUTATION } from './queries'
+<%_ } _%>
+
+export const CategoryCreate: React.FC = () => {
+ const { formProps, saveButtonProps } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: CATEGORY_CREATE_MUTATION,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd-example/src/pages/categories/edit.tsx b/refine-vite/plugins/antd-example/src/pages/categories/edit.tsx
new file mode 100644
index 000000000..3894f821e
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/categories/edit.tsx
@@ -0,0 +1,44 @@
+import { Edit, useForm } from "@refinedev/antd";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Form, Input } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_EDIT_MUTATION } from './queries'
+<%_ } _%>
+
+
+export const CategoryEdit: React.FC = () => {
+ const { formProps, saveButtonProps } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlMutation: CATEGORY_EDIT_MUTATION,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd-example/src/pages/categories/index.ts b/refine-vite/plugins/antd-example/src/pages/categories/index.ts
new file mode 100644
index 000000000..59ff01780
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/categories/index.ts
@@ -0,0 +1,4 @@
+export * from "./create";
+export * from "./edit";
+export * from "./list";
+export * from "./show";
diff --git a/refine-vite/plugins/antd-example/src/pages/categories/list.tsx b/refine-vite/plugins/antd-example/src/pages/categories/list.tsx
new file mode 100644
index 000000000..d40058f6b
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/categories/list.tsx
@@ -0,0 +1,65 @@
+import {
+ DeleteButton,
+ EditButton,
+ List,
+ ShowButton,
+ useTable,
+} from "@refinedev/antd";
+import { BaseRecord, IResourceComponentsProps } from "@refinedev/core";
+import { Space, Table } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORIES_LIST_QUERY } from './queries'
+<%_ } _%>
+
+
+export const CategoryList: React.FC = () => {
+ const { tableProps } = useTable({
+ syncWithLocation: true,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+ (
+
+
+
+
+
+ )}
+ />
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd-example/src/pages/categories/show.tsx b/refine-vite/plugins/antd-example/src/pages/categories/show.tsx
new file mode 100644
index 000000000..64648c52d
--- /dev/null
+++ b/refine-vite/plugins/antd-example/src/pages/categories/show.tsx
@@ -0,0 +1,39 @@
+import { NumberField, Show, TextField } from "@refinedev/antd";
+import { IResourceComponentsProps, useShow } from "@refinedev/core";
+import { Typography } from "antd";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_SHOW_QUERY } from './queries'
+<%_ } _%>
+
+const { Title } = Typography;
+
+export const CategoryShow: React.FC = () => {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORY_SHOW_QUERY,
+ },
+<%_ } _%>
+ });
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+ return (
+
+ {"ID"}
+
+ {"Title"}
+
+
+ );
+};
diff --git a/refine-vite/plugins/antd/package.json b/refine-vite/plugins/antd/package.json
index a490611f5..167139382 100644
--- a/refine-vite/plugins/antd/package.json
+++ b/refine-vite/plugins/antd/package.json
@@ -1,7 +1,7 @@
{
- "dependencies": {
- "@refinedev/antd": "^5.37.1",
- "antd": "^5.0.5",
- "@ant-design/icons": "^5.0.1"
- }
+ "dependencies": {
+ "@refinedev/antd": "^5.37.4",
+ "antd": "^5.0.5",
+ "@ant-design/icons": "^5.0.1"
+ }
}
diff --git a/refine-vite/plugins/auth-provider-auth0/src/pages/login.tsx b/refine-vite/plugins/auth-provider-auth0/src/pages/login.tsx
index be26738c0..c1e7d62fa 100644
--- a/refine-vite/plugins/auth-provider-auth0/src/pages/login.tsx
+++ b/refine-vite/plugins/auth-provider-auth0/src/pages/login.tsx
@@ -1,6 +1,3 @@
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import { useTranslate } from "@refinedev/core";
-<%_ } _%>
<%_ if (answers["ui-framework"] === "antd") { _%>
import { ThemedTitleV2 } from "@refinedev/antd";
import { Button, Typography, Layout, Space } from "antd";
@@ -12,14 +9,7 @@ import Container from "@mui/material/Container";
import Typography from "@mui/material/Typography";
import { ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
+
import { useAuth0 } from "@auth0/auth0-react";
@@ -30,10 +20,6 @@ import { AppIcon } from "../components/app-icon";
export const Login: React.FC = () => {
const { loginWithRedirect } = useAuth0();
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const t = useTranslate();
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "antd") { _%>
return (
{
size="middle"
onClick={() => loginWithRedirect()}
>
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- {t("pages.login.signin", "Sign in")}
- <%_ } else { _%>
- Sign in
- <%_ } _%>
+ Sign in
Powered by
@@ -114,11 +96,7 @@ export const Login: React.FC = () => {
/>
Powered by
@@ -134,104 +112,6 @@ export const Login: React.FC = () => {
);
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
- Powered by
-
- Auth0
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Auth0
-
-
-
- );
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "no") { _%>
return(
{
}}
>
Powered by
diff --git a/refine-vite/plugins/auth-provider-custom/extend.js b/refine-vite/plugins/auth-provider-custom/extend.js
index fdccbc699..68eef8cb3 100644
--- a/refine-vite/plugins/auth-provider-custom/extend.js
+++ b/refine-vite/plugins/auth-provider-custom/extend.js
@@ -4,9 +4,7 @@ const base = {
refineProps: ["authProvider={authProvider}"],
refineImports: [`Authenticated`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
- refineChakraImports: [],
localImport: [
`import { Login } from "./pages/login";`,
`import { Register } from "./pages/register";`,
diff --git a/refine-vite/plugins/auth-provider-custom/src/pages/forgotPassword/index.tsx b/refine-vite/plugins/auth-provider-custom/src/pages/forgotPassword/index.tsx
index 559585989..3becfc16e 100644
--- a/refine-vite/plugins/auth-provider-custom/src/pages/forgotPassword/index.tsx
+++ b/refine-vite/plugins/auth-provider-custom/src/pages/forgotPassword/index.tsx
@@ -17,22 +17,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (selectedSvg && answers["ui-framework"] !== "no") { _%>
import { AppIcon } from "../../components/app-icon";
<%_ } _%>
diff --git a/refine-vite/plugins/auth-provider-custom/src/pages/login/index.tsx b/refine-vite/plugins/auth-provider-custom/src/pages/login/index.tsx
index 9682f617c..44c2e8d2d 100644
--- a/refine-vite/plugins/auth-provider-custom/src/pages/login/index.tsx
+++ b/refine-vite/plugins/auth-provider-custom/src/pages/login/index.tsx
@@ -17,22 +17,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (selectedSvg && answers["ui-framework"] !== "no") { _%>
import { AppIcon } from "../../components/app-icon";
<%_ } _%>
diff --git a/refine-vite/plugins/auth-provider-custom/src/pages/register/index.tsx b/refine-vite/plugins/auth-provider-custom/src/pages/register/index.tsx
index 3a01294ed..e6266c642 100644
--- a/refine-vite/plugins/auth-provider-custom/src/pages/register/index.tsx
+++ b/refine-vite/plugins/auth-provider-custom/src/pages/register/index.tsx
@@ -17,22 +17,6 @@ import {
<%_ } _%>
} from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import {
- AuthPage,
- <%_ if (selectedSvg || selectedTitle) { _%>
- ThemedTitleV2,
- <%_ } _%>
-} from "@refinedev/chakra-ui";
-<%_ } _%>
<%_ if (selectedSvg && answers["ui-framework"] !== "no") { _%>
import { AppIcon } from "../../components/app-icon";
<%_ } _%>
diff --git a/refine-vite/plugins/auth-provider-google/src/pages/login.tsx b/refine-vite/plugins/auth-provider-google/src/pages/login.tsx
index 884a5db2b..824b1d349 100644
--- a/refine-vite/plugins/auth-provider-google/src/pages/login.tsx
+++ b/refine-vite/plugins/auth-provider-google/src/pages/login.tsx
@@ -12,14 +12,6 @@ import Container from "@mui/material/Container";
import Typography from "@mui/material/Typography";
import { ThemedTitleV2 } from "@refinedev/mui";
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
import { CredentialResponse } from "../interfaces/google";
@@ -153,88 +145,6 @@ export const Login: React.FC = () => {
);
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
-
- Powered by
-
- Google
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Google
-
-
-
- );
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "no") { _%>
return(
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
-import { Button, Box, Space, Text } from "@mantine/core";
-import { ThemedTitleV2 } from "@refinedev/mantine";
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
-import { Button, Box, Text, VStack } from "@chakra-ui/react";
-import { ThemedTitleV2 } from "@refinedev/chakra-ui";
-<%_ } _%>
+
<%_ if (selectedSvg && answers["ui-framework"] !== "no" ) { _%>
import { AppIcon } from "../components/app-icon";
<%_ } _%>
@@ -25,10 +18,6 @@ import { AppIcon } from "../components/app-icon";
export const Login: React.FC = () => {
const { mutate: login } = useLogin();
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- const t = useTranslate();
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "antd") { _%>
return (
{
size="middle"
onClick={() => login({})}
>
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
- {t("pages.login.signin", "Sign in")}
- <%_ } else { _%>
- Sign in
- <%_ } _%>
+ Sign in
Powered by
@@ -109,11 +94,7 @@ export const Login: React.FC = () => {
/>
Powered by
@@ -129,104 +110,6 @@ export const Login: React.FC = () => {
);
<%_ } _%>
- <%_ if (answers["ui-framework"] === 'mantine') { _%>
- return (
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
-
- Powered by
-
- Keycloak
-
-
- );
- <%_ } _%>
-
- <%_ if (answers["ui-framework"] === 'chakra') { _%>
- return (
-
-
-
- text="<%= selectedTitle %>"
- <%_ } _%>
- <%_ if (selectedSvg) { _%>
- icon={}
- <%_ } _%>
- />
-
-
-
-
- Powered by
-
- Keycloak
-
-
-
- );
- <%_ } _%>
-
<%_ if (answers["ui-framework"] === "no") { _%>
return(
{
}}
>
Powered by
diff --git a/refine-vite/plugins/chakra/extend.js b/refine-vite/plugins/chakra/extend.js
deleted file mode 100644
index 036fd6f2e..000000000
--- a/refine-vite/plugins/chakra/extend.js
+++ /dev/null
@@ -1,35 +0,0 @@
-const base = {
- _app: {
- refineProps: ["notificationProvider={notificationProvider}"],
- import: [`import { ChakraProvider } from "@chakra-ui/react";`],
- refineChakraImports: [
- "notificationProvider",
- "RefineThemes",
- "ThemedLayoutV2",
- ],
- localImport: [`import { Header } from "./components/header";`],
- },
-};
-
-module.exports = {
- extend(answers) {
- const selectedTheme = answers["theme"] ? answers["theme"] : "Blue";
-
- return {
- ...base,
- _app: {
- ...base._app,
- wrapper: [
- [
- "{/* You can change the theme colors here. example: theme={RefineThemes.Magenta} */}",
- "",
- ],
- [
- ``,
- "",
- ],
- ],
- },
- };
- },
-};
diff --git a/refine-vite/plugins/chakra/meta.json b/refine-vite/plugins/chakra/meta.json
deleted file mode 100644
index 454e96c88..000000000
--- a/refine-vite/plugins/chakra/meta.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "name": "Chakra UI",
- "url": "https://refine.dev/docs/"
-}
diff --git a/refine-vite/plugins/chakra/package.json b/refine-vite/plugins/chakra/package.json
deleted file mode 100644
index 0d6ddc13a..000000000
--- a/refine-vite/plugins/chakra/package.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
- "dependencies": {
- "@refinedev/chakra-ui": "^2.27.1",
- "@refinedev/react-hook-form": "^4.8.13",
- "@refinedev/react-table": "^5.6.5",
- "@tabler/icons": "^1.1.0",
- "@chakra-ui/react": "^2.5.1",
- "react-hook-form": "^7.30.0"
- }
-}
diff --git a/refine-vite/plugins/chakra/src/components/header/index.tsx b/refine-vite/plugins/chakra/src/components/header/index.tsx
deleted file mode 100644
index cff652e1d..000000000
--- a/refine-vite/plugins/chakra/src/components/header/index.tsx
+++ /dev/null
@@ -1,93 +0,0 @@
-import {
- Avatar,
- Box,
- BoxProps,
- HStack,
- Icon,
- IconButton,
- Text,
- useColorMode,
- useColorModeValue,
-} from "@chakra-ui/react";
-import {
- HamburgerMenu,
- RefineThemedLayoutV2HeaderProps,
-} from "@refinedev/chakra-ui";
-import { useGetIdentity } from "@refinedev/core";
-import { IconMoon, IconSun } from "@tabler/icons";
-import React from "react";
-
-type IUser = {
- id: number;
- name: string;
- avatar: string;
-};
-
-export const Header: React.FC = ({
- sticky,
-}) => {
- const { data: user } = useGetIdentity();
-
- const { colorMode, toggleColorMode } = useColorMode();
-
- const bgColor = useColorModeValue(
- "refine.header.bg.light",
- "refine.header.bg.dark",
- );
-
- let stickyProps: BoxProps = {};
- if (sticky) {
- stickyProps = {
- position: "sticky",
- top: 0,
- zIndex: 1,
- };
- }
-
- return (
-
-
-
-
-
-
-
- {(user?.avatar || user?.name) && (
-
- {user?.name && (
-
- {user.name}
-
- )}
-
-
- )}
-
-
- );
-};
diff --git a/refine-vite/plugins/chakra/src/components/index.ts b/refine-vite/plugins/chakra/src/components/index.ts
deleted file mode 100644
index 924cc88d1..000000000
--- a/refine-vite/plugins/chakra/src/components/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { Header } from "./header";
diff --git a/refine-vite/plugins/data-provider-altogic/extend.js b/refine-vite/plugins/data-provider-altogic/extend.js
index ce70856ee..28867c585 100644
--- a/refine-vite/plugins/data-provider-altogic/extend.js
+++ b/refine-vite/plugins/data-provider-altogic/extend.js
@@ -1,21 +1,21 @@
const base = {
- _app: {
- refineImports: [`HttpError`],
- import: [
- `import dataProvider from "@refinedev/altogic";`,
- `import axios from "axios";`,
- ],
- afterImport: [
- "",
- `const API_URL = "https://dev001.na-dev-engine.altogic.com";`,
- `const YOUR_SECRET_API_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbnZJZCI6IjYxMzczZGVkMjQ5NWMzMDAxOTliZTAxNiIsImtleUlkIjoiNjEzNzNlMzYyNDk1YzMwMDE5OWJlMDJkIiwiaWF0IjoxNjMxMDEwMzU4LCJleHAiOjI0OTUwMTAzNTh9.2fL28Bzd97mqfAvcsTrYj1mZ_hqf3WRnr2DOtV3lsc0";`,
- "",
- `const axiosInstance = axios.create();`,
- `axiosInstance.defaults.headers.common = {
+ _app: {
+ refineImports: [`HttpError`],
+ import: [
+ `import dataProvider from "@refinedev/altogic";`,
+ `import axios from "axios";`,
+ ],
+ afterImport: [
+ "",
+ `const API_URL = "https://dev001.na-dev-engine.altogic.com";`,
+ `const YOUR_SECRET_API_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbnZJZCI6IjYxMzczZGVkMjQ5NWMzMDAxOTliZTAxNiIsImtleUlkIjoiNjEzNzNlMzYyNDk1YzMwMDE5OWJlMDJkIiwiaWF0IjoxNjMxMDEwMzU4LCJleHAiOjI0OTUwMTAzNTh9.2fL28Bzd97mqfAvcsTrYj1mZ_hqf3WRnr2DOtV3lsc0";`,
+ "",
+ `const axiosInstance = axios.create();`,
+ `axiosInstance.defaults.headers.common = {
Authorization: YOUR_SECRET_API_KEY
};`,
- "",
- `axiosInstance.interceptors.response.use(
+ "",
+ `axiosInstance.interceptors.response.use(
(response) => {
return response;
},
@@ -29,16 +29,14 @@ const base = {
return Promise.reject(customError);
}
);`,
- ],
- refineProps: ["dataProvider={dataProvider(API_URL, axiosInstance)}"],
- refineAntdImports: [],
- refineMantineImports: [],
- refineMuiImports: [],
- },
+ ],
+ refineProps: ["dataProvider={dataProvider(API_URL, axiosInstance)}"],
+ refineAntdImports: [],
+ refineMuiImports: [],
+ },
};
module.exports = {
- extend() {
-
- return base;
- },
+ extend() {
+ return base;
+ },
};
diff --git a/refine-vite/plugins/data-provider-appwrite/extend.js b/refine-vite/plugins/data-provider-appwrite/extend.js
index 3a7228436..69ef979d7 100644
--- a/refine-vite/plugins/data-provider-appwrite/extend.js
+++ b/refine-vite/plugins/data-provider-appwrite/extend.js
@@ -14,11 +14,8 @@ const base = {
})}`,
`authProvider={authProvider}`,
],
- refineImports: [
- `Authenticated`
- ],
+ refineImports: [`Authenticated`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
},
};
diff --git a/refine-vite/plugins/data-provider-graphql/extend.js b/refine-vite/plugins/data-provider-graphql/extend.js
index df36cfaa9..29f48e75a 100644
--- a/refine-vite/plugins/data-provider-graphql/extend.js
+++ b/refine-vite/plugins/data-provider-graphql/extend.js
@@ -14,8 +14,6 @@ const base = {
refineImports: [],
refineAntdImports: [],
refineMuiImports: [],
- refineMantineImports: [],
- refineChakraImports: [],
},
};
module.exports = {
diff --git a/refine-vite/plugins/data-provider-hasura/src/inferencerPredefinedMeta.ts b/refine-vite/plugins/data-provider-hasura/src/inferencerPredefinedMeta.ts
deleted file mode 100644
index 67f26ed5b..000000000
--- a/refine-vite/plugins/data-provider-hasura/src/inferencerPredefinedMeta.ts
+++ /dev/null
@@ -1,202 +0,0 @@
-import gql from "graphql-tag";
-
-/**
- * This `meta` object is used to define the necessary metadata for inferencer to work with.
- *
- * They will be used to infer the fields of the response of the data provider.
- * Also they will be included in the generated code, making them easily editable after you generate the boilerplate code for your resource.
- */
-export const inferencerPredefinedMeta = {
- blog_posts: {
- getList: {
- gqlQuery: gql`
- query BlogPostsList(
- $offset: Int!
- $limit: Int!
- $order_by: [blog_posts_order_by!]
- $where: blog_posts_bool_exp
- ) {
- blog_posts(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- content
- category_id
- created_at
- status
- category {
- id
- title
- }
- }
- blog_posts_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getOne: {
- gqlQuery: gql`
- query GetBlogPost($id: uuid!) {
- blog_posts_by_pk(id: $id) {
- id
- title
- content
- category_id
- created_at
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- create: {
- foo: "bar",
- objFoo: {
- bar: "baz",
- },
- gqlMutation: gql`
- mutation CreateBlogPosts($object: blog_posts_insert_input!) {
- insert_blog_posts_one(object: $object) {
- id
- title
- content
- created_at
- category_id
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- update: {
- gqlMutation: gql`
- mutation UpdateBlogPosts(
- $id: uuid!
- $object: blog_posts_set_input!
- ) {
- update_blog_posts_by_pk(
- pk_columns: { id: $id }
- _set: $object
- ) {
- id
- title
- content
- created_at
- category_id
- status
- category {
- id
- title
- }
- }
- }
- `,
- },
- },
- categories: {
- default: {
- gqlQuery: gql`
- query CategoriesList(
- $offset: Int
- $limit: Int
- $order_by: [categories_order_by!]
- $where: categories_bool_exp
- ) {
- categories(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- created_at
- }
- categories_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getList: {
- gqlQuery: gql`
- query CategoriesList(
- $offset: Int
- $limit: Int
- $order_by: [categories_order_by!]
- $where: categories_bool_exp
- ) {
- categories(
- offset: $offset
- limit: $limit
- order_by: $order_by
- where: $where
- ) {
- id
- title
- created_at
- }
- categories_aggregate(where: $where) {
- aggregate {
- count
- }
- }
- }
- `,
- },
- getOne: {
- gqlQuery: gql`
- query GetCategory($id: uuid!) {
- categories_by_pk(id: $id) {
- id
- title
- created_at
- }
- }
- `,
- },
- create: {
- gqlMutation: gql`
- mutation CreateCategory($object: categories_insert_input!) {
- insert_categories_one(object: $object) {
- id
- title
- created_at
- }
- }
- `,
- },
- update: {
- gqlMutation: gql`
- mutation UpdateCategory(
- $id: uuid!
- $object: categories_set_input!
- ) {
- update_categories_by_pk(
- pk_columns: { id: $id }
- _set: $object
- ) {
- id
- title
- created_at
- }
- }
- `,
- },
- },
-};
diff --git a/refine-vite/plugins/data-provider-hasura/src/pages/blog-posts/queries.ts b/refine-vite/plugins/data-provider-hasura/src/pages/blog-posts/queries.ts
new file mode 100644
index 000000000..76bfc8400
--- /dev/null
+++ b/refine-vite/plugins/data-provider-hasura/src/pages/blog-posts/queries.ts
@@ -0,0 +1,13 @@
+export const BLOG_POSTS_QUERY = [
+ "id",
+ "title",
+ "status",
+ "created_at",
+ "category_id",
+ "content",
+ {
+ category: ["id", "title"],
+ },
+];
+
+export const BLOG_POSTS_CATEGORIES_SELECT_QUERY = ["id", "title"];
diff --git a/refine-vite/plugins/data-provider-hasura/src/pages/categories/queries.ts b/refine-vite/plugins/data-provider-hasura/src/pages/categories/queries.ts
new file mode 100644
index 000000000..9a6a5ccd8
--- /dev/null
+++ b/refine-vite/plugins/data-provider-hasura/src/pages/categories/queries.ts
@@ -0,0 +1 @@
+export const CATEGORIES_QUERY = ["id", "title"];
diff --git a/refine-vite/plugins/data-provider-medusa/extend.js b/refine-vite/plugins/data-provider-medusa/extend.js
deleted file mode 100644
index f8267892c..000000000
--- a/refine-vite/plugins/data-provider-medusa/extend.js
+++ /dev/null
@@ -1,23 +0,0 @@
-const base = {
- _app: {
- import: [
- `import dataProvider, { authProvider } from "@refinedev/medusa";`,
- ],
- afterImport: [
- `const API_URL = "https://your-medusa-url";`,
- "",
- `const medusaDataProvider = dataProvider(API_URL);`,
- `const medusaAuthProvider = authProvider(API_URL);`,
- "",
- ],
- refineProps: [
- "authProvider={medusaAuthProvider}",
- "dataProvider={medusaDataProvider}",
- ],
- },
-};
-module.exports = {
- extend() {
- return base;
- },
-};
diff --git a/refine-vite/plugins/data-provider-medusa/package.json b/refine-vite/plugins/data-provider-medusa/package.json
deleted file mode 100644
index bfc50b17c..000000000
--- a/refine-vite/plugins/data-provider-medusa/package.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
- "dependencies": {
- "@refinedev/medusa": "^3.0.1"
- }
-}
diff --git a/refine-vite/plugins/data-provider-nestjs-query/extend.js b/refine-vite/plugins/data-provider-nestjs-query/extend.js
index 947ebabec..f06a32e43 100644
--- a/refine-vite/plugins/data-provider-nestjs-query/extend.js
+++ b/refine-vite/plugins/data-provider-nestjs-query/extend.js
@@ -2,7 +2,7 @@ const base = {
_app: {
import: [
`import dataProvider, { GraphQLClient, liveProvider } from "@refinedev/nestjs-query";`,
- `import { createClient } from "graphql-ws";`
+ `import { createClient } from "graphql-ws";`,
],
afterImport: [
"",
diff --git a/refine-vite/plugins/data-provider-nestjs-query/meta.json b/refine-vite/plugins/data-provider-nestjs-query/meta.json
index 22a1fda3b..4079c0718 100644
--- a/refine-vite/plugins/data-provider-nestjs-query/meta.json
+++ b/refine-vite/plugins/data-provider-nestjs-query/meta.json
@@ -1,4 +1,4 @@
{
- "name": "NestJS Query Data Provider",
- "url": "https://refine.dev/docs/core/providers/data-provider/#overview"
+ "name": "NestJS Query Data Provider",
+ "url": "https://refine.dev/docs/data/packages/nestjs-query/"
}
diff --git a/refine-vite/plugins/data-provider-nestjs-query/package.json b/refine-vite/plugins/data-provider-nestjs-query/package.json
index f3d4e67e7..6506d516e 100644
--- a/refine-vite/plugins/data-provider-nestjs-query/package.json
+++ b/refine-vite/plugins/data-provider-nestjs-query/package.json
@@ -1,5 +1,16 @@
{
- "dependencies": {
- "@refinedev/nestjs-query": "^1.1.1"
- }
-}
\ No newline at end of file
+ "scripts": {
+ "codegen": "graphql-codegen"
+ },
+ "dependencies": {
+ "@refinedev/nestjs-query": "^1.1.1",
+ "graphql-tag": "^2.12.6",
+ "graphql-ws": "^5.9.1"
+ },
+ "devDependencies": {
+ "@graphql-codegen/cli": "^5.0.0",
+ "@graphql-codegen/typescript": "^4.0.1",
+ "@graphql-codegen/typescript-operations": "^4.0.1",
+ "@graphql-codegen/import-types-preset": "^3.0.0"
+ }
+}
diff --git a/refine-vite/plugins/data-provider-nestjs-query/src/pages/blog-posts/queries.ts b/refine-vite/plugins/data-provider-nestjs-query/src/pages/blog-posts/queries.ts
new file mode 100644
index 000000000..3e77249eb
--- /dev/null
+++ b/refine-vite/plugins/data-provider-nestjs-query/src/pages/blog-posts/queries.ts
@@ -0,0 +1,85 @@
+import gql from "graphql-tag";
+
+export const POST_CREATE_MUTATION = gql`
+ mutation PostCreate($input: CreateOneBlogPostInput!) {
+ createOneBlogPost(input: $input) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ }
+ }
+`;
+
+export const POST_EDIT_MUTATION = gql`
+ mutation PostEdit($input: UpdateOneBlogPostInput!) {
+ updateOneBlogPost(input: $input) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ }
+ }
+`;
+
+export const POSTS_LIST_QUERY = gql`
+ query BlogPostsList(
+ $paging: OffsetPaging!
+ $filter: BlogPostFilter
+ $sorting: [BlogPostSort!]!
+ ) {
+ blogPosts(paging: $paging, filter: $filter, sorting: $sorting) {
+ nodes {
+ id
+ title
+ categoryId
+ category {
+ id
+ title
+ }
+ status
+ content
+ createdAt
+ }
+ totalCount
+ }
+ }
+`;
+
+export const POST_SHOW_QUERY = gql`
+ query PostShow($id: ID!) {
+ blogPost(id: $id) {
+ id
+ title
+ status
+ categoryId
+ category {
+ id
+ title
+ }
+ content
+ createdAt
+ }
+ }
+`;
+
+export const CATEGORIES_SELECT_QUERY = gql`
+ query CategoriesSelect($filter: CategoryFilter!) {
+ categories(filter: $filter) {
+ nodes {
+ id
+ title
+ }
+ }
+ }
+`;
diff --git a/refine-vite/plugins/data-provider-nestjs-query/src/pages/categories/queries.ts b/refine-vite/plugins/data-provider-nestjs-query/src/pages/categories/queries.ts
new file mode 100644
index 000000000..8e4e6e0b1
--- /dev/null
+++ b/refine-vite/plugins/data-provider-nestjs-query/src/pages/categories/queries.ts
@@ -0,0 +1,45 @@
+import gql from "graphql-tag";
+
+export const CATEGORY_CREATE_MUTATION = gql`
+ mutation CategoryCreate($input: CreateOneCategoryInput!) {
+ createOneCategory(input: $input) {
+ id
+ title
+ }
+ }
+`;
+
+export const CATEGORY_EDIT_MUTATION = gql`
+ mutation CategoryEdit($input: UpdateOneCategoryInput!) {
+ updateOneCategory(input: $input) {
+ id
+ title
+ }
+ }
+`;
+
+export const CATEGORIES_LIST_QUERY = gql`
+ query CategoriesList(
+ $paging: OffsetPaging!
+ $filter: CategoryFilter
+ $sorting: [CategorySort!]!
+ ) {
+ categories(paging: $paging, filter: $filter, sorting: $sorting) {
+ nodes {
+ id
+ title
+ createdAt
+ }
+ totalCount
+ }
+ }
+`;
+export const CATEGORY_SHOW_QUERY = gql`
+ query CategoryShow($id: ID!) {
+ category(id: $id) {
+ id
+ title
+ createdAt
+ }
+ }
+`;
diff --git a/refine-vite/plugins/data-provider-strapi-v4/extend.js b/refine-vite/plugins/data-provider-strapi-v4/extend.js
index 6f0e82d3a..2edcf0bcf 100644
--- a/refine-vite/plugins/data-provider-strapi-v4/extend.js
+++ b/refine-vite/plugins/data-provider-strapi-v4/extend.js
@@ -9,13 +9,9 @@ const base = {
"authProvider={authProvider}",
"dataProvider={DataProvider(API_URL + `/api`, axiosInstance)}",
],
- refineImports: [
- `Authenticated`
- ],
+ refineImports: [`Authenticated`],
refineAntdImports: [],
refineMuiImports: [],
- refineMantineImports: [],
-
},
};
module.exports = {
diff --git a/refine-vite/plugins/data-provider-strapi-v4/src/authProvider.ts b/refine-vite/plugins/data-provider-strapi-v4/src/authProvider.ts
index 50362ee1b..87109e6e1 100644
--- a/refine-vite/plugins/data-provider-strapi-v4/src/authProvider.ts
+++ b/refine-vite/plugins/data-provider-strapi-v4/src/authProvider.ts
@@ -1,9 +1,7 @@
import { AuthBindings } from "@refinedev/core";
import { AuthHelper } from "@refinedev/strapi-v4";
-
-import { TOKEN_KEY, API_URL } from "./constants";
-
import axios from "axios";
+import { API_URL, TOKEN_KEY } from "./constants";
export const axiosInstance = axios.create();
const strapiAuthHelper = AuthHelper(API_URL + "/api");
diff --git a/refine-vite/plugins/data-provider-strapi-v4/src/constants.ts b/refine-vite/plugins/data-provider-strapi-v4/src/constants.ts
index eed20ac6a..b48db0b68 100644
--- a/refine-vite/plugins/data-provider-strapi-v4/src/constants.ts
+++ b/refine-vite/plugins/data-provider-strapi-v4/src/constants.ts
@@ -1,2 +1,2 @@
-export const API_URL = "https://api.strapi-v4.refine.dev";
+export const API_URL = "https://automatic-sweltering-dog.strapiapp.com";
export const TOKEN_KEY = "strapi-jwt-token";
diff --git a/refine-vite/plugins/data-provider-supabase/extend.js b/refine-vite/plugins/data-provider-supabase/extend.js
index 2339bf4ef..8e5af3a9f 100644
--- a/refine-vite/plugins/data-provider-supabase/extend.js
+++ b/refine-vite/plugins/data-provider-supabase/extend.js
@@ -3,23 +3,17 @@ const base = {
import: [
`import { dataProvider, liveProvider } from "@refinedev/supabase";`,
],
- localImport: [
- `import { supabaseClient } from "./utility";`,
- ],
+ localImport: [`import { supabaseClient } from "./utility";`],
relativeImport: [`import authProvider from "./authProvider";`],
refineProps: [
"dataProvider={dataProvider(supabaseClient)}",
"liveProvider={liveProvider(supabaseClient)}",
"authProvider={authProvider}",
- "routerProvider={routerBindings}"
- ],
- refineImports: [
- `Authenticated`
+ "routerProvider={routerBindings}",
],
+ refineImports: [`Authenticated`],
refineAntdImports: [],
- refineMantineImports: [],
refineMuiImports: [],
- refineChakraImports: [],
wrapper: [],
},
};
diff --git a/refine-vite/plugins/headless-example/package.json b/refine-vite/plugins/headless-example/package.json
new file mode 100644
index 000000000..cc62f0977
--- /dev/null
+++ b/refine-vite/plugins/headless-example/package.json
@@ -0,0 +1,8 @@
+{
+ "dependencies": {
+ "@refinedev/react-hook-form": "^4.8.14",
+ "@refinedev/react-router-v6": "^4.5.5",
+ "@refinedev/react-table": "^5.6.6",
+ "@tanstack/react-table": "^8.2.6"
+ }
+}
diff --git a/refine-vite/plugins/headless-example/src/pages/blog-posts/create.tsx b/refine-vite/plugins/headless-example/src/pages/blog-posts/create.tsx
new file mode 100644
index 000000000..e58b4cade
--- /dev/null
+++ b/refine-vite/plugins/headless-example/src/pages/blog-posts/create.tsx
@@ -0,0 +1,143 @@
+import {
+ IResourceComponentsProps,
+ useNavigation,
+ useSelect,
+} from "@refinedev/core";
+import { useForm } from "@refinedev/react-hook-form";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_CREATE_MUTATION, CATEGORIES_SELECT_QUERY } from './queries'
+<%_ } _%>
+
+
+export const BlogPostCreate: React.FC = () => {
+ const { list } = useNavigation();
+
+ const {
+ refineCore: { onFinish },
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: POST_CREATE_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ const { options: categoryOptions } = useSelect({
+ resource: "categories",
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_SELECT_QUERY,
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
Create
+
+
+
+
+
+
+
+
Edit
+
+
+
+
+
+
+
+
+
+ );
+ },
+ },
+ ],
+ [],
+ );
+
+ const { edit, show, create } = useNavigation();
+
+ const {
+ getHeaderGroups,
+ getRowModel,
+ setOptions,
+ refineCore: {
+ tableQueryResult: { data: tableData },
+ },
+ getState,
+ setPageIndex,
+ getCanPreviousPage,
+ getPageCount,
+ getCanNextPage,
+ nextPage,
+ previousPage,
+ setPageSize,
+ } = useTable({
+ columns,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ refineCoreProps: {
+ meta: {
+ populate: ['category'],
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlQuery: POSTS_LIST_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ refineCoreProps: {
+ meta: {
+ select: '*, categories(id,title)',
+ },
+ },
+<%_ } _%>
+ });
+
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData } = useMany({
+ resource: "categories",
+ ids: tableData?.data?.map((item) => item?.<%- blogPostCategoryFieldName %>?.id).filter(Boolean) ?? [],
+ queryOptions: {
+ enabled: !!tableData?.data,
+ },
+ });
+
+ setOptions((prev) => ({
+ ...prev,
+ meta: {
+ ...prev.meta,
+ categoryData,
+ },
+ }));
+<%_ } _%>
+
+
+ return (
+
+
+
{"List"}
+
+
+
+
+
+ {getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => (
+ |
+ {!header.isPlaceholder &&
+ flexRender(
+ header.column.columnDef.header,
+ header.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+ {getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+ |
+ {flexRender(
+ cell.column.columnDef.cell,
+ cell.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ {" "}
+ {getState().pagination.pageIndex + 1} / {getPageCount()}{" "}
+
+
+
+ | {"Go"}:{" "}
+ {
+ const page = e.target.value
+ ? Number(e.target.value) - 1
+ : 0;
+ setPageIndex(page);
+ }}
+ />
+ {" "}
+
+
+
+
+
{"Show"}
+
+
+
+
+
+
+
+
{"ID"}
+
{record?.id ?? ""}
+
+
+
{"Title"}
+
{record?.title}
+
+
+
{"Content"}
+
{record?.content}
+
+
+
{"Category"}
+<%_ if (isGraphQL) { _%>
+
{record?.<%- blogPostCategoryFieldName %>?.title}
+<%_ } else { _%>
+
+ {categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )}
+
+<%_ } _%>
+
+
+
{"Status"}
+
{record?.status}
+
+
+
{"Created at"}
+
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ {new Date(record?.created_at).toLocaleString(undefined, {
+ timeZone: "UTC",
+ })}
+<%_ } else { _%>
+ {new Date(record?.createdAt).toLocaleString(undefined, {
+ timeZone: "UTC",
+ })}
+<%_ } _%>
+
+
+
+
+
+
Create
+
+
+
+
+
+
+
+
Edit
+
+
+
+
+
+
+
+
+
+ );
+ },
+ },
+ ],
+ [],
+ );
+
+ const { edit, show, create } = useNavigation();
+
+ const {
+ getHeaderGroups,
+ getRowModel,
+ setOptions,
+ getState,
+ setPageIndex,
+ getCanPreviousPage,
+ getPageCount,
+ getCanNextPage,
+ nextPage,
+ previousPage,
+ setPageSize,
+ } = useTable({
+ columns,
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+ },
+<%_ } _%>
+ });
+
+ setOptions((prev) => ({
+ ...prev,
+ meta: {
+ ...prev.meta,
+ },
+ }));
+
+ return (
+
+
+
List
+
+
+
+
+
+ {getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => (
+ |
+ {!header.isPlaceholder &&
+ flexRender(
+ header.column.columnDef.header,
+ header.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+ {getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+ |
+ {flexRender(
+ cell.column.columnDef.cell,
+ cell.getContext(),
+ )}
+ |
+ ))}
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ {" "}
+ {getState().pagination.pageIndex + 1} / {getPageCount()}{" "}
+
+
+
+ | Go:{" "}
+ {
+ const page = e.target.value
+ ? Number(e.target.value) - 1
+ : 0;
+ setPageIndex(page);
+ }}
+ />
+ {" "}
+
+
+
+
+
Show
+
+
+
+
+
+
+
+
ID
+
{record?.id ?? ""}
+
+
+
Title
+
{record?.title}
+
+
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/mui-example/src/pages/blog-posts/show.tsx b/refine-vite/plugins/mui-example/src/pages/blog-posts/show.tsx
new file mode 100644
index 000000000..06268c7c7
--- /dev/null
+++ b/refine-vite/plugins/mui-example/src/pages/blog-posts/show.tsx
@@ -0,0 +1,102 @@
+import { Stack, Typography } from "@mui/material";
+import { IResourceComponentsProps, useOne, useShow } from "@refinedev/core";
+import {
+ DateField,
+ MarkdownField,
+ NumberField,
+ Show,
+ TextFieldComponent as TextField,
+} from "@refinedev/mui";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { BLOG_POSTS_QUERY, BLOG_POSTS_CATEGORIES_SELECT_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { POST_SHOW_QUERY } from './queries'
+<%_ } _%>
+
+export const BlogPostShow: React.FC = () => {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: BLOG_POSTS_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-strapi-v4") { _%>
+ meta: {
+ populate: ['category'],
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: POST_SHOW_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-supabase") { _%>
+ meta: {
+ select: '*, categories(id,title)',
+ },
+<%_ } _%>
+ });
+
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+<%_ if (!isGraphQL) { _%>
+ const { data: categoryData, isLoading: categoryIsLoading } = useOne({
+ resource: "categories",
+ id: record?.<%- blogPostCategoryFieldName %>?.id || "",
+ queryOptions: {
+ enabled: !!record,
+ },
+ });
+<%_ } _%>
+
+
+
+ return (
+
+
+
+ {"ID"}
+
+
+
+
+ {"Title"}
+
+
+
+
+ {"Content"}
+
+
+
+
+ {"Category"}
+
+<%_ if (isGraphQL) { _%>
+ {record?.<%- blogPostCategoryFieldName %>?.title}
+<%_ } else { _%>
+ {categoryIsLoading ? (
+ <>Loading...
+ ) : (
+ <>{categoryData?.data?.title}
+ )}
+<%_ } _%>
+
+ {"Status"}
+
+
+
+ {"CreatedAt"}
+
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+
+<%_ } else { _%>
+
+<%_ } _%>
+
+
+ );
+};
diff --git a/refine-vite/plugins/mui-example/src/pages/categories/create.tsx b/refine-vite/plugins/mui-example/src/pages/categories/create.tsx
new file mode 100644
index 000000000..656153178
--- /dev/null
+++ b/refine-vite/plugins/mui-example/src/pages/categories/create.tsx
@@ -0,0 +1,58 @@
+import { Box, TextField } from "@mui/material";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Create } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_CREATE_MUTATION } from './queries'
+<%_ } _%>
+
+export const CategoryCreate: React.FC = () => {
+ const {
+ saveButtonProps,
+ refineCore: { formLoading },
+ register,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: CATEGORY_CREATE_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/mui-example/src/pages/categories/edit.tsx b/refine-vite/plugins/mui-example/src/pages/categories/edit.tsx
new file mode 100644
index 000000000..c376bfe9e
--- /dev/null
+++ b/refine-vite/plugins/mui-example/src/pages/categories/edit.tsx
@@ -0,0 +1,57 @@
+import { Box, TextField } from "@mui/material";
+import { IResourceComponentsProps } from "@refinedev/core";
+import { Edit } from "@refinedev/mui";
+import { useForm } from "@refinedev/react-hook-form";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_EDIT_MUTATION } from './queries'
+<%_ } _%>
+
+export const CategoryEdit: React.FC = () => {
+ const {
+ saveButtonProps,
+ register,
+ formState: { errors },
+ } = useForm({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ refineCoreProps: {
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ refineCoreProps: {
+ meta: {
+ gqlMutation: CATEGORY_EDIT_MUTATION,
+ },
+ },
+<%_ } _%>
+ });
+
+ return (
+
+
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/mui-example/src/pages/categories/index.ts b/refine-vite/plugins/mui-example/src/pages/categories/index.ts
new file mode 100644
index 000000000..59ff01780
--- /dev/null
+++ b/refine-vite/plugins/mui-example/src/pages/categories/index.ts
@@ -0,0 +1,4 @@
+export * from "./create";
+export * from "./edit";
+export * from "./list";
+export * from "./show";
diff --git a/refine-vite/plugins/mui-example/src/pages/categories/list.tsx b/refine-vite/plugins/mui-example/src/pages/categories/list.tsx
new file mode 100644
index 000000000..cdf85094b
--- /dev/null
+++ b/refine-vite/plugins/mui-example/src/pages/categories/list.tsx
@@ -0,0 +1,72 @@
+import { DataGrid, GridColDef } from "@mui/x-data-grid";
+import { IResourceComponentsProps } from "@refinedev/core";
+import {
+ DeleteButton,
+ EditButton,
+ List,
+ ShowButton,
+ useDataGrid,
+} from "@refinedev/mui";
+import React from "react";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORIES_LIST_QUERY } from './queries'
+<%_ } _%>
+
+export const CategoryList: React.FC = () => {
+ const { dataGridProps } = useDataGrid({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ }
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORIES_LIST_QUERY,
+ },
+<%_ } _%>
+ });
+
+ const columns = React.useMemo(
+ () => [
+ {
+ field: "id",
+ headerName: "ID",
+ type: "number",
+ minWidth: 50,
+ },
+ {
+ field: "title",
+ flex: 1,
+ headerName: "Title",
+ minWidth: 200,
+ },
+ {
+ field: "actions",
+ headerName: "Actions",
+ sortable: false,
+ renderCell: function render({ row }) {
+ return (
+ <>
+
+
+
+
+ );
+ },
+ align: "center",
+ headerAlign: "center",
+ minWidth: 80,
+ },
+ ],
+ [],
+ );
+
+ return (
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/mui-example/src/pages/categories/show.tsx b/refine-vite/plugins/mui-example/src/pages/categories/show.tsx
new file mode 100644
index 000000000..9890a5f09
--- /dev/null
+++ b/refine-vite/plugins/mui-example/src/pages/categories/show.tsx
@@ -0,0 +1,46 @@
+import { Stack, Typography } from "@mui/material";
+import { IResourceComponentsProps, useShow } from "@refinedev/core";
+import {
+ NumberField,
+ Show,
+ TextFieldComponent as TextField,
+} from "@refinedev/mui";
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ import { CATEGORIES_QUERY } from './queries'
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ import { CATEGORY_SHOW_QUERY } from './queries'
+<%_ } _%>
+
+export const CategoryShow: React.FC = () => {
+ const { queryResult } = useShow({
+<%_ if (answers["data-provider"] === "data-provider-hasura") { _%>
+ meta: {
+ fields: CATEGORIES_QUERY,
+ },
+<%_ } _%>
+<%_ if (answers["data-provider"] === "data-provider-nestjs-query") { _%>
+ meta: {
+ gqlQuery: CATEGORY_SHOW_QUERY,
+ },
+<%_ } _%>
+ });
+ const { data, isLoading } = queryResult;
+
+ const record = data?.data;
+
+ return (
+
+
+
+ {"ID"}
+
+
+
+ {"Title"}
+
+
+
+
+ );
+};
diff --git a/refine-vite/plugins/mui/package.json b/refine-vite/plugins/mui/package.json
index f5282bb20..564bf4b20 100644
--- a/refine-vite/plugins/mui/package.json
+++ b/refine-vite/plugins/mui/package.json
@@ -1,13 +1,13 @@
{
- "dependencies": {
- "@refinedev/mui": "^5.14.1",
- "@refinedev/react-hook-form": "^4.8.13",
- "@mui/icons-material": "^5.8.3",
- "@emotion/react": "^11.8.2",
- "@emotion/styled": "^11.8.1",
- "@mui/lab": "^5.0.0-alpha.85",
- "@mui/material": "^5.8.6",
- "@mui/x-data-grid": "^6.6.0",
- "react-hook-form": "^7.30.0"
- }
+ "dependencies": {
+ "@refinedev/mui": "^5.14.4",
+ "@refinedev/react-hook-form": "^4.8.14",
+ "@mui/icons-material": "^5.8.3",
+ "@emotion/react": "^11.8.2",
+ "@emotion/styled": "^11.8.1",
+ "@mui/lab": "^5.0.0-alpha.85",
+ "@mui/material": "^5.8.6",
+ "@mui/x-data-grid": "^6.6.0",
+ "react-hook-form": "^7.30.0"
+ }
}
diff --git a/refine-vite/prompt.js b/refine-vite/prompt.js
index b3b7c8d45..a6fbbb652 100644
--- a/refine-vite/prompt.js
+++ b/refine-vite/prompt.js
@@ -12,9 +12,9 @@ module.exports = {
hint: "Installs REST API Data Provider.",
},
{
- message: 'NestJS Query',
- name: 'data-provider-nestjs-query',
- hint: 'Installs NestJS Query Data Provider.'
+ message: "NestJS Query",
+ name: "data-provider-nestjs-query",
+ hint: "Installs NestJS Query Data Provider.",
},
{
message: "GraphQL API",
@@ -51,11 +51,6 @@ module.exports = {
name: "data-provider-hasura",
hint: "Installs Hasura Data Provider.",
},
- {
- message: "Medusa",
- name: "data-provider-medusa",
- hint: "Installs Medusa Data Provider.",
- },
],
default: "data-provider-custom-json-rest",
},
@@ -80,21 +75,32 @@ module.exports = {
name: "mui",
hint: "Installs Material UI package.",
},
+ ],
+ default: "no",
+ },
+ {
+ name: "antd-example",
+ message: "Do you want to add example pages?:",
+ type: "select",
+ choices: [
{
- message: "Mantine",
- name: "mantine",
- hint: "Installs Mantine package.",
+ message: "No",
+ name: "no",
+ hint: "No examples will be installed.",
},
{
- message: "Chakra UI",
- name: "chakra",
- hint: "Installs Chakra UI package.",
+ message: "Yes (Recommended)",
+ name: "antd-example",
+ hint: "Installs example pages.",
},
],
+ skip: ({ answers }) =>
+ answers["ui-framework"] !== "antd" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
- name: "inferencer",
+ name: "mui-example",
message: "Do you want to add example pages?:",
type: "select",
choices: [
@@ -105,19 +111,17 @@ module.exports = {
},
{
message: "Yes (Recommended)",
- name: "inferencer",
+ name: "mui-example",
hint: "Installs example pages.",
},
],
skip: ({ answers }) =>
- answers["ui-framework"] === "no" ||
- answers["data-provider"] === "data-provider-graphql" ||
- answers["data-provider"] === "data-provider-medusa" ||
- answers["data-provider"] === "data-provider-nestjs-query",
+ answers["ui-framework"] !== "mui" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
- name: "inferencer-headless",
+ name: "headless-example",
message: "Do you want to add example pages?:",
type: "select",
choices: [
@@ -128,15 +132,14 @@ module.exports = {
},
{
message: "Yes (Recommended)",
- name: "inferencer-headless",
+ name: "headless-example",
hint: "Installs example pages.",
},
],
skip: ({ answers }) =>
- answers["ui-framework"] !== "no" ||
- answers["data-provider"] === "data-provider-graphql" ||
- answers["data-provider"] === "data-provider-medusa" ||
- answers["data-provider"] === "data-provider-nestjs-query",
+ answers["ui-framework"] === "antd" ||
+ answers["ui-framework"] === "mui" ||
+ answers["data-provider"] === "data-provider-graphql",
default: "no",
},
{
@@ -187,110 +190,9 @@ module.exports = {
skip: ({ answers }) =>
answers["data-provider"] === "data-provider-supabase" ||
answers["data-provider"] === "data-provider-strapi-v4" ||
- answers["data-provider"] === "data-provider-appwrite" ||
- answers["data-provider"] === "data-provider-medusa",
+ answers["data-provider"] === "data-provider-appwrite",
default: "none",
},
- {
- name: "i18n-no",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "no",
- },
- {
- name: "i18n-antd",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-antd",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "antd",
- },
- {
- name: "i18n-mui",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-mui",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "mui",
- },
- {
- name: "i18n-mantine",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-mantine",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "mantine",
- },
- {
- name: "i18n-chakra",
- message: "Do you need i18n (Internationalization) support?:",
- type: "select",
- pageSize: 2,
- choices: [
- {
- message: "No",
- name: "no",
- hint: "No i18n packages will be installed.",
- },
- {
- message: "Yes",
- name: "i18n-chakra",
- hint: "Installs i18n packages.",
- },
- ],
- default: "no",
- skip: ({ answers }) => answers["ui-framework"] !== "chakra",
- },
],
ignores: [
{
@@ -323,15 +225,31 @@ module.exports = {
],
},
{
- plugin: ["_base"],
+ plugin: ["data-provider-hasura"],
+ when: function (answers) {
+ return [
+ "headless-example",
+ "antd-example",
+ "mui-example",
+ ].every((item) => answers[item] === "no");
+ },
+ pattern: [
+ "src/pages/blog-posts/queries.ts",
+ "src/pages/categories/queries.ts",
+ ],
+ },
+ {
+ plugin: ["data-provider-nestjs-query"],
when: function (answers) {
- return answers[`i18n-${answers["ui-framework"]}`] === "no";
+ return [
+ "headless-example",
+ "antd-example",
+ "mui-example",
+ ].every((item) => answers[item] === "no");
},
pattern: [
- "public/locales/de/common.json",
- "public/locales/en/common.json",
- "public/images/flags/de.svg",
- "public/images/flags/en.svg",
+ "src/pages/blog-posts/queries.ts",
+ "src/pages/categories/queries.ts",
],
},
],
diff --git a/refine-vite/template/_package.json b/refine-vite/template/_package.json
index fd2f6bbd1..54df6ee42 100644
--- a/refine-vite/template/_package.json
+++ b/refine-vite/template/_package.json
@@ -5,10 +5,9 @@
"type": "module",
"dependencies": {
"@refinedev/cli": "^2.16.21",
- "@refinedev/core": "^4.46.1",
- "@refinedev/devtools": "^1.1.29",
- "@refinedev/inferencer": "^4.5.16",
- "@refinedev/kbar": "^1.3.5",
+ "@refinedev/core": "^4.47.1",
+ "@refinedev/devtools": "^1.1.32",
+ "@refinedev/kbar": "^1.3.6",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-router-dom": "^6.8.1"
diff --git a/refine-vite/template/src/App.tsx b/refine-vite/template/src/App.tsx
index 5daa831ff..45fc8f69b 100644
--- a/refine-vite/template/src/App.tsx
+++ b/refine-vite/template/src/App.tsx
@@ -14,12 +14,6 @@ import "@refinedev/antd/dist/reset.css";
<%_ if (answers["ui-framework"] === 'mui') { _%>
import { <%- (_app.refineMuiImports || []).join("\n,") _%> } from '@refinedev/mui';
<%_ } _%>
-<%_ if (answers["ui-framework"] === 'mantine') { _%>
- import { <%- (_app.refineMantineImports || []).join("\n,") _%> } from '@refinedev/mantine';
-<%_ } _%>
-<%_ if (answers["ui-framework"] === 'chakra') { _%>
- import { <%- (_app.refineChakraImports || []).join("\n,") _%> } from '@refinedev/chakra-ui';
-<%_ } _%>
<%- (_app.import || []).join("\n") _%>
diff --git a/refine-vite/template/src/index.tsx b/refine-vite/template/src/index.tsx
index 2e3ee317e..292beb58f 100644
--- a/refine-vite/template/src/index.tsx
+++ b/refine-vite/template/src/index.tsx
@@ -11,9 +11,6 @@ import { ReactKeycloakProvider } from "@react-keycloak/web";
import App from "./App";
-<%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-import "./i18n";
-<%_ } _%>
<%_ if (answers["auth-provider"] === "auth-provider-keycloak") { _%>
const keycloak = new Keycloak({
@@ -37,15 +34,9 @@ root.render(
<%_ if (_app.hasStrictMode === true) { _%>
<%_ } _%>
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-
- <%_ } _%>
<%- top.join("\n") %>
<%- bottom.join("\n") %>
- <%_ if (answers[`i18n-${answers["ui-framework"]}`] !== "no") { _%>
-
- <%_ } _%>
<%_ if (_app.hasStrictMode === true) { _%>
<%_ } _%>
-
-