It uses autoFocus which may not be the right thing to do, but at least made it work inside the modal. There might be some further help on this in the following thread:

facebook/react#955

From this page click Open in template studio
"Could not load template, The template targets Cicero (^0.11.1) but the Cicero version is 0.10.2."
https://templates.accordproject.org/[email protected]

Same for most other templates I assume
https://templates.accordproject.org/

Provide a rich text editor that allows the user to embed clause templates.

Downloading an archive should include updated requests

When updating a model file with a new import with a from URL the model manager does not load the model.

E.g.,

Starting from the hello world template, and adding this line:

import org.accordproject.address.PostalAddress from https://models.accordproject.org/address.cto

Does not provide access too the address type.

It would be nice to have the option when creating a template from scratch

The Template studio layout should take better advantage of the screen real estate available, whenever possible.

It might be nice to have a welcome page in the template studio, maybe with the following options:

• Search template library
• New template (text only)
• New template (full)
• Drag and drop archive
• Load archive from URL

The current download archive button sometimes does not yield a consistent cta archive (e.g., sample is not saved from UI state).

Uploading a CTA archive from disk is currently broken (it does not complete).

It would be useful to allow multiple kinds of requests for execution, currently it only loads one requests request.json from the archive.

This could be done by having a create test button on the execution tab. We may need a test pane.

Currently some of the pre-propulated links do not work since they point to prior versions of the templates for which a local CTA archive has not been created.

If you load some contract text that is not much longer than a 100 lines. Then the browser hangs and crashes.

It would be helpful for anyone reviewing a contract to see what changes have been made, Like git differences.

This would be especially handy if this is a standard contract that everyone in the idustry used. It would be easy to spot the differences between current contract and the one in the github repository.

When editing, it would be nice if changes to the contract text (e.g., name of a party) could be replaced everywhere in the contract.

This might require some level of UI tooling (e.g., a 'search/replace' button) but also require improvements to the template support in Cicero (e.g.,: accordproject/template-archive#4)

The model tab is nested for no good reason, model files should be moved to the top-level tab.

There seems to be some state conflict between the Ergo and the Model errors in CodeMirror (error in model showing underlining in the logic window!).

TSv1 uses Menlo by default and the CSS does not fall back to a reasonable monospace fonts. Menlo isn't supported on Windows so this breaks the UI. This is particularly confusing with the error messages which rely on monospace:

https://microsoft.github.io/monaco-editor/

currently, the pattern used for setting the React component's state is dangerous because const state = this.state does not clone this.state. it's a reference to the state object, which means when you assign state.loading = false you are mutating the state object directly. we could deeply clone the state object and modify the clone, but what we should really do is usesetState to update just the properties on state we want to update.

for example, the current code:

handleLoadingFailed(message) {
        const state = this.state;
        state.loading = false;
        state.loadingFailed = true;
        state.log.loading = message;
        this.setState(state);
    }

would become:

handleLoadingFailed(message) {
        this.setState({
            loading: false,
            loadingFailed: true,
            log: {
                ...this.state.log,
                loading: message
            }
        });
    }

My screen resolution is 1920x1080, and I see this when I visit the site.

It also messes with the "contribute on github" banner

The template studio does not handle namespace change in the model properly.

Currently, it returns a hard to understand error, because it fails to find the model that has been changed in the model manager.

(Reported by @mttrbrts)

The template studio currently loads the template index for the AP template library from a local copy. It should use the published index instead.

There are all kinds of reasons loading a template might fail, e.g., wrong Cicero version, missing package.json, etc.

We should provide an error message when that happens.

Currently, loading a template without logic raises an error.

Changes to template name or version should be considered a 'change' to the current template

e.g., load a new template when current template has been changed
e.g., browser exit when previous template has been changed

It would be useful to clearly document and automatically test linter rules on template studio.

A good set of rules for code quality was open-sourced and made public at: https://www.npmjs.com/package/@clausehq/eslint-config

When using a template archive locally (for example with cicero execute), I may want to seed/reuse the JSON and Text values from Template Studio.

We could make this easier by adding a download button (or link) to each of the fields in the Test Execution panel. It would also be helpful to be able to download the sample.txt and grammar.tem individually too.

Currently, the number of models and logic files is fixed based on the loaded templates. It would be good to be able to add new empty model or logic files.

Feature request - Although there is a search box to look at the list of templates available, it would be nice to have a button that links to https://templates.accordproject.org/ (to see full list of templates and explanations).

The field cicero.template in package.json indicates either clause or contract and is used to check against which super type the contract template must be defined.

We should support editing it and trigger refresh when it is changed.

Upload of template archive files would allow for 'roundtripping' of templates. For example, a lawyer could create the grammar and model, download the template and share it with their engineer, the engineer uploads the template and adds the Ergo logic etc.

The template tab has the version number, which used to be editable. It's frozen now.

Hi,
I am trying to configure template studio project into the IIS 8. Gave the "...\template-studio\src" path into the site physical path.
Node.js other projects are working fine on my machine via IIS. But "template-studio" is not working correctly. Only white page with "Contribute on GitHub" label is visible.

When I run this project via "npm run start" project runs successfully at localhost:8080.

I am running Windows 8.1 x64
Internet Information Services 8.5.9600.16384

Can someone please help me in configurations?

React state management is getting pretty complex in Template Studio, with a lot of callback handlers. We should consider switching to Redux:

https://redux.js.org/introduction/getting-started
https://react-redux.js.org

We modularize Template Studio into a set of discrete React components, which interact via Redux.

Ergo (Logic) Editor

• Based on https://github.com/react-monaco-editor/react-monaco-editor
• We should refactor the VSCode plugin to share the same Language Server and use it with the Monaco editor. https://github.com/TypeFox/monaco-languageclient
• https://langserver.org
• Existing LSP: https://github.com/accordproject/ergo-vscode-plugin/blob/master/server/src/server.ts

Concerto (Model) Text Editor

• Build a new LSP implementation for Concerto, based on https://github.com/hyperledger/composer-vscode-plugin/blob/master/server/src/server.ts
• Use Monaco to edit CTO files

Concerto (Model) Graphical Editor

• Viewer/editor for Concerto models as interactive UML style diagram, using https://github.com/projectstorm/react-diagrams

Concerto (Model) Form-based Editor

• Viewer/editor for Concerto models as a set of class declarations, with properties specified using actions and forms (Add Concept, Add Transaction etc).

Template Library Component

• https://github.com/accordproject/react-components
• Configurable component to view the contents of an AP format template library

Clause Plugin

• A plugin for the contract editor that knows how to both Edit and Design AP Clauses https://github.com/accordproject/contract-editor/blob/master/src/plugins/clausePlugin.js
• In Edit mode only variable values can be supplied
• In Design mode the grammar text can be edited, variables inserted and their types specified

Contract Editor (extends markdown-editor)

• https://github.com/accordproject/contract-editor
• In Edit mode can supply values for variables and edit the text of the contract
• In Design mode new variables can be inserted and can drag-drop Clauses into the contract

Concerto Form Component

• Generate a web form to edit an instance of a Concerto model
• https://www.npmjs.com/package/concerto-form-react
• Use to edit request.json to test a contract
• Use to visualise response.json and state.json

Package.json Editor

• Based on Monaco JSON file support

README.md Editor

• Based on markdown-editor

Currently the template library is 'baked in'. We might want to allow users to pass a template library URI to load their own templates

To reproduce:

1. Edit model, changing variable name for the template
2. Edit grammar, changing same variable name

This should reproduce the JSON with the new name rather than indicate and error

It would be useful to allow to pass a template URI when loading the studio. The studio would automatically load that template.

This should be linked to changes on the template's package.json

'Reset' is used in two places with very different meaning: for the whole template, and for the contract state when testing execution.

This can be a big confusing. We might want to rename those buttons (e.g., "Revert changes" and "Initialize Contract").