38 lines
1.1 KiB
JavaScript

import { Outlet, useLoaderData, useRouteError } from "react-router";
import { boundary } from "@shopify/shopify-app-react-router/server";
import { AppProvider } from "@shopify/shopify-app-react-router/react";
import { authenticate } from "../shopify.server";
export const loader = async ({ request }) => {
await authenticate.admin(request);
return { apiKey: process.env.SHOPIFY_API_KEY || "" };
};
import { AppProvider as PolarisAppProvider } from "@shopify/polaris";
import polarisStyles from "@shopify/polaris/build/esm/styles.css?url";
export const links = () => [{ rel: "stylesheet", href: polarisStyles }];
export default function App() {
const { apiKey } = useLoaderData();
return (
<AppProvider embedded apiKey={apiKey}>
<PolarisAppProvider i18n={{}}>
<s-app-nav>
<s-link href="/app">Reviews Dashboard</s-link>
</s-app-nav>
<Outlet />
</PolarisAppProvider>
</AppProvider>
);
}
export function ErrorBoundary() {
return boundary.error(useRouteError());
}
export const headers = (headersArgs) => {
return boundary.headers(headersArgs);
};