New subjects have nested paths by default #319

Author: joepio

CHANGELOG.md

@@ -7,11 +7,14 @@ This changelog covers all three packages, as they are (for now) updated as a who
 ### Atomic Browser
 
 - Improve performance collapsed sidebar items.
+- Add article view #319
+- New subjects have nested paths by default
 
 ### @tomic/lib
 
 - Add `store.getResourceAncestry` method, which returns the ancestry of a resource, including the resource itself.
 - Add `resource.title` property, which returns the name of a resource, or the first property that is can be used to name the resource.
+- `store.createSubject` now accepts a `parent` argument, which allows creating nested subjects.
 
 #### Breaking changes
 

data-browser/src/components/NewInstanceButton/useCreateAndNavigate.ts

@@ -34,7 +34,7 @@ export function useCreateAndNavigate(klass: string, parent?: string) {
       /** Do not set a parent for the new resource. Useful for top-level resources */
       noParent?: boolean,
     ): Promise<Resource> => {
-      const subject = store.createSubject(className);
+      const subject = store.createSubject(className, parent);
       const resource = new Resource(subject, true);
 
       await Promise.all([

data-browser/src/views/Article/ArticlePage.tsx

@@ -10,6 +10,7 @@ import styled from 'styled-components';
 import { CommitDetail } from '../../components/CommitDetail';
 import { ContainerWide } from '../../components/Containers';
 import { EditableTitle } from '../../components/EditableTitle';
+import UploadForm from '../../components/forms/UploadForm';
 import { NewCard } from '../../components/NewCard';
 import { useCreateAndNavigate } from '../../components/NewInstanceButton';
 import { Column } from '../../components/Row';
@@ -49,6 +50,7 @@ export function ArticlePage({ resource }: ResourcePageProps): JSX.Element {
                 <CommitDetail commitSubject={lastCommit} />
               </HeadingWrapper>
               <ArticleDescription resource={resource} canEdit={canEdit} />
+              <UploadForm parentResource={resource} />
             </Column>
           </Content>
         </ArticleContainer>

data-browser/src/views/ChatRoomPage.tsx

@@ -74,7 +74,7 @@ export function ChatRoomPage({ resource }: ResourcePageProps) {
       e && e.preventDefault();
 
       if (!disableSend) {
-        const subject = store.createSubject('messages');
+        const subject = store.createSubject('messages', resource.getSubject());
         const msgResource = new Resource(subject, true);
         await msgResource.set(
           properties.parent,

data-browser/src/views/DocumentPage.tsx

@@ -187,7 +187,10 @@ function DocumentPageEdit({
   async function addElement(position: number) {
     // When an element is created, it should be a Resource that has this document as its parent.
     // or maybe a nested resource?
-    const elementSubject = store.createSubject('element');
+    const elementSubject = store.createSubject(
+      'element',
+      resource.getSubject(),
+    );
     elements.splice(position, 0, elementSubject);
 
     try {

lib/src/store.ts

@@ -176,10 +176,14 @@ export class Store {
   }
 
   /** Creates a random URL. Add a classnme (e.g. 'persons') to make a nicer name */
-  public createSubject(className?: string): string {
+  public createSubject(className?: string, parentSubject?: string): string {
     const random = this.randomPart();
     className = className ? className : 'things';
 
+    if (parentSubject) {
+      return `${parentSubject}/${className}/${random}`;
+    }
+
     return `${this.getServerUrl()}/${className}/${random}`;
   }