TrkViewer and TrksegViewer skeletons.

src/components/trkseg/TrksegViewer.tsx

@@ -0,0 +1,30 @@
+import { Component } from 'solid-js';
+import { peekCachedSignal } from '../../workers/cached-signals';
+import Tree from '../tree';
+import TrkIcon from '../../icons/human-footprints-svgrepo-com.svg?component-solid';
+
+interface Props {
+  trksegId: string;
+}
+
+const TrksegViewer: Component<Props> = ({ trksegId }) => {
+  const trkseg = peekCachedSignal({ id: trksegId, method: 'getTrkseg' });
+  console.log({ caller: 'TrksegViewer', trksegId, trkseg: trkseg() });
+  const title = () => {
+    return trkseg().name;
+  };
+
+  return (
+    <Tree
+      title={
+        <>
+          <TrkIcon fill='grey' width='16' height='16' /> {title()}
+        </>
+      }
+      content={undefined}
+      subTree={undefined}
+    />
+  );
+};
+
+export default TrksegViewer;

src/components/trkseg/index.ts

@@ -1 +1,3 @@
 export { default } from './Trkseg';
+
+export { default as TrksegViewer } from './TrksegViewer';