Fix/cms 80 fix the resource page (#269)

* refactor: updated editor settings for react typescript

* fix: fixed the resource error

Author: ebukaodini

.vscode/settings.json

@@ -8,5 +8,8 @@
   "search.exclude": {
     "**/build": true,
     "**/node_modules": true
+  },
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
   }
 }

packages/cms/pages/resources/resource/resource.tsx

@@ -535,7 +535,7 @@ export const ResourceView: React.FunctionComponent = () => {
   const { push } = useHistory()
   const { resource, findResource } = useResourceStore()
   const { hasPermission } = useAuthStore()
-  const { toast } = useToastStore()
+  const [isLoading, setIsLoading] = useState(true)
 
   const { resource: resourceSlug } = useParams<{
     resource: string
@@ -547,6 +547,8 @@ export const ResourceView: React.FunctionComponent = () => {
     if (!found) {
       push(window.Tensei.getPath(''))
     }
+
+    setIsLoading(false)
   }, [resourceSlug])
 
   const { setSidebarState } = useSidebarStore()
@@ -559,7 +561,7 @@ export const ResourceView: React.FunctionComponent = () => {
         {hasPermission(`create:${resource?.slugPlural}`) ? (
           <Link to={window.Tensei.getPath(`resources/${resourceSlug}/create`)}>
             <EuiButton
-              size={'s'}
+              size={'m'}
               fill
               iconType={'plus'}
               onClick={() => {
@@ -573,13 +575,11 @@ export const ResourceView: React.FunctionComponent = () => {
       </DashboardLayout.Topbar>
       <DashboardLayout.Content>
         <PageWrapper>
-          {resource ? (
-            hasPermission(`index:${resource?.slugPlural}`) ? (
-              <Resource resource={resource} />
-            ) : null
-          ) : (
+          {isLoading ? (
             <p>Loading ...</p>
-          )}
+          ) : hasPermission(`index:${resource?.slugPlural}`) ? (
+            <Resource resource={resource!} />
+          ) : null}
         </PageWrapper>
       </DashboardLayout.Content>
     </>