CLI should use Agent in requests - get #986

CHANGELOG.md

@@ -5,6 +5,12 @@ By far most changes relate to `atomic-server`, so if not specified, assume the c
 **Changes to JS assets (including the front-end and JS libraries) are not shown here**, but in [`/browser/CHANGELOG`](/browser/CHANGELOG.md).
 See [STATUS.md](server/STATUS.md) to learn more about which features will remain stable.
 
+## UNRELEASED
+
+- CLI should use Agent in requests - get #986
+- Search endpoint throws error for websocket requests #1047
+- Fix search in CLI / atomic_lib #958
+
 ## [v0.40.2]
 
 - fix property sort order when importing + add tests #980

browser/cli/src/generateIndex.ts

@@ -33,6 +33,10 @@ export const generateIndex = (
   const names = ontologies.map(x => {
     const res = store.getResourceLoading(x);
 
+    if (res.error) {
+      throw new Error('error getting ontology');
+    }
+
     return camelCaseify(res.title);
   });
 
@@ -43,10 +47,8 @@ export const generateIndex = (
   const importLines = names.map(createImportLine).join('\n');
   const registerArgs = names.join(', ');
 
-  const content = TEMPLATE.replaceAll(
-    Inserts.MODULE_ALIAS,
-    atomicConfig.moduleAlias ?? '@tomic/lib',
-  )
+  const moduleAlias = atomicConfig.moduleAlias ?? '@tomic/lib';
+  const content = TEMPLATE.replaceAll(Inserts.MODULE_ALIAS, moduleAlias)
     .replace(Inserts.IMPORTS, importLines)
     .replace(Inserts.REGISTER_ARGS, registerArgs);
 

browser/cli/src/utils.ts

@@ -9,7 +9,14 @@ export const dedupe = <T>(array: T[]): T[] => {
   return Array.from(new Set(array));
 };
 
-export const getExtension = () =>
-  getTsconfig()?.config.compilerOptions?.moduleResolution === 'Bundler'
-    ? ''
-    : '.js';
+export const getExtension = () => {
+  try {
+    return getTsconfig()?.config.compilerOptions?.moduleResolution === 'Bundler'
+      ? ''
+      : '.js';
+  } catch (e) {
+    console.warn('Something went wrong getting TS Config / file extension', e);
+
+    return '.js';
+  }
+};

browser/create-template/src/postprocess.ts

@@ -35,7 +35,7 @@ export async function postProcess(context: PostProcessContext) {
       switch (ontology.error.type) {
         case ErrorType.NotFound:
           console.error(
-            `\nThe ${baseTemplate.name} template does not exist on your drive. To get the template go to the Create Resource page and select the ${baseTemplate.name} template`,
+            `\nThe '${baseTemplate.name}' template does not exist on your drive on '${ontologySubject}'. To get the template go to the Create Resource page and select the ${baseTemplate.name} template.`,
           );
           break;
         case ErrorType.Unauthorized:

browser/data-browser/src/components/Button.tsx

@@ -153,7 +153,7 @@ export const ButtonBar = styled(ButtonClean)<ButtonBarProps>`
   }
 
   padding-left: ${p => (p.leftPadding ? '1.2rem' : '')};
-  padding-right: ${p => (p.rightPadding ? '1.2rem' : '')};
+  padding-right: ${p => (p.rightPadding ? '1rem' : '')};
 `;
 
 /** Button with some optional margins around it */

browser/data-browser/src/components/NavBarSpacer.tsx

@@ -2,8 +2,8 @@ import { styled } from 'styled-components';
 import { useSettings } from '../helpers/AppSettings';
 
 import type { JSX } from 'react';
+import { NAVBAR_HEIGHT } from './Navigation';
 
-const NAVBAR_HEIGHT = '2rem';
 const NAVBAR_CALC_PART = ` + ${NAVBAR_HEIGHT}`;
 
 export interface NavBarSpacerProps {

browser/data-browser/src/components/Navigation.tsx

@@ -15,6 +15,8 @@ import { useMediaQuery } from '../hooks/useMediaQuery';
 import { useBackForward } from '../hooks/useNavigateWithTransition';
 import { NAVBAR_TRANSITION_TAG } from '../helpers/transitionName';
 
+export const NAVBAR_HEIGHT = '2.5rem';
+
 interface NavWrapperProps {
   children: React.ReactNode;
 }
@@ -96,6 +98,7 @@ function NavBar(): JSX.Element {
         <>
           <ButtonBar
             leftPadding
+            rightPadding={!isInStandaloneMode}
             type='button'
             onClick={() => setSideBarLocked(!sideBarLocked)}
             title={`Show / hide sidebar (${shortcuts.sidebarToggle})`}
@@ -135,7 +138,7 @@ const NavBarBase = styled.div<NavBarStyledProps>`
   /* transition: all 0.2s; */
   position: fixed;
   z-index: ${p => p.theme.zIndex.sidebar};
-  height: 2.5rem;
+  height: ${NAVBAR_HEIGHT};
   display: flex;
   border: solid 1px ${props => props.theme.colors.bg2};
   background-color: ${props => props.theme.colors.bg};
@@ -191,7 +194,6 @@ const VerticalDivider = styled.div`
   width: 1px;
   background-color: ${props => props.theme.colors.bg2};
   height: 100%;
-  margin-left: ${p => p.theme.size(2)};
 `;
 const SideBarWrapper = styled('div')`
   display: flex;

browser/data-browser/src/components/Template/ApplyTemplateDialog.tsx

@@ -10,7 +10,6 @@ import {
   useDialog,
 } from '../Dialog';
 import { Column } from '../Row';
-import type { Template } from './template';
 import { useEffect, useMemo, useState } from 'react';
 import Markdown from '../datatypes/Markdown';
 import { dataBrowser, useResource, useResources, useStore } from '@tomic/react';
@@ -19,6 +18,7 @@ import { InlineErrMessage } from '../forms/InputStyles';
 import { useSettings } from '../../helpers/AppSettings';
 import { useNavigateWithTransition } from '../../hooks/useNavigateWithTransition';
 import { constructOpenURL } from '../../helpers/navigation';
+import type { Template } from './template';
 
 interface ApplyTemplateDialogProps {
   template?: Template;
@@ -95,9 +95,7 @@ export function ApplyTemplateDialog({
           </DialogTitle>
           <DialogContent>
             <Column>
-              <Markdown
-                text={template.description({ serverUrl: store.getServerUrl() })}
-              />
+              <Markdown text={template.description} />
               <Details title='Preview JSON-AD'>
                 <CodeBlock content={formattedJSONAD} />
               </Details>

browser/data-browser/src/components/Template/TemplateList.tsx

@@ -1,32 +1,50 @@
 import { TemplateListItem } from './TemplateListItem';
 import { styled } from 'styled-components';
 import { website } from './templates/website';
-import type { Template } from './template';
+import type { Template, TemplateFn } from './template';
 import { useState } from 'react';
 import { ApplyTemplateDialog } from './ApplyTemplateDialog';
+import { useSettings } from '../../helpers/AppSettings';
 
-const templates: Template[] = [website];
+const templates: TemplateFn[] = [website];
 
 export function TemplateList(): React.JSX.Element {
   const [dialogOpen, setDialogOpen] = useState(false);
   const [selectedTemplate, setSelectedTemplate] = useState<Template>();
+  const { drive } = useSettings();
 
   return (
     <>
       <List>
-        {templates.map(template => (
-          <li key={template.id}>
-            <TemplateListItem
-              id={template.id}
-              title={template.title}
-              Image={template.Image}
-              onClick={id => {
-                setSelectedTemplate(templates.find(t => t.id === id));
-                setDialogOpen(true);
-              }}
-            />
-          </li>
-        ))}
+        {templates.map(templatefn => {
+          const context = {
+            driveURL: drive,
+          };
+
+          const template = templatefn(context);
+
+          const { id, title, Image } = template;
+
+          return (
+            <li key={id}>
+              <TemplateListItem
+                id={id}
+                title={title}
+                Image={Image}
+                onClick={tmpl => {
+                  const newTemplate = templates.find(
+                    t => t(context).id === tmpl,
+                  );
+
+                  if (!newTemplate) return;
+
+                  setSelectedTemplate(template);
+                  setDialogOpen(true);
+                }}
+              />
+            </li>
+          );
+        })}
       </List>
       <ApplyTemplateDialog
         template={selectedTemplate}

browser/data-browser/src/components/Template/template.ts

@@ -1,14 +1,16 @@
 import type { JSONValue } from '@tomic/react';
 
-export type DescriptionContext = {
-  serverUrl: string;
+export type TemplateContext = {
+  driveURL: string;
 };
 
-export type Template = {
+export type TemplateFn = (context: TemplateContext) => {
   rootResourceLocalIDs: string[];
   id: string;
   title: string;
-  description: (context: DescriptionContext) => string;
+  description: string;
   Image: React.FC;
   resources: Record<string, JSONValue>[];
 };
+
+export type Template = ReturnType<TemplateFn>;

browser/data-browser/src/components/Template/templates/website.tsx

@@ -1,5 +1,9 @@
 import { core, dataBrowser } from '@tomic/react';
-import type { Template } from '../template';
+import type {
+  TemplateFn,
+  TemplateContext,
+  TemplateDescription,
+} from '../template';
 
 const Image: React.FC = () => {
   return (
@@ -130,21 +134,24 @@ const Image: React.FC = () => {
   );
 };
 
-export const website: Template = {
-  title: 'website',
-  id: 'website',
-  description:
-    context => `This template adds a website ontology to your AtomicServer along with some sample website data.
+const description = (
+  context: TemplateContext,
+) => `Based on the Atomic Website Template.
 The website features blog posts, nested menu items and content blocks to create expressive pages from data.\n
 An \`@tomic/template\` template is also available to setup a fully working website in a variety of front-end frameworks that you can then customize to your preferences.
 \`\`\`
-npm create @tomic/template my-project -- --template sveltekit-site --server-url ${context.serverUrl}
-pnpm create @tomic/template my-project --template sveltekit-site --server-url ${context.serverUrl}
-yarn create @tomic/template my-project --template sveltekit-site --server-url ${context.serverUrl}
+npm create @tomic/template my-project -- --template sveltekit-site --server-url ${context.driveURL}
+pnpm create @tomic/template my-project --template sveltekit-site --server-url ${context.driveURL}
+yarn create @tomic/template my-project --template sveltekit-site --server-url ${context.driveURL}
 \`\`\`
 Currently available @tomic/templates for the website template are:
 - sveltekit-site
-- nextjs-site`,
+- nextjs-site`;
+
+export const website: TemplateFn = context => ({
+  title: 'website',
+  id: 'website',
+  description: description(context),
   Image,
   rootResourceLocalIDs: ['website', 'site-data'],
   resources: [
@@ -160,7 +167,7 @@ Currently available @tomic/templates for the website template are:
         'website/class/text-block',
         'website/class/website',
       ],
-      [core.properties.description]: 'Ontology for the template website.',
+      [core.properties.description]: description(context),
       [core.properties.instances]: [],
       [core.properties.isA]: [core.classes.ontology],
       [core.properties.properties]: [
@@ -620,4 +627,4 @@ Currently available @tomic/templates for the website template are:
       [core.properties.parent]: 'site-data',
     },
   ],
-};
+});

browser/e2e/package.json

@@ -24,7 +24,7 @@
     "test-debug": "PWDEBUG=1 playwright test",
     "test-update": "playwright test --update-snapshots",
     "test-new": "playwright codegen http://localhost:5173",
-    "test-query": "PWDEBUG=1 DELETE_PREVIOUS_TEST_DRIVES=false playwright test \"e2e.spec.ts\" \"tables.spec.ts\" \"documents.spec.ts\" \"ontology.spec.ts\" \"search.spec.ts\" -g"
+    "test-query": "PWDEBUG=1 DELETE_PREVIOUS_TEST_DRIVES=false playwright test **/*.spec.ts --retries=0 -g"
   },
   "dependencies": {}
 }