Merge branch 'develop' into develop

Author: lindapaiste

client/modules/IDE/components/About.stories.jsx

@@ -0,0 +1,8 @@
+import About from './About';
+
+export default {
+  title: 'IDE/About',
+  component: About
+};
+
+export const Default = {};

client/modules/IDE/components/AssetPreview.stories.jsx

@@ -0,0 +1,13 @@
+import AssetPreview from './AssetPreview';
+
+export default {
+  title: 'IDE/AssetPreview',
+  component: AssetPreview
+};
+
+export const Default = {
+  args: {
+    url: 'https://p5js.org/assets/img/p5js.svg',
+    name: 'P5 Logo'
+  }
+};

client/modules/IDE/components/AssetSize.stories.jsx

@@ -0,0 +1,12 @@
+import AssetSize from './AssetSize';
+
+export default {
+  title: 'IDE/AssetSize',
+  component: AssetSize
+};
+
+export const Default = {
+  args: {
+    totalSize: 123
+  }
+};

client/modules/IDE/components/Console.stories.jsx

@@ -0,0 +1,8 @@
+import Console from './Console';
+
+export default {
+  title: 'IDE/Console',
+  component: Console
+};
+
+export const Default = {};

client/modules/IDE/components/ConsoleInput.stories.jsx

@@ -0,0 +1,8 @@
+import ConsoleInput from './ConsoleInput';
+
+export default {
+  title: 'IDE/ConsoleInput',
+  component: ConsoleInput
+};
+
+export const Default = {};

client/modules/IDE/components/CopyableInput.stories.jsx

@@ -0,0 +1,12 @@
+import CopyableInput from './CopyableInput';
+
+export default {
+  title: 'IDE/CopyableInput',
+  component: CopyableInput
+};
+
+export const Default = {
+  args: {
+    value: 'Lorem Ipsum'
+  }
+};

client/modules/IDE/components/EditableInput.jsx

@@ -31,6 +31,9 @@ function EditableInput({
       inputRef.current?.focus();
     }
   }, [isEditing]);
+  React.useEffect(() => {
+    setCurrentValue(value);
+  }, [value]);
 
   function beginEditing() {
     setIsEditing(true);

client/modules/IDE/components/EditableInput.stories.jsx

@@ -0,0 +1,13 @@
+import EditableInput from './EditableInput';
+
+export default {
+  title: 'IDE/EditableInput',
+  component: EditableInput
+};
+
+export const Default = {
+  args: {
+    value: 'an@email.com',
+    label: 'Example'
+  }
+};

client/modules/IDE/components/Feedback.stories.jsx

@@ -0,0 +1,8 @@
+import Feedback from './Feedback';
+
+export default {
+  title: 'IDE/Feedback',
+  component: Feedback
+};
+
+export const Default = {};

client/modules/IDE/components/FileUploader.stories.jsx

@@ -0,0 +1,8 @@
+import FileUploader from './FileUploader';
+
+export default {
+  title: 'IDE/FileUploader',
+  component: FileUploader
+};
+
+export const Default = {};