Housekeeping

Author: andreiborza

packages/solidstart/.gitignore

@@ -1,4 +1,4 @@
-# types for the solidrouter integration
+# types for the solidrouter integration that get output in root
 /client
 /server
 /*.d.ts

packages/solidstart/rollup.npm.config.mjs

@@ -4,16 +4,16 @@ export default makeNPMConfigVariants(
   makeBaseNPMConfig({
     entrypoints: [
       'src/index.client.ts',
-      'src/solidrouter.client.ts',
       'src/index.server.ts',
-      'src/solidrouter.server.ts',
       'src/client/index.ts',
-      'src/client/solidrouter.ts',
       'src/server/index.ts',
-      'src/server/solidrouter.ts',
       'src/solidrouter.ts',
+      'src/solidrouter.client.ts',
+      'src/solidrouter.server.ts',
+      'src/client/solidrouter.ts',
+      'src/server/solidrouter.ts',
     ],
-    // prevent this internal nextjs code from ending up in our built package (this doesn't happen automatially because
+    // prevent this internal code from ending up in our built package (this doesn't happen automatially because
     // the name doesn't match an SDK dependency)
     packageSpecificConfig: {
       external: ['solid-js', '@sentry/solid', '@sentry/solid/solidrouter'],

packages/solidstart/src/client/sdk.ts

@@ -4,9 +4,7 @@ import { init as initSolidSDK } from '@sentry/solid';
 import type { Client } from '@sentry/types';
 
 /**
- * Initialize the client side of the Sentry SvelteKit SDK.
- *
- * @param options Configuration options for the SDK.
+ * Initializes the client side of the Solid Start SDK.
  */
 export function init(options: BrowserOptions): Client | undefined {
   const opts = {

packages/solidstart/src/server/index.ts

@@ -121,7 +121,7 @@ export {
 // We can still leave this for the carrier init and type exports
 export * from '@sentry/node';
 
-export { withSentryErrorBoundary } from '@sentry/solid'
+export { withSentryErrorBoundary } from '@sentry/solid';
 
 // -------------------------
 // Solid Start SDK exports:

packages/solidstart/src/server/sdk.ts

@@ -3,8 +3,7 @@ import type { NodeClient, NodeOptions } from '@sentry/node';
 import { init as initNodeSdk } from '@sentry/node';
 
 /**
- *
- * @param options
+ * Initializes the server side of the Solid Start SDK
  */
 export function init(options: NodeOptions): NodeClient | undefined {
   const opts = {

packages/solidstart/src/server/solidrouter.ts

@@ -3,14 +3,18 @@ import { mergeProps, splitProps } from 'solid-js';
 import type { Component, JSX, ParentProps } from 'solid-js';
 import { createComponent } from 'solid-js/web';
 
+// We use @sentry/solid/solidrouter on the client.
+// On the server, we have to create matching components
+// in structure to avoid hydration errors.
+
 /** Pass-through component in case user didn't specify a root **/
 function SentryDefaultRoot(props: ParentProps): JSX.Element {
   return props.children;
 }
 
 /**
- * Unfortunately, we cannot use router hooks directly in the Router, so we
- * need to wrap the `root` prop to instrument navigation.
+ * On the client, router hooks are used in the router's root render prop.
+ * This creates a matching structure that's purely pass-through to avoid hydration errors.
  */
 function withSentryRouterRoot(Root: Component<RouteSectionProps>): Component<RouteSectionProps> {
   const SentryRouterRoot = (props: RouteSectionProps): JSX.Element => {
@@ -23,7 +27,8 @@ function withSentryRouterRoot(Root: Component<RouteSectionProps>): Component<Rou
 export type RouterType = typeof BaseRouter | typeof HashRouter | typeof MemoryRouter | typeof StaticRouter;
 
 /**
- * A higher-order component to instrument Solid Router to create navigation spans.
+ * On the client, router hooks are used to start navigation spans.
+ * This creates a matching structure that's purely pass-through to avoid hydration errors.
  */
 export function withSentryRouterRouting(Router: RouterType): RouterType {
   const SentryRouter = (props: Parameters<RouterType>[0]): JSX.Element => {