planning

node_modules/decap-cms-backend-test/src/AuthenticationPage.js

@@ -0,0 +1,72 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from '@emotion/styled';
+import { Icon, buttons, shadows, GoBackButton } from 'decap-cms-ui-default';
+
+const StyledAuthenticationPage = styled.section`
+  display: flex;
+  flex-flow: column nowrap;
+  align-items: center;
+  justify-content: center;
+  gap: 50px;
+  height: 100vh;
+`;
+
+const PageLogoIcon = styled(Icon)`
+  height: auto;
+`;
+
+const LoginButton = styled.button`
+  ${buttons.button};
+  ${shadows.dropDeep};
+  ${buttons.default};
+  ${buttons.gray};
+
+  padding: 0 30px;
+  margin-top: 0;
+  display: flex;
+  align-items: center;
+  position: relative;
+
+  ${Icon} {
+    margin-right: 18px;
+  }
+`;
+
+export default class AuthenticationPage extends React.Component {
+  static propTypes = {
+    onLogin: PropTypes.func.isRequired,
+    inProgress: PropTypes.bool,
+    config: PropTypes.object.isRequired,
+    t: PropTypes.func.isRequired,
+  };
+
+  componentDidMount() {
+    /**
+     * Allow login screen to be skipped for demo purposes.
+     */
+    const skipLogin = this.props.config.backend.login === false;
+    if (skipLogin) {
+      this.props.onLogin(this.state);
+    }
+  }
+
+  handleLogin = e => {
+    e.preventDefault();
+    this.props.onLogin(this.state);
+  };
+
+  render() {
+    const { config, inProgress, t } = this.props;
+
+    return (
+      <StyledAuthenticationPage>
+        <PageLogoIcon size="300px" type="decap-cms" />
+        <LoginButton disabled={inProgress} onClick={this.handleLogin}>
+          {inProgress ? t('auth.loggingIn') : t('auth.login')}
+        </LoginButton>
+        {config.site_url && <GoBackButton href={config.site_url} t={t}></GoBackButton>}
+      </StyledAuthenticationPage>
+    );
+  }
+}

node_modules/decap-cms-backend-test/src/__tests__/implementation.spec.js

@@ -0,0 +1,266 @@
+import TestBackend, { getFolderFiles } from '../implementation';
+
+describe('test backend implementation', () => {
+  beforeEach(() => {
+    jest.resetModules();
+  });
+
+  describe('getEntry', () => {
+    it('should get entry by path', async () => {
+      window.repoFiles = {
+        posts: {
+          'some-post.md': {
+            content: 'post content',
+          },
+        },
+      };
+
+      const backend = new TestBackend({});
+
+      await expect(backend.getEntry('posts/some-post.md')).resolves.toEqual({
+        file: { path: 'posts/some-post.md', id: null },
+        data: 'post content',
+      });
+    });
+
+    it('should get entry by nested path', async () => {
+      window.repoFiles = {
+        posts: {
+          dir1: {
+            dir2: {
+              'some-post.md': {
+                content: 'post content',
+              },
+            },
+          },
+        },
+      };
+
+      const backend = new TestBackend({});
+
+      await expect(backend.getEntry('posts/dir1/dir2/some-post.md')).resolves.toEqual({
+        file: { path: 'posts/dir1/dir2/some-post.md', id: null },
+        data: 'post content',
+      });
+    });
+  });
+
+  describe('persistEntry', () => {
+    it('should persist entry', async () => {
+      window.repoFiles = {};
+
+      const backend = new TestBackend({});
+
+      const entry = {
+        dataFiles: [{ path: 'posts/some-post.md', raw: 'content', slug: 'some-post.md' }],
+        assets: [],
+      };
+      await backend.persistEntry(entry, { newEntry: true });
+
+      expect(window.repoFiles).toEqual({
+        posts: {
+          'some-post.md': {
+            content: 'content',
+            path: 'posts/some-post.md',
+          },
+        },
+      });
+    });
+
+    it('should persist entry and keep existing unrelated entries', async () => {
+      window.repoFiles = {
+        pages: {
+          'other-page.md': {
+            content: 'content',
+          },
+        },
+        posts: {
+          'other-post.md': {
+            content: 'content',
+          },
+        },
+      };
+
+      const backend = new TestBackend({});
+
+      const entry = {
+        dataFiles: [{ path: 'posts/new-post.md', raw: 'content', slug: 'new-post.md' }],
+        assets: [],
+      };
+      await backend.persistEntry(entry, { newEntry: true });
+
+      expect(window.repoFiles).toEqual({
+        pages: {
+          'other-page.md': {
+            content: 'content',
+          },
+        },
+        posts: {
+          'new-post.md': {
+            content: 'content',
+            path: 'posts/new-post.md',
+          },
+          'other-post.md': {
+            content: 'content',
+          },
+        },
+      });
+    });
+
+    it('should persist nested entry', async () => {
+      window.repoFiles = {};
+
+      const backend = new TestBackend({});
+
+      const slug = 'dir1/dir2/some-post.md';
+      const path = `posts/${slug}`;
+      const entry = { dataFiles: [{ path, raw: 'content', slug }], assets: [] };
+      await backend.persistEntry(entry, { newEntry: true });
+
+      expect(window.repoFiles).toEqual({
+        posts: {
+          dir1: {
+            dir2: {
+              'some-post.md': {
+                content: 'content',
+                path: 'posts/dir1/dir2/some-post.md',
+              },
+            },
+          },
+        },
+      });
+    });
+
+    it('should update existing nested entry', async () => {
+      window.repoFiles = {
+        posts: {
+          dir1: {
+            dir2: {
+              'some-post.md': {
+                mediaFiles: ['file1'],
+                content: 'content',
+              },
+            },
+          },
+        },
+      };
+
+      const backend = new TestBackend({});
+
+      const slug = 'dir1/dir2/some-post.md';
+      const path = `posts/${slug}`;
+      const entry = { dataFiles: [{ path, raw: 'new content', slug }], assets: [] };
+      await backend.persistEntry(entry, { newEntry: false });
+
+      expect(window.repoFiles).toEqual({
+        posts: {
+          dir1: {
+            dir2: {
+              'some-post.md': {
+                path: 'posts/dir1/dir2/some-post.md',
+                content: 'new content',
+              },
+            },
+          },
+        },
+      });
+    });
+  });
+
+  describe('deleteFiles', () => {
+    it('should delete entry by path', async () => {
+      window.repoFiles = {
+        posts: {
+          'some-post.md': {
+            content: 'post content',
+          },
+        },
+      };
+
+      const backend = new TestBackend({});
+
+      await backend.deleteFiles(['posts/some-post.md']);
+      expect(window.repoFiles).toEqual({
+        posts: {},
+      });
+    });
+
+    it('should delete entry by nested path', async () => {
+      window.repoFiles = {
+        posts: {
+          dir1: {
+            dir2: {
+              'some-post.md': {
+                content: 'post content',
+              },
+            },
+          },
+        },
+      };
+
+      const backend = new TestBackend({});
+
+      await backend.deleteFiles(['posts/dir1/dir2/some-post.md']);
+      expect(window.repoFiles).toEqual({
+        posts: {
+          dir1: {
+            dir2: {},
+          },
+        },
+      });
+    });
+  });
+
+  describe('getFolderFiles', () => {
+    it('should get files by depth', () => {
+      const tree = {
+        pages: {
+          'root-page.md': {
+            content: 'root page content',
+          },
+          dir1: {
+            'nested-page-1.md': {
+              content: 'nested page 1 content',
+            },
+            dir2: {
+              'nested-page-2.md': {
+                content: 'nested page 2 content',
+              },
+            },
+          },
+        },
+      };
+
+      expect(getFolderFiles(tree, 'pages', 'md', 1)).toEqual([
+        {
+          path: 'pages/root-page.md',
+          content: 'root page content',
+        },
+      ]);
+      expect(getFolderFiles(tree, 'pages', 'md', 2)).toEqual([
+        {
+          path: 'pages/dir1/nested-page-1.md',
+          content: 'nested page 1 content',
+        },
+        {
+          path: 'pages/root-page.md',
+          content: 'root page content',
+        },
+      ]);
+      expect(getFolderFiles(tree, 'pages', 'md', 3)).toEqual([
+        {
+          path: 'pages/dir1/dir2/nested-page-2.md',
+          content: 'nested page 2 content',
+        },
+        {
+          path: 'pages/dir1/nested-page-1.md',
+          content: 'nested page 1 content',
+        },
+        {
+          path: 'pages/root-page.md',
+          content: 'root page content',
+        },
+      ]);
+    });
+  });
+});

node_modules/decap-cms-backend-test/src/implementation.ts

@@ -0,0 +1,430 @@
+import { attempt, isError, take, unset, isEmpty } from 'lodash';
+import { v4 as uuid } from 'uuid';
+import {
+  EditorialWorkflowError,
+  Cursor,
+  CURSOR_COMPATIBILITY_SYMBOL,
+  basename,
+} from 'decap-cms-lib-util';
+import { extname, dirname } from 'path';
+
+import AuthenticationPage from './AuthenticationPage';
+
+import type {
+  Implementation,
+  Entry,
+  ImplementationEntry,
+  AssetProxy,
+  PersistOptions,
+  User,
+  Config,
+  ImplementationFile,
+  DataFile,
+} from 'decap-cms-lib-util';
+
+type RepoFile = { path: string; content: string | AssetProxy };
+type RepoTree = { [key: string]: RepoFile | RepoTree };
+
+type Diff = {
+  id: string;
+  originalPath?: string;
+  path: string;
+  newFile: boolean;
+  status: string;
+  content: string | AssetProxy;
+};
+
+type UnpublishedRepoEntry = {
+  slug: string;
+  collection: string;
+  status: string;
+  diffs: Diff[];
+  updatedAt: string;
+};
+
+declare global {
+  interface Window {
+    repoFiles: RepoTree;
+    repoFilesUnpublished: { [key: string]: UnpublishedRepoEntry };
+  }
+}
+
+window.repoFiles = window.repoFiles || {};
+window.repoFilesUnpublished = window.repoFilesUnpublished || [];
+
+function getFile(path: string, tree: RepoTree) {
+  const segments = path.split('/');
+  let obj: RepoTree = tree;
+  while (obj && segments.length) {
+    obj = obj[segments.shift() as string] as RepoTree;
+  }
+  return (obj as unknown as RepoFile) || {};
+}
+
+function writeFile(path: string, content: string | AssetProxy, tree: RepoTree) {
+  const segments = path.split('/');
+  let obj = tree;
+  while (segments.length > 1) {
+    const segment = segments.shift() as string;
+    obj[segment] = obj[segment] || {};
+    obj = obj[segment] as RepoTree;
+  }
+  (obj[segments.shift() as string] as RepoFile) = { content, path };
+}
+
+function deleteFile(path: string, tree: RepoTree) {
+  unset(tree, path.split('/'));
+}
+
+const pageSize = 10;
+
+function getCursor(
+  folder: string,
+  extension: string,
+  entries: ImplementationEntry[],
+  index: number,
+  depth: number,
+) {
+  const count = entries.length;
+  const pageCount = Math.floor(count / pageSize);
+  return Cursor.create({
+    actions: [
+      ...(index < pageCount ? ['next', 'last'] : []),
+      ...(index > 0 ? ['prev', 'first'] : []),
+    ],
+    meta: { index, count, pageSize, pageCount },
+    data: { folder, extension, index, pageCount, depth },
+  });
+}
+
+export function getFolderFiles(
+  tree: RepoTree,
+  folder: string,
+  extension: string,
+  depth: number,
+  files = [] as RepoFile[],
+  path = folder,
+) {
+  if (depth <= 0) {
+    return files;
+  }
+
+  Object.keys(tree[folder] || {}).forEach(key => {
+    if (extname(key)) {
+      const file = (tree[folder] as RepoTree)[key] as RepoFile;
+      if (!extension || key.endsWith(`.${extension}`)) {
+        files.unshift({ content: file.content, path: `${path}/${key}` });
+      }
+    } else {
+      const subTree = tree[folder] as RepoTree;
+      return getFolderFiles(subTree, key, extension, depth - 1, files, `${path}/${key}`);
+    }
+  });
+
+  return files;
+}
+
+export default class TestBackend implements Implementation {
+  mediaFolder: string;
+  options: { initialWorkflowStatus?: string };
+
+  constructor(config: Config, options = {}) {
+    this.options = options;
+    this.mediaFolder = config.media_folder;
+  }
+
+  isGitBackend() {
+    return false;
+  }
+
+  status() {
+    return Promise.resolve({ auth: { status: true }, api: { status: true, statusPage: '' } });
+  }
+
+  authComponent() {
+    return AuthenticationPage;
+  }
+
+  restoreUser() {
+    return this.authenticate();
+  }
+
+  authenticate() {
+    return Promise.resolve() as unknown as Promise<User>;
+  }
+
+  logout() {
+    return null;
+  }
+
+  getToken() {
+    return Promise.resolve('');
+  }
+
+  traverseCursor(cursor: Cursor, action: string) {
+    const { folder, extension, index, pageCount, depth } = cursor.data!.toObject() as {
+      folder: string;
+      extension: string;
+      index: number;
+      pageCount: number;
+      depth: number;
+    };
+    const newIndex = (() => {
+      if (action === 'next') {
+        return (index as number) + 1;
+      }
+      if (action === 'prev') {
+        return (index as number) - 1;
+      }
+      if (action === 'first') {
+        return 0;
+      }
+      if (action === 'last') {
+        return pageCount;
+      }
+      return 0;
+    })();
+    // TODO: stop assuming cursors are for collections
+    const allFiles = getFolderFiles(window.repoFiles, folder, extension, depth);
+    const allEntries = allFiles.map(f => ({
+      data: f.content as string,
+      file: { path: f.path, id: f.path },
+    }));
+    const entries = allEntries.slice(newIndex * pageSize, newIndex * pageSize + pageSize);
+    const newCursor = getCursor(folder, extension, allEntries, newIndex, depth);
+    return Promise.resolve({ entries, cursor: newCursor });
+  }
+
+  entriesByFolder(folder: string, extension: string, depth: number) {
+    const files = folder ? getFolderFiles(window.repoFiles, folder, extension, depth) : [];
+    const entries = files.map(f => ({
+      data: f.content as string,
+      file: { path: f.path, id: f.path },
+    }));
+    const cursor = getCursor(folder, extension, entries, 0, depth);
+    const ret = take(entries, pageSize);
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    ret[CURSOR_COMPATIBILITY_SYMBOL] = cursor;
+    return Promise.resolve(ret);
+  }
+
+  entriesByFiles(files: ImplementationFile[]) {
+    return Promise.all(
+      files.map(file => ({
+        file,
+        data: getFile(file.path, window.repoFiles).content as string,
+      })),
+    );
+  }
+
+  getEntry(path: string) {
+    return Promise.resolve({
+      file: { path, id: null },
+      data: getFile(path, window.repoFiles).content as string,
+    });
+  }
+
+  unpublishedEntries() {
+    return Promise.resolve(Object.keys(window.repoFilesUnpublished));
+  }
+
+  unpublishedEntry({ id, collection, slug }: { id?: string; collection?: string; slug?: string }) {
+    if (id) {
+      const parts = id.split('/');
+      collection = parts[0];
+      slug = parts[1];
+    }
+    const entry = window.repoFilesUnpublished[`${collection}/${slug}`];
+    if (!entry) {
+      return Promise.reject(
+        new EditorialWorkflowError('content is not under editorial workflow', true),
+      );
+    }
+
+    return Promise.resolve(entry);
+  }
+
+  async unpublishedEntryDataFile(collection: string, slug: string, path: string) {
+    const entry = window.repoFilesUnpublished[`${collection}/${slug}`];
+    const file = entry.diffs.find(d => d.path === path);
+    return file?.content as string;
+  }
+
+  async unpublishedEntryMediaFile(collection: string, slug: string, path: string) {
+    const entry = window.repoFilesUnpublished[`${collection}/${slug}`];
+    const file = entry.diffs.find(d => d.path === path);
+    return this.normalizeAsset(file?.content as AssetProxy);
+  }
+
+  deleteUnpublishedEntry(collection: string, slug: string) {
+    delete window.repoFilesUnpublished[`${collection}/${slug}`];
+    return Promise.resolve();
+  }
+
+  async addOrUpdateUnpublishedEntry(
+    key: string,
+    dataFiles: DataFile[],
+    assetProxies: AssetProxy[],
+    slug: string,
+    collection: string,
+    status: string,
+  ) {
+    const diffs: Diff[] = [];
+    dataFiles.forEach(dataFile => {
+      const { path, newPath, raw } = dataFile;
+      const currentDataFile = window.repoFilesUnpublished[key]?.diffs.find(d => d.path === path);
+      const originalPath = currentDataFile ? currentDataFile.originalPath : path;
+      diffs.push({
+        originalPath,
+        id: newPath || path,
+        path: newPath || path,
+        newFile: isEmpty(getFile(originalPath as string, window.repoFiles)),
+        status: 'added',
+        content: raw,
+      });
+    });
+    assetProxies.forEach(a => {
+      const asset = this.normalizeAsset(a);
+      diffs.push({
+        id: asset.id,
+        path: asset.path,
+        newFile: true,
+        status: 'added',
+        content: asset,
+      });
+    });
+    window.repoFilesUnpublished[key] = {
+      slug,
+      collection,
+      status,
+      diffs,
+      updatedAt: new Date().toISOString(),
+    };
+  }
+
+  async persistEntry(entry: Entry, options: PersistOptions) {
+    if (options.useWorkflow) {
+      const slug = entry.dataFiles[0].slug;
+      const key = `${options.collectionName}/${slug}`;
+      const currentEntry = window.repoFilesUnpublished[key];
+      const status =
+        currentEntry?.status || options.status || (this.options.initialWorkflowStatus as string);
+
+      this.addOrUpdateUnpublishedEntry(
+        key,
+        entry.dataFiles,
+        entry.assets,
+        slug,
+        options.collectionName as string,
+        status,
+      );
+      return Promise.resolve();
+    }
+
+    entry.dataFiles.forEach(dataFile => {
+      const { path, raw } = dataFile;
+      writeFile(path, raw, window.repoFiles);
+    });
+    entry.assets.forEach(a => {
+      writeFile(a.path, a, window.repoFiles);
+    });
+    return Promise.resolve();
+  }
+
+  updateUnpublishedEntryStatus(collection: string, slug: string, newStatus: string) {
+    window.repoFilesUnpublished[`${collection}/${slug}`].status = newStatus;
+    return Promise.resolve();
+  }
+
+  publishUnpublishedEntry(collection: string, slug: string) {
+    const key = `${collection}/${slug}`;
+    const unpubEntry = window.repoFilesUnpublished[key];
+
+    delete window.repoFilesUnpublished[key];
+
+    const tree = window.repoFiles;
+    unpubEntry.diffs.forEach(d => {
+      if (d.originalPath && !d.newFile) {
+        const originalPath = d.originalPath;
+        const sourceDir = dirname(originalPath);
+        const destDir = dirname(d.path);
+        const toMove = getFolderFiles(tree, originalPath.split('/')[0], '', 100).filter(f =>
+          f.path.startsWith(sourceDir),
+        );
+        toMove.forEach(f => {
+          deleteFile(f.path, tree);
+          writeFile(f.path.replace(sourceDir, destDir), f.content, tree);
+        });
+      }
+      writeFile(d.path, d.content, tree);
+    });
+
+    return Promise.resolve();
+  }
+
+  getMedia(mediaFolder = this.mediaFolder) {
+    const files = getFolderFiles(window.repoFiles, mediaFolder.split('/')[0], '', 100).filter(f =>
+      f.path.startsWith(mediaFolder),
+    );
+    const assets = files.map(f => this.normalizeAsset(f.content as AssetProxy));
+    return Promise.resolve(assets);
+  }
+
+  async getMediaFile(path: string) {
+    const asset = getFile(path, window.repoFiles).content as AssetProxy;
+
+    const url = asset.toString();
+    const name = basename(path);
+    const blob = await fetch(url).then(res => res.blob());
+    const fileObj = new File([blob], name);
+
+    return {
+      id: url,
+      displayURL: url,
+      path,
+      name,
+      size: fileObj.size,
+      file: fileObj,
+      url,
+    };
+  }
+
+  normalizeAsset(assetProxy: AssetProxy) {
+    const fileObj = assetProxy.fileObj as File;
+    const { name, size } = fileObj;
+    const objectUrl = attempt(window.URL.createObjectURL, fileObj);
+    const url = isError(objectUrl) ? '' : objectUrl;
+    const normalizedAsset = {
+      id: uuid(),
+      name,
+      size,
+      path: assetProxy.path,
+      url,
+      displayURL: url,
+      fileObj,
+    };
+
+    return normalizedAsset;
+  }
+
+  persistMedia(assetProxy: AssetProxy) {
+    const normalizedAsset = this.normalizeAsset(assetProxy);
+
+    writeFile(assetProxy.path, assetProxy, window.repoFiles);
+
+    return Promise.resolve(normalizedAsset);
+  }
+
+  deleteFiles(paths: string[]) {
+    paths.forEach(path => {
+      deleteFile(path, window.repoFiles);
+    });
+
+    return Promise.resolve();
+  }
+
+  async getDeployPreview() {
+    return null;
+  }
+}

node_modules/decap-cms-backend-test/src/index.ts

@@ -0,0 +1,8 @@
+import TestBackend from './implementation';
+import AuthenticationPage from './AuthenticationPage';
+
+export const DecapCmsBackendTest = {
+  TestBackend,
+  AuthenticationPage,
+};
+export { TestBackend, AuthenticationPage };