Continuing the discussion from Freshdesk client: app.initialized() returns a promise that never gets resolved:
@Asif can you confirm this solution still works? I am trying to implement this in my local app as well but I am encountering the same issue – it appears the app.initialize() function simply hangs unpredictably
import React, { useState, useEffect, useLayoutEffect } from 'react';
import './App.css';
import Header from './components/Header';
import Table from './components/Table';
const App = () => {
const [user, setUser] = useState({})
const [loaded, setLoaded] = useState(false);
const [child, setChild] = useState(<h3>App is loading</h3>)
useEffect(() => {
const script = document.createElement('script');
script.src = '{{{appclient}}}';
script.addEventListener('load', () => {
console.log('script loaded')
setLoaded(true)
});
script.defer = true;
document.head.appendChild(script);
}, []);
useLayoutEffect( () => {
if (!loaded) return
(async () => {
try {
console.log('Initializing app...')
const client = await app.initialized()
console.log('App initialized...', client)
const iparams = await client.iparams.get('permissions')
const allowedUsers = iparams.permissions.replaceAll(' ', '').split(',')
console.log(allowedUsers)
const {loggedInUser: {contact: {name, email}}} = await client.data.get("loggedInUser")
console.log("Found user:", email)
if (allowedUsers.includes(email)) {
setChild((<Table client={client} />))
setUser({name, email})
}
else setChild(<h1>Access denied.</h1>)
} catch (e) {
console.error('A problem occured while loading the app.', e)
}
})()
}, [loaded])
return (
<div>
<Header user={user}/>
{child}
</div>
)
}
export default App;