add traits show component

packages/viewer/src/components/Spaces/Show.svelte

@@ -8,8 +8,6 @@
   export let tab: 'properties' | 'theorems' | 'references'
   export let rel: string | undefined = undefined
 
-  let showMarkdown = false
-
   const tabs = ['properties', 'theorems', 'references'] as const
 </script>
 

packages/viewer/src/components/Traits/Show.svelte

@@ -1,7 +1,68 @@
 <script lang="ts">
-
+  import type { Space, Property, Trait, Proof as ProofT } from '@/models'
+  import { Icons, Link, References, Typeset } from '@/components/Shared'
+  import Proof from './Proof.svelte'
+  export let space: Space
+  export let property: Property
+  export let trait: Trait | undefined
+  export let proof: ProofT | undefined
+  export let meta: {
+    description: string;
+    refs: ({
+        name: string;
+    } & ({
+        doi: string;
+    } | {
+        wikipedia: string;
+    } | {
+        mr: string;
+    } | {
+        mr: number;
+    } | {
+        mathse: number;
+    } | {
+        mo: number;
+    } | {
+        zb: string;
+    }))[];
+  } | undefined
+  import { contributingUrl } from '@/constants'
 </script>
 
-<!-- content from space/property pair -->
+<h3>Space S{space.id} | Property P{property.id}</h3>
+
+<h1>
+  {#if proof}
+    <Icons.Robot />
+  {:else if meta}
+    <Icons.User />
+  {:else}
+    <Icons.Question />
+  {/if}
+  {#if trait}
+    <Link.Space {space} />
+    is
+    {trait.value ? '' : 'not'}
+    <Link.Property {property} />
+  {:else}
+    We have insufficient information to determine whether or not
+    <Link.Space {space} />
+    is
+    <Link.Property {property} />
+  {/if}
+</h1>
+
+{#if proof}
+  <Proof {space} {...proof} />
+{:else if meta}
+  <section class="description">
+    <Typeset body={meta.description} />
+  </section>
+  <h3>References</h3>
+  <References references={meta.refs} />
+{:else}
+  Please consider <a href={contributingUrl}>contributing</a> a proof or disproof
+  of this property.
+{/if}
 
 <!-- also, add copy markdown button -->

packages/viewer/src/components/Traits/index.ts

@@ -1,4 +1,5 @@
 export { default as Proof } from './Proof.svelte'
 export { default as Related } from './Related.svelte'
+export { default as Show } from './Show.svelte'
 export { default as Table } from './Table.svelte'
 export { default as Value } from './Value.svelte'

packages/viewer/src/routes/(app)/spaces/[id]/properties/[propertyId]/+page.svelte

@@ -1,49 +1,18 @@
 <script lang="ts">
-  import { Icons, Link, References, Title, Typeset } from '@/components/Shared'
-  import { Proof } from '@/components/Traits'
+  import { Title } from '@/components/Shared'
+  import { Show } from '@/components/Traits'
   import type { PageData } from './$types'
   export let data: PageData
-  import { contributingUrl } from '@/constants'
 
   $: title = `S${data.space.id}|P${data.property.id}: ${data.space.name} | ${data.property.name}`
 </script>
 
 <Title {title} />
 
-<!-- move everything below to Traits/Show.svelte -->
-
-<h3>Space S{data.space.id} | Property P{data.property.id}</h3>
-
-<h1>
-  {#if data.proof}
-    <Icons.Robot />
-  {:else if data.meta}
-    <Icons.User />
-  {:else}
-    <Icons.Question />
-  {/if}
-  {#if data.trait}
-    <Link.Space space={data.space} />
-    is
-    {data.trait.value ? '' : 'not'}
-    <Link.Property property={data.property} />
-  {:else}
-    We have insufficient information to determine whether or not
-    <Link.Space space={data.space} />
-    is
-    <Link.Property property={data.property} />
-  {/if}
-</h1>
-
-{#if data.proof}
-  <Proof space={data.space} {...data.proof} />
-{:else if data.meta}
-  <section class="description">
-    <Typeset body={data.meta.description} />
-  </section>
-  <h3>References</h3>
-  <References references={data.meta.refs} />
-{:else}
-  Please consider <a href={contributingUrl}>contributing</a> a proof or disproof
-  of this property.
-{/if}
+<Show
+  space={data.space}
+  property={data.property}
+  trait={data.trait}
+  proof={data.proof}
+  meta={data.meta}
+/>