Skip to content

Commit 7aa8b62

Browse files
onurtemizkanonurtemizkan
committed
WIP
1 parent e8b6f3a commit 7aa8b62

File tree

7 files changed

+130
-29
lines changed

7 files changed

+130
-29
lines changed

‎dev-packages/e2e-tests/test-applications/remix-hydrogen/.eslintrc.cjs

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
/**
2+
* This is intended to be a basic starting point for linting in your app.
3+
* It relies on recommended configs out of the box for simplicity, but you can
4+
* and should modify this configuration to best suit your team's needs.
5+
*/
6+
7+
/** @type {import('eslint').Linter.Config} */
8+
module.exports = {
9+
root: true,
10+
parserOptions: {
11+
ecmaVersion: 'latest',
12+
sourceType: 'module',
13+
ecmaFeatures: {
14+
jsx: true,
15+
},
16+
},
17+
env: {
18+
browser: true,
19+
commonjs: true,
20+
es6: true,
21+
},
22+
23+
// Base config
24+
extends: ['eslint:recommended'],
25+
26+
overrides: [
27+
// React
28+
{
29+
files: ['**/*.{js,jsx,ts,tsx}'],
30+
plugins: ['react', 'jsx-a11y'],
31+
extends: [
32+
'plugin:react/recommended',
33+
'plugin:react/jsx-runtime',
34+
'plugin:react-hooks/recommended',
35+
'plugin:jsx-a11y/recommended',
36+
],
37+
settings: {
38+
react: {
39+
version: 'detect',
40+
},
41+
formComponents: ['Form'],
42+
linkComponents: [
43+
{ name: 'Link', linkAttribute: 'to' },
44+
{ name: 'NavLink', linkAttribute: 'to' },
45+
],
46+
'import/resolver': {
47+
typescript: {},
48+
},
49+
},
50+
},
51+
52+
// Typescript
53+
{
54+
files: ['**/*.{ts,tsx}'],
55+
plugins: ['@typescript-eslint', 'import'],
56+
parser: '@typescript-eslint/parser',
57+
settings: {
58+
'import/internal-regex': '^~/',
59+
'import/resolver': {
60+
node: {
61+
extensions: ['.ts', '.tsx'],
62+
},
63+
typescript: {
64+
alwaysTryTypes: true,
65+
},
66+
},
67+
},
68+
extends: ['plugin:@typescript-eslint/recommended', 'plugin:import/recommended', 'plugin:import/typescript'],
69+
},
70+
71+
// Node
72+
{
73+
files: ['.eslintrc.cjs', 'server.js'],
74+
env: {
75+
node: true,
76+
},
77+
},
78+
],
79+
};

‎dev-packages/e2e-tests/test-applications/remix-hydrogen/app/entry.client.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@ import { hydrateRoot } from 'react-dom/client';
77
Sentry.init({
88
dsn: window.ENV.SENTRY_DSN,
99
integrations: [
10-
new Sentry.BrowserTracing({
11-
routingInstrumentation: Sentry.remixRouterInstrumentation(useEffect, useLocation, useMatches),
10+
Sentry.browserTracingIntegration({
11+
useEffect,
12+
useLocation,
13+
useMatches,
1214
}),
13-
// Replay is only available in the client
14-
new Sentry.Replay(),
15-
new Sentry.BrowserProfilingIntegration(),
15+
Sentry.replayIntegration(),
1616
],
1717

1818
// Set tracesSampleRate to 1.0 to capture 100%

‎dev-packages/e2e-tests/test-applications/remix-hydrogen/app/root.tsx

Lines changed: 30 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -12,17 +12,21 @@ import {
1212
useMatches,
1313
useRouteError,
1414
} from '@remix-run/react';
15-
import type { SentryMetaArgs } from '@sentry/remix';
16-
import { useNonce } from '@shopify/hydrogen';
17-
import type { CustomerAccessToken } from '@shopify/hydrogen/storefront-api-types';
18-
import { type LoaderArgs, defer } from '@shopify/remix-oxygen';
15+
import type {SentryMetaArgs} from '@sentry/remix';
16+
import {useNonce} from '@shopify/hydrogen';
17+
import type {CustomerAccessToken} from '@shopify/hydrogen/storefront-api-types';
18+
import {type LoaderArgs, defer} from '@shopify/remix-oxygen';
1919
import favicon from '../public/favicon.svg';
20-
import type { HydrogenSession } from '../server';
20+
import type {HydrogenSession} from '../server';
2121

2222
import * as Sentry from '@sentry/remix';
2323

2424
// This is important to avoid re-fetching root queries on sub-navigations
25-
export const shouldRevalidate: ShouldRevalidateFunction = ({ formMethod, currentUrl, nextUrl }) => {
25+
export const shouldRevalidate: ShouldRevalidateFunction = ({
26+
formMethod,
27+
currentUrl,
28+
nextUrl,
29+
}) => {
2630
// revalidate when a mutation is performed e.g add to cart, login...
2731
if (formMethod && formMethod !== 'GET') {
2832
return true;
@@ -46,17 +50,20 @@ export function links() {
4650
rel: 'preconnect',
4751
href: 'https://shop.app',
4852
},
49-
{ rel: 'icon', type: 'image/svg+xml', href: favicon },
53+
{rel: 'icon', type: 'image/svg+xml', href: favicon},
5054
];
5155
}
5256

53-
export async function loader({ context }: LoaderArgs) {
54-
const { storefront, session, cart } = context;
57+
export async function loader({context}: LoaderArgs) {
58+
const {storefront, session, cart} = context;
5559
const customerAccessToken = await session.get('customerAccessToken');
5660
const publicStoreDomain = context.env.PUBLIC_STORE_DOMAIN;
5761

5862
// validate the customer access token is valid
59-
const { isLoggedIn, headers } = await validateCustomerAccessToken(session, customerAccessToken);
63+
const {isLoggedIn, headers} = await validateCustomerAccessToken(
64+
session,
65+
customerAccessToken,
66+
);
6067

6168
// defer the cart query by not awaiting it
6269
const cartPromise = cart.get();
@@ -88,11 +95,11 @@ export async function loader({ context }: LoaderArgs) {
8895
SENTRY_DSN: process.env.E2E_TEST_DSN,
8996
},
9097
},
91-
{ headers },
98+
{headers},
9299
);
93100
}
94101

95-
export const meta = ({ data }: SentryMetaArgs<MetaFunction<typeof loader>>) => {
102+
export const meta = ({data}: SentryMetaArgs<MetaFunction<typeof loader>>) => {
96103
return [
97104
{
98105
env: data.ENV,
@@ -110,7 +117,7 @@ export const meta = ({ data }: SentryMetaArgs<MetaFunction<typeof loader>>) => {
110117

111118
function App() {
112119
const nonce = useNonce();
113-
const { ENV } = useLoaderData();
120+
const {ENV} = useLoaderData();
114121

115122
return (
116123
<html lang="en">
@@ -135,7 +142,8 @@ function App() {
135142
);
136143
}
137144

138-
export default Sentry.withSentry(App);
145+
// export default Sentry.withSentry(App);
146+
export default App;
139147

140148
export function ErrorBoundary() {
141149
const error = useRouteError();
@@ -144,8 +152,8 @@ export function ErrorBoundary() {
144152
let errorMessage = 'Unknown error';
145153
let errorStatus = 500;
146154

147-
// Send the error to Sentry
148-
const eventId = Sentry.captureRemixErrorBoundaryError(error);
155+
// // Send the error to Sentry
156+
// const eventId = Sentry.captureRemixErrorBoundaryError(error);
149157

150158
if (isRouteErrorResponse(error)) {
151159
errorMessage = error?.data?.message ?? error.data;
@@ -198,11 +206,14 @@ export function ErrorBoundary() {
198206
* );
199207
* ```
200208
* */
201-
async function validateCustomerAccessToken(session: HydrogenSession, customerAccessToken?: CustomerAccessToken) {
209+
async function validateCustomerAccessToken(
210+
session: HydrogenSession,
211+
customerAccessToken?: CustomerAccessToken,
212+
) {
202213
let isLoggedIn = false;
203214
const headers = new Headers();
204215
if (!customerAccessToken?.accessToken || !customerAccessToken?.expiresAt) {
205-
return { isLoggedIn, headers };
216+
return {isLoggedIn, headers};
206217
}
207218

208219
const expiresAt = new Date(customerAccessToken.expiresAt).getTime();
@@ -216,7 +227,7 @@ async function validateCustomerAccessToken(session: HydrogenSession, customerAcc
216227
isLoggedIn = true;
217228
}
218229

219-
return { isLoggedIn, headers };
230+
return {isLoggedIn, headers};
220231
}
221232

222233
const MENU_FRAGMENT = `#graphql

‎dev-packages/e2e-tests/test-applications/remix-hydrogen/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
"@sentry/remix": "latest || *",
2121
"@shopify/cli": "3.60.0",
2222
"@shopify/cli-hydrogen": "^8.1.1",
23-
"@shopify/hydrogen": "2024.4.5",
23+
"@shopify/hydrogen": "2024.4.7",
2424
"@shopify/remix-oxygen": "^2.0.4",
2525
"graphql": "^16.6.0",
2626
"graphql-tag": "^2.12.6",
@@ -53,6 +53,6 @@
5353
"vite-tsconfig-paths": "^4.3.1"
5454
},
5555
"volta": {
56-
"node": "20.15.0"
56+
"extends": "../../package.json"
5757
}
5858
}

‎dev-packages/e2e-tests/test-applications/remix-hydrogen/vite.config.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export default defineConfig({
2424
],
2525
build: {
2626
// Allow a strict Content-Security-Policy
27-
// withtout inlining assets as base64:
27+
// without inlining assets as base64:
2828
assetsInlineLimit: 0,
2929
minify: false,
3030
},
@@ -40,7 +40,7 @@ export default defineConfig({
4040
* Include 'example-dep' in the array below.
4141
* @see https://vitejs.dev/config/dep-optimization-options
4242
*/
43-
include: ['hoist-non-react-statics'],
43+
include: ['hoist-non-react-statics', '@sentry/remix'],
4444
},
4545
},
4646
});

‎packages/remix/package.json

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,17 @@
2828
"import": "./build/esm/index.client.js",
2929
"require": "./build/cjs/index.client.js"
3030
},
31-
"node": "./build/cjs/index.server.js"
31+
"node": {
32+
"require": "./build/cjs/index.server.js"
33+
},
34+
"import": {
35+
"default": "./build/esm/index.server.js"
36+
},
37+
"worker": {
38+
"import": "./build/esm/index.client.js",
39+
"require": "./build/cjs/index.client.js",
40+
"default": "./build/esm/index.client.js"
41+
}
3242
},
3343
"./import": {
3444
"import": {

‎packages/remix/src/index.client.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ export async function captureRemixServerException(
2727
}
2828
/* eslint-enable @typescript-eslint/no-unused-vars */
2929

30+
export { setTags, captureException } from '@sentry/react';
3031
export * from '@sentry/react';
3132

3233
export function init(options: RemixOptions): Client | undefined {

0 commit comments

Comments
 (0)