disable inputs non readable resource

frontend/src/lib/components/AppConnect.svelte

@@ -44,7 +44,7 @@
 	import { createEventDispatcher } from 'svelte'
 	import Icon from 'svelte-awesome'
 	import Path from './Path.svelte'
-	import { Alert, Button, Drawer, Skeleton } from './common'
+	import { Button, Drawer, Skeleton } from './common'
 	import DrawerContent from './common/drawer/DrawerContent.svelte'
 	import ApiConnectForm from './ApiConnectForm.svelte'
 	import SearchItems from './SearchItems.svelte'

frontend/src/lib/components/ResourceEditor.svelte

@@ -138,7 +138,15 @@
 				<h3 class="mt-4">Value</h3>
 				<div class="text-sm">
 					{#if resourceSchema && resourceSchema?.properties}
-						<SchemaForm compact schema={resourceSchema} bind:args bind:isValid />
+						<SchemaForm
+							disabled={!can_write}
+							compact
+							schema={resourceSchema}
+							bind:args
+							bind:isValid
+						/>
+					{:else if !can_write}
+						<input type="text" disabled value={rawCode} />
 					{:else}
 						<div class="h-full w-full">
 							<SimpleEditor class="editor" lang="json" bind:code={rawCode} />

frontend/src/lib/components/SchemaForm.svelte

@@ -14,6 +14,7 @@
 	export let schema: Schema
 	export let args: Record<string, InputTransform | any> = {}
 	export let disabledArgs: string[] = []
+	export let disabled = false
 
 	export let editableSchema = false
 	export let isValid: boolean = true
@@ -83,7 +84,7 @@
 						contentEncoding={schema.properties[argName].contentEncoding}
 						properties={schema.properties[argName].properties}
 						bind:itemsType={schema.properties[argName].items}
-						disabled={disabledArgs.includes(argName)}
+						disabled={disabledArgs.includes(argName) || disabled}
 						{editableSchema}
 						{compact}
 						password={argName == password}

frontend/src/lib/components/SharedBadge.svelte

@@ -54,7 +54,7 @@
 		<Users size="12" />
 		{kind}
 		{#if reason}
-			<Tooltip>{reason}</Tooltip>
+			<Tooltip><span class="normal-case">{reason}</span></Tooltip>
 		{/if}
 	</Badge>
 {/if}

frontend/src/routes/resources.svelte

@@ -249,6 +249,7 @@
 			<TableCustom>
 				<tr slot="header-row">
 					<th>path</th>
+					<th />
 					<th>resource type</th>
 					<th>description</th>
 					<th />
@@ -258,15 +259,35 @@
 					{#if resources}
 						{#each resources as { path, description, resource_type, extra_perms, canWrite, is_oauth, is_linked, account, refresh_error, is_expired }}
 							<tr>
-								<td class="my-12"
-									><a
+								<td>
+									<a
 										class="break-words"
 										href="#{path}"
 										on:click={() => resourceEditor?.initEdit?.(path)}>{path}</a
 									>
-									<div class="mb-1 -mt-1"><SharedBadge {canWrite} extraPerms={extra_perms} /></div>
 								</td>
-								<td class="px-2"><IconedResourceType name={resource_type} after={true} /></td>
+								<td><SharedBadge {canWrite} extraPerms={extra_perms} /></td>
+								<td class="px-2"
+									><a
+										href="#{name}"
+										on:click={() => {
+											const linkedRt = resourceTypes?.find((rt) => rt.name === resource_type)
+											if (linkedRt) {
+												resourceTypeViewerObj = {
+													rt: linkedRt.name,
+													schema: linkedRt.schema,
+													description: linkedRt.description ?? ''
+												}
+												resourceTypeViewer.openDrawer?.()
+											} else {
+												sendUserToast(
+													`Resource type ${resource_type} not found in workspace.`,
+													true
+												)
+											}
+										}}><IconedResourceType name={resource_type} after={true} /></a
+									></td
+								>
 								<td
 									><span class="text-gray-500 text-xs"
 										><SvelteMarkdown source={truncate(description ?? '', 30)} /></span