Try to fix suspense key errors

Author: oBusk

src/app/[...parts]/_page/DiffIntro/SpecBox.tsx

@@ -16,7 +16,7 @@ const SpecBox = forwardRef<HTMLElement, SpecBoxProps>(
         <section {...props} ref={ref}>
             <Pkg pkg={pkg} className={cx("px-1", pkgClassName)} />
             <PublishDate
-                key={"publishdate-" + simplePackageSpecToString(pkg)}
+                suspenseKey={"publishdate-" + simplePackageSpecToString(pkg)}
                 pkg={pkg}
                 className="font-normal"
             />

src/app/[...parts]/page.tsx

@@ -79,15 +79,15 @@ const DiffPageInner = async ({
                                 a={a}
                                 b={b}
                                 specs={canonicalSpecs}
-                                key={
+                                suspenseKey={
                                     "bundlephobia-" + canonicalSpecs.join("...")
                                 }
                             />
                             <PackagephobiaDiff
                                 a={a}
                                 b={b}
                                 specs={canonicalSpecs}
-                                key={
+                                suspenseKey={
                                     "packagephobia-" +
                                     canonicalSpecs.join("...")
                                 }
@@ -101,7 +101,7 @@ const DiffPageInner = async ({
                     b={b}
                     specs={canonicalSpecs}
                     options={options}
-                    key={JSON.stringify([canonicalSpecs, options])}
+                    suspenseKey={JSON.stringify([canonicalSpecs, options])}
                 />
             </>
         );

src/lib/suspense.tsx

@@ -12,13 +12,13 @@ import {
 export default function suspense<T>(
     WrappedComponent: ComponentType<T>,
     fallback: FunctionComponent<T> | ReactNode = <></>,
-): FunctionComponent<T & { key: string }> {
+): FunctionComponent<T & { suspenseKey: string }> {
     const C = async ({
-        key,
+        suspenseKey,
         ...props
-    }: T & { key: string }): Promise<ReactElement> => (
+    }: T & { suspenseKey: string }): Promise<ReactElement> => (
         <SuspenseComp
-            key={key}
+            key={suspenseKey}
             fallback={
                 typeof fallback === "function"
                     ? // eslint-disable-next-line @typescript-eslint/no-explicit-any