From 91cfc10032763593e606f050f82177a030a02a9c Mon Sep 17 00:00:00 2001
From: Dhruv <8352005+dhruvy1@users.noreply.github.com>
Date: Thu, 18 Jul 2024 00:04:07 +1000
Subject: [PATCH] docs(solid-query): add optional chaining to prevent suspense
 bug (#7709)

Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc>
---
 docs/framework/solid/overview.md | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/docs/framework/solid/overview.md b/docs/framework/solid/overview.md
index 2b28496858..33a485cf82 100644
--- a/docs/framework/solid/overview.md
+++ b/docs/framework/solid/overview.md
@@ -11,6 +11,7 @@ SolidJS has been gaining popularity as a fast, reactive, and declarative library
 
 ```tsx
 import { createResource, ErrorBoundary, Suspense } from 'solid-js'
+import { render } from 'solid-js/web'
 
 function App() {
   const [repository] = createResource(async () => {
@@ -26,7 +27,7 @@ function App() {
       <ErrorBoundary fallback={<div>Something went wrong!</div>}>
         {/* Suspense will trigger a loading state while the data is being fetched */}
         <Suspense fallback={<div>Loading...</div>}>
-          <div>{repository().updated_at}</div>
+          <div>{repository()?.updated_at}</div>
         </Suspense>
       </ErrorBoundary>
     </div>
@@ -100,7 +101,7 @@ function App() {
             The `data` property on a query is a SolidJS resource  
             so it will work with Suspense and transitions out of the box! 
           */}
-          <div>{repositoryQuery.data.updated_at}</div>
+          <div>{repositoryQuery.data?.updated_at}</div>
         </Suspense>
       </ErrorBoundary>
     </div>