Merge branch 'develop' into arm-platform

Author: raclim

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,12 @@
+blank_issues_enabled: false
+
+contact_links:
+  - name: 🌸 p5.js Issues
+    url: https://github.com/processing/p5.js/issues
+    about: Report issues with the p5.js here.
+  - name: 🌐 Website Issues
+    url: https://github.com/processing/p5.js-website/issues
+    about: Report issues with the p5.js website here.
+  - name: 💬 Forum
+    url: https://discourse.processing.org/c/p5js
+    about: Have other questions about using p5.js? Ask them here!

.github/ISSUE_TEMPLATE/existing-feature-enhancement.yml

@@ -0,0 +1,16 @@
+name: 💡 Existing Feature Enhancement
+description: Suggest an improvement to an existing feature.
+labels: [ Enhancement ]
+body:
+  - type: textarea
+    attributes:
+      label: Increasing Access
+      description: How would this new feature help [increase access](https://github.com/processing/p5.js/blob/main/contributor_docs/access.md) to the p5.js Web Editor? (If you're not sure, you can type "Unsure" here and let others from the community offer their thoughts.)
+    validations:
+      required: true
+
+  - type: textarea
+    attributes:
+      label: Feature enhancement details
+    validations:
+      required: true

.github/ISSUE_TEMPLATE/feature-request.yml

@@ -0,0 +1,16 @@
+name: 🌱 New Feature Request
+description: Request a new feature be added.
+labels: [ Feature Request ]
+body:
+  - type: textarea
+    attributes:
+      label: Increasing Access
+      description: How would this new feature help [increase access](https://github.com/processing/p5.js/blob/main/contributor_docs/access.md) to the p5.js Web Editor? (If you're not sure, you can type "Unsure" here and let others from the community offer their thoughts.)
+    validations:
+      required: true
+
+  - type: textarea
+    attributes:
+      label: Feature request details
+    validations:
+      required: true

.github/ISSUE_TEMPLATE/found-a-bug.yml

@@ -0,0 +1,76 @@
+name: 🐛 Found a Bug
+description: Report p5.js web editor bugs (broken or incorrect behaviour).
+labels: [ Bug ]
+body:
+  - type: markdown
+    attributes:
+      value: |
+        - Please make sure to [search for existing issues](https://github.com/processing/p5.js-web-editor/issues) before filing a new one!
+
+  - type: input
+    attributes:
+      label: p5.js version
+      description: You can find this in the first line of the p5.js file.
+    validations:
+      required: false
+
+  - type: dropdown
+    attributes:
+      label: What is your operating system?
+      options:
+        - Windows
+        - Mac OS
+        - Linux
+        - Android
+        - iOS
+        - Other (specify if possible)
+    validations:
+      required: false
+
+  - type: input
+    attributes:
+      label: Web browser and version
+      description: |
+        In the address bar, on Chrome enter `chrome://version`, on Firefox enter `about:support`. On Safari, use `About Safari`.
+    validations:
+      required: false
+
+  - type: textarea
+    attributes:
+      label: Actual Behavior
+      placeholder: What is currently happening.
+    validations:
+      required: true
+
+  - type: textarea
+    attributes:
+      label: Expected Behavior
+      description: |
+        If you want to include screenshots, paste them into the markdown editor below.
+      placeholder: What were you expecting?
+    validations:
+      required: true
+
+  - type: textarea
+    attributes:
+      label: Steps to reproduce
+      description: |
+        - Add steps to reproduce bugs or add information on the place where the feature should be implemented.
+        - Add links to a sample deployment or code.
+      value: "### Steps: 
+      
+              1.
+              2.
+              3.
+          
+              ### Snippet:
+              
+              ```js
+              
+              
+              // Paste your code here :)
+              
+              
+              ```"
+    validations:
+      required: true

.github/ISSUE_TEMPLATE/🌱-new-feature-request.md

@@ -20,3 +20,5 @@ terraform/.terraform/
 
 storybook-static
 duplicates.json
+
+coverage

.github/ISSUE_TEMPLATE/🐛-found-a-bug.md

@@ -0,0 +1,48 @@
+import React from 'react';
+import { Link } from 'react-router';
+import PropTypes from 'prop-types';
+
+/**
+ * Helper for switching between <button>, <a>, and <Link>
+ */
+const ButtonOrLink = ({ href, children, ...props }) => {
+  if (href) {
+    if (href.startsWith('http')) {
+      return (
+        <a href={href} target="_blank" rel="noopener noreferrer" {...props}>
+          {children}
+        </a>
+      );
+    }
+    return (
+      <Link to={href} {...props}>
+        {children}
+      </Link>
+    );
+  }
+  return <button {...props}>{children}</button>;
+};
+
+/**
+ * Accepts all the props of an HTML <a> or <button> tag.
+ */
+ButtonOrLink.propTypes = {
+  /**
+   * If providing an href, will render as a link instead of a button.
+   * Can be internal or external.
+   * Internal links will use react-router.
+   * External links should start with 'http' or 'https' and will open in a new window.
+   */
+  href: PropTypes.string,
+  /**
+   * Content of the button/link.
+   * Can be either a string or a complex element.
+   */
+  children: PropTypes.node.isRequired
+};
+
+ButtonOrLink.defaultProps = {
+  href: null
+};
+
+export default ButtonOrLink;

.github/ISSUE_TEMPLATE/💡-existing-feature-enhancement.md

@@ -0,0 +1,32 @@
+import React from 'react';
+import { render, screen, fireEvent } from '../test-utils';
+import ButtonOrLink from './ButtonOrLink';
+
+describe('ButtonOrLink', () => {
+  const clickHandler = jest.fn();
+
+  afterEach(() => {
+    clickHandler.mockClear();
+  });
+
+  it('can render a clickable button', () => {
+    render(<ButtonOrLink onClick={clickHandler}>Text</ButtonOrLink>);
+    const button = screen.getByRole('button');
+    expect(button).toBeInstanceOf(HTMLButtonElement);
+    expect(button).toContainHTML('<button>Text</button>');
+    fireEvent.click(button);
+    expect(clickHandler).toHaveBeenCalled();
+  });
+
+  it('can render an external link', () => {
+    render(<ButtonOrLink href="https://p5js.org">p5</ButtonOrLink>);
+    const link = screen.getByRole('link');
+    expect(link).toBeInstanceOf(HTMLAnchorElement);
+    expect(link).toHaveAttribute('href', 'https://p5js.org');
+  });
+
+  it('can render an internal link with react-router', () => {
+    render(<ButtonOrLink href="/about">About</ButtonOrLink>);
+    // TODO: how can this be tested? Needs a router provider?
+  });
+});