// actions.ts
 export async function getData() {
 try {
 const res = await fetch('https://api.example.com/data');
 if (!res.ok) {
 throw new Error('Failed to fetch data');
     }
 const data = await res.json();
 
 return data;
 catch (error) {
 return error;
   }
 }
 
 // Component.tsx
 export default async function ExampleServerComponent() {
 const data = await getData('https://api.example.com/data');
 return (
     <div>
       <h1>Data fetched on the server:</h1>
       <pre>{JSON.stringify(data, null, 2)}</pre>
     </div>
   );
}

this code gives me error –
“An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.”

Not sure why this is throwing an error. I checked on local it’s working fine but not working after I deployed my code to server.

Later I converted server component to client component and it resolved the issue but that’s not better approach