Hello,
I'm not sure if I'm losing my mind or just don't know how to code. Probably the latter.
I'm trying to use the ```secure:true``` but it doesn't seem to be working.
CODE:
import React, { useState, useEffect } from 'react'
import zafClient from '../../../zafClient'
const CaseList = () => {
const [caseData, setCaseData] = useState(null)
const [isLoading, setIsLoading] = useState(true)
useEffect(() => {
const fetchData = async () => {
try {
const client = zafClient
// Retrieve metadata using the client.metadata() method
//const metadata = await client.metadata();
//const token = metadata.settings.token; // Assuming the token is stored in the settings
const options = {
url: 'https://api.example.com/usage',
headers: { "api-token": `{{settings.token}}` },
secure: true,
type: 'GET',
contentType: 'application/json'
}
const response = await client.request(options)
if (!response) {
throw new Error('No response from the API')
}
setCaseData(response.data) // Ensure you're setting the correct part of the response
} catch (error) {
console.error('Error fetching case data:', error)
// Log more error details if available
if (error.response) {
console.error('Error response:', error.response)
}
}
setIsLoading(false)
}
fetchData()
}, [])
return (
<div>
{isLoading ? (
<p>Loading case data...</p>
) : caseData ? (
<ul>
{/* Ensure these fields match the structure of your response data */}
<li><strong>Job Number:</strong> {caseData.JobNum}</li>
<li><strong>Part Number:</strong> {caseData.PartNum}</li>
<li><strong>Description:</strong> {caseData.Description}</li>
{/* Add other fields as needed */}
</ul>
) : (
<p>No case data available.</p>
)}
</div>
)
}
export default CaseList
I'm just returning
What have I done wrong?
