fix: media asset on local proxy server

packages/core/dev-test/backends/proxy/_data/authors.yml

@@ -0,0 +1,3 @@
+authors:
+    - name: George
+      description: A person I know

packages/core/dev-test/backends/proxy/_data/settings.json

@@ -0,0 +1,9 @@
+{
+  "front_limit": 5,
+  "site_title": "Test",
+  "posts": {
+    "front_limit": 4,
+    "author": "Bob",
+    "thumb": "/backends/proxy/assets/upload/kanefreeman_2.jpg"
+  }
+}

packages/core/dev-test/backends/proxy/_faq/a-question.md

@@ -0,0 +1,5 @@
+---
+title: A Question
+posts:
+---
+Here's the body!

packages/core/dev-test/backends/proxy/_posts/2022-11-01-something.md

@@ -0,0 +1,11 @@
+---
+title: Something something something...
+draft: false
+date: 2022-11-01 06:30
+image: /backends/proxy/assets/posts/ori_3587884_d966kldqzc6mvdeq67hyk16rnbe3gb1k8eeoy31s_shark-icon.jpg
+---
+# Welcome
+
+Here is your body!
+
+And some more information!

packages/core/dev-test/backends/proxy/_posts/2022-11-01-test.md

@@ -0,0 +1,13 @@
+---
+title: Test
+draft: false
+date: 2022-11-01 14:28
+image: /backends/proxy/assets/posts/kittens.jpg
+---
+Test2
+
+<br>
+![moby-dick.jpg](/assets/upload/moby-dick.jpg)
+![moby-dick.jpg](/assets/upload/moby-dick.jpg)
+
+![kanefreeman_2.jpg](/assets/upload/kanefreeman_2.jpg)

packages/core/dev-test/backends/proxy/_posts/2022-11-02-test.md

@@ -0,0 +1,7 @@
+---
+title: Test3
+draft: false
+date: 2022-11-02 08:43
+image: /backends/proxy/assets/upload/kanefreeman_2.jpg
+---
+test25555

packages/core/dev-test/backends/proxy/_sink/kitchen_sink1.md

@@ -0,0 +1,57 @@
+---
+post: Something something something...
+title: Test
+boolean: false
+map: '{"type":"Point","coordinates":[-86.9531232,40.4469471]}'
+text: test
+number: 5
+markdown: test
+datetime: 2022-11-09T12:43:36.323-05:00
+color: "#923a3a"
+colorEditable: "#833a3a"
+image: /backends/proxy/assets/upload/moby-dick.jpg
+file: /backends/proxy/assets/upload/kanefreeman_widescreen.png
+select: a
+select_multiple:
+  - a
+  - b
+select_numeric: 1
+object:
+  boolean: true
+  datetime: 2022-11-09T12:43:36.356-05:00
+  post: Test
+  string: test
+  text: test
+  number: 3
+  markdown: Ttest
+  image: /backends/proxy/assets/upload/moby-dick.jpg
+  file: /backends/proxy/assets/upload/static-cms-logo.png
+  select: a
+list:
+  - object:
+      list:
+        hidden: hidden
+      boolean: false
+      datetime: 2022-11-09T12:44:36.654-05:00
+      string: test
+      text: test
+      number: 5
+      markdown: test
+      image: /backends/proxy/assets/upload/static-cms-logo.png
+      file: /backends/proxy/assets/upload/kanefreeman_widescreen.png
+      select: b
+    boolean: false
+    datetime: 2022-11-09T12:44:36.643-05:00
+    string: test
+    text: test
+    number: 5
+    markdown: test
+    image: /backends/proxy/assets/upload/kanefreeman_2.jpg
+    file: /backends/proxy/assets/upload/static-cms-logo.png
+    select: a
+typed_list:
+  - type: type_1_object
+    boolean: false
+    string: test
+    text: test
+---

packages/core/dev-test/backends/proxy/config.yml

@@ -5,18 +5,18 @@ backend:
 
 local_backend: true
 
-media_folder: assets/upload
-public_folder: /assets/upload
+media_folder: /packages/core/dev-test/backends/proxy/assets/upload
+public_folder: /backends/proxy/assets/upload
 collections:
   - name: posts
     label: Posts
     label_singular: Post
-    media_folder: /assets/posts
-    public_folder: /assets/posts
+    media_folder: /packages/core/dev-test/backends/proxy/assets/posts
+    public_folder: /backends/proxy/assets/posts
     description: >
       The description is a great place for tone setting, high level information,
       and editing guidelines that are specific to a collection.
-    folder: _posts
+    folder: packages/core/dev-test/backends/proxy/_posts
     slug: '{{year}}-{{month}}-{{day}}-{{slug}}'
     summary: '{{title}} -- {{year}}/{{month}}/{{day}}'
     sortable_fields:
@@ -66,7 +66,7 @@ collections:
         hint: Main content goes here.
   - name: faq
     label: FAQ
-    folder: _faqs
+    folder: packages/core/dev-test/backends/proxy/_faqs
     create: true
     fields:
       - label: Question
@@ -98,7 +98,7 @@ collections:
     files:
       - name: general
         label: Site Settings
-        file: _data/settings.json
+        file: packages/core/dev-test/backends/proxy/_data/settings.json
         description: General Site Settings
         fields:
           - label: Number of posts on frontpage
@@ -127,7 +127,7 @@ collections:
                 required: false
       - name: authors
         label: Authors
-        file: _data/authors.yml
+        file: packages/core/dev-test/backends/proxy/_data/authors.yml
         description: Author descriptions
         fields:
           - name: authors
@@ -144,7 +144,7 @@ collections:
                 widget: text
   - name: kitchenSink
     label: Kitchen Sink
-    folder: _sink
+    folder: packages/core/dev-test/backends/proxy/_sink
     create: true
     fields:
       - label: Related Post

packages/core/src/backend.ts

@@ -38,7 +38,7 @@ import {
   selectInferedField,
   selectMediaFolders,
 } from './lib/util/collection.util';
-import { selectMediaFilePath } from './lib/util/media.util';
+import { selectMediaFilePath, selectMediaFilePublicPath } from './lib/util/media.util';
 import { set } from './lib/util/object.util';
 import { dateParsers, expandPath, extractTemplateVars } from './lib/widgets/stringTemplate';
 import createEntry from './valueObjects/createEntry';
@@ -786,7 +786,16 @@ export class Backend<BC extends BackendClass = BackendClass> {
     const mediaFolders = selectMediaFolders(configState.config, collection, entry);
     if (mediaFolders.length > 0) {
       const files = await Promise.all(
-        mediaFolders.map(folder => this.implementation.getMedia(folder)),
+        mediaFolders.map(folder => {
+          const mediaPath = selectMediaFilePublicPath(
+            configState.config!,
+            collection,
+            '',
+            entry,
+            undefined,
+          );
+          return this.implementation.getMedia(folder, mediaPath);
+        }),
       );
       entry.mediaFiles = entry.mediaFiles.concat(...files);
     } else {

packages/core/src/backends/proxy/implementation.ts

@@ -48,6 +48,7 @@ function deserializeMediaFile({ id, content, encoding, path, name }: MediaFile)
 export default class ProxyBackend implements BackendClass {
   proxyUrl: string;
   mediaFolder?: string;
+  publicFolder?: string;
   options: {};
   branch: string;
 
@@ -59,6 +60,7 @@ export default class ProxyBackend implements BackendClass {
     this.branch = config.backend.branch || 'main';
     this.proxyUrl = config.backend.proxy_url;
     this.mediaFolder = config.media_folder;
+    this.publicFolder = config.public_folder;
     this.options = options;
   }
 
@@ -144,17 +146,17 @@ export default class ProxyBackend implements BackendClass {
     });
   }
 
-  async getMedia(mediaFolder = this.mediaFolder) {
+  async getMedia(mediaFolder = this.mediaFolder, publicFolder = this.publicFolder) {
     const files: { path: string; url: string }[] = await this.request({
       action: 'getMedia',
-      params: { branch: this.branch, mediaFolder },
+      params: { branch: this.branch, mediaFolder, publicFolder },
     });
 
     return files.map(({ url, path }) => {
       const id = url;
       const name = basename(path);
 
-      return { id, name, displayURL: { id, path }, path };
+      return { id, name, displayURL: { id, path: url }, path };
     });
   }
 

packages/core/src/components/MediaLibrary/MediaLibraryCardGrid.tsx

@@ -73,8 +73,8 @@ const CardWrapper = ({
     <div
       style={{
         ...style,
-        left: typeof style.left === 'number' ? style.left ?? +gutter * columnIndex : style.left,
-        top: typeof style.top === 'number' ? style.top + gutter : style.top,
+        left: typeof style.left === 'number' ? style.left ?? gutter * columnIndex : style.left,
+        top: style.top,
         width: typeof style.width === 'number' ? style.width - gutter : style.width,
         height: typeof style.height === 'number' ? style.height - gutter : style.height,
       }}
@@ -156,6 +156,7 @@ const VirtualizedGrid = (props: MediaLibraryCardGridProps) => {
                   columnCount,
                 } as CardGridItemData
               }
+              style={{ overflow: 'hidden', overflowY: 'scroll' }}
             >
               {CardWrapper}
             </Grid>

packages/core/src/components/MediaLibrary/MediaLibraryModal.tsx

@@ -25,7 +25,7 @@ const StyledFab = styled(Fab)`
  * TODO Responsive styling needs to be overhauled. Current setup requires specifying
  * widths per breakpoint.
  */
-const cardWidth = `280px`;
+const cardWidth = `278px`;
 const cardHeight = `240px`;
 const cardMargin = `10px`;
 

packages/core/src/formats/JsonFormatter.ts

@@ -1,7 +1,12 @@
+import { isEmpty } from '../lib/util/string.util';
 import FileFormatter from './FileFormatter';
 
 class JsonFormatter extends FileFormatter {
   fromFile(content: string) {
+    if (isEmpty(content)) {
+      return {};
+    }
+
     return JSON.parse(content);
   }
 

packages/core/src/interface.ts

@@ -436,7 +436,7 @@ export abstract class BackendClass {
   abstract entriesByFiles(files: ImplementationFile[]): Promise<ImplementationEntry[]>;
 
   abstract getMediaDisplayURL(displayURL: DisplayURL): Promise<string>;
-  abstract getMedia(folder?: string): Promise<ImplementationMediaFile[]>;
+  abstract getMedia(folder?: string, mediaPath?: string): Promise<ImplementationMediaFile[]>;
   abstract getMediaFile(path: string): Promise<ImplementationMediaFile>;
 
   abstract persistEntry(entry: BackendEntry, opts: PersistOptions): Promise<void>;

packages/core/src/lib/util/collection.util.ts

@@ -255,7 +255,7 @@ export function selectMediaFolders(config: Config, collection: Collection, entry
     folders.unshift(selectMediaFolder(config, newCollection, entry, undefined));
   }
 
-  return [...new Set(...folders)];
+  return [...new Set(folders)];
 }
 export function getFieldsNames(fields: Field[] | undefined, prefix = '') {
   let names = fields?.map(f => `${prefix}${f.name}`) ?? [];