Rename jsx and scss files

renamer.js

+const fs = require('fs');
+const path = require('path');
+
+const componentsDir = path.resolve(__dirname, 'src', 'core', 'renderers');
+
+const components = fs.readdirSync(componentsDir);
+for (const component of components) {
+  if (!fs.statSync(path.resolve(componentsDir, component)).isDirectory()) continue;
+  const newJs = path.resolve(componentsDir, component, 'index.js');
+  fs.renameSync(path.resolve(componentsDir, component, 'index.jsx'), newJs);
+  const content = fs.readFileSync(newJs, { encoding: 'utf8' });
+  fs.writeFileSync(newJs, content.replace('stylesheet.module.scss', `${component}.module.scss`), { encoding: 'utf8' });
+  if (fs.existsSync(path.resolve(componentsDir, component, 'stylesheet.module.scss'))) fs.renameSync(path.resolve(componentsDir, component, 'stylesheet.module.scss'), path.resolve(componentsDir, component, `${component}.module.scss`));
+}
+console.log(components);

src/components/App/index.jsx → src/components/App/index.js

@@ -19,7 +19,7 @@ import { actions } from 'reducers';
 import { createUserFile, extension, refineGist } from 'common/util';
 import { exts, languages } from 'common/config';
 import { CONTRIBUTING_MD } from 'files';
-import styles from './stylesheet.module.scss';
+import styles from './App.module.scss';
 
 class App extends BaseComponent {
   constructor(props) {

src/components/Button/index.jsx → src/components/Button/index.js

@@ -5,7 +5,7 @@ import faExclamationCircle from '@fortawesome/fontawesome-free-solid/faExclamati
 import faSpinner from '@fortawesome/fontawesome-free-solid/faSpinner';
 import { classes } from 'common/util';
 import { Ellipsis } from 'components';
-import styles from './stylesheet.module.scss';
+import styles from './Button.module.scss';
 
 class Button extends React.Component {
   constructor(props) {

src/components/CodeEditor/index.jsx → src/components/CodeEditor/index.js

@@ -6,7 +6,7 @@ import { actions } from 'reducers';
 import { connect } from 'react-redux';
 import { languages } from 'common/config';
 import { Button, Ellipsis, FoldableAceEditor } from 'components';
-import styles from './stylesheet.module.scss';
+import styles from './CodeEditor.module.scss';
 
 class CodeEditor extends React.Component {
   constructor(props) {

src/components/Divider/index.jsx → src/components/Divider/index.js

 import React from 'react';
 import { classes } from 'common/util';
-import styles from './stylesheet.module.scss';
+import styles from './Divider.module.scss';
 
 class Divider extends React.Component {
   constructor(props) {

src/components/Ellipsis/index.jsx → src/components/Ellipsis/index.js

 import React from 'react';
-import styles from './stylesheet.module.scss';
+import styles from './Ellipsis.module.scss';
 import { classes } from 'common/util';
 
 class Ellipsis extends React.Component {

src/components/ExpandableListItem/index.jsx → src/components/ExpandableListItem/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import faCaretDown from '@fortawesome/fontawesome-free-solid/faCaretDown';
 import faCaretRight from '@fortawesome/fontawesome-free-solid/faCaretRight';
-import styles from './stylesheet.module.scss';
+import styles from './ExpandableListItem.module.scss';
 import { ListItem } from 'components';
 import { classes } from 'common/util';
 

src/components/Header/index.jsx → src/components/Header/index.js

@@ -20,7 +20,7 @@ import { classes, refineGist } from 'common/util';
 import { actions } from 'reducers';
 import { languages } from 'common/config';
 import { BaseComponent, Button, Ellipsis, ListItem, Player } from 'components';
-import styles from './stylesheet.module.scss';
+import styles from './Header.module.scss';
 
 class Header extends BaseComponent {
   handleClickFullScreen() {

src/components/ListItem/index.jsx → src/components/ListItem/index.js

 import React from 'react';
-import styles from './stylesheet.module.scss';
+import styles from './ListItem.module.scss';
 import { classes } from 'common/util';
 import { Button, Ellipsis } from 'components';
 

src/components/Navigator/index.jsx → src/components/Navigator/index.js

@@ -8,7 +8,7 @@ import faGithub from '@fortawesome/fontawesome-free-brands/faGithub';
 import { ExpandableListItem, ListItem } from 'components';
 import { classes } from 'common/util';
 import { actions } from 'reducers';
-import styles from './stylesheet.module.scss';
+import styles from './Navigator.module.scss';
 
 class Navigator extends React.Component {
   constructor(props) {

src/components/Player/index.jsx → src/components/Player/index.js

@@ -11,7 +11,7 @@ import { classes, extension } from 'common/util';
 import { TracerApi } from 'apis';
 import { actions } from 'reducers';
 import { BaseComponent, Button, ProgressBar } from 'components';
-import styles from './stylesheet.module.scss';
+import styles from './Player.module.scss';
 
 class Player extends BaseComponent {
   constructor(props) {

src/components/ProgressBar/index.jsx → src/components/ProgressBar/index.js

 import React from 'react';
 import { classes } from 'common/util';
-import styles from './stylesheet.module.scss';
+import styles from './ProgressBar.module.scss';
 
 class ProgressBar extends React.Component {
   constructor(props) {

src/components/ResizableContainer/index.jsx → src/components/ResizableContainer/index.js

 import React from 'react';
 import { classes } from 'common/util';
 import { Divider } from 'components';
-import styles from './stylesheet.module.scss';
+import styles from './ResizableContainer.module.scss';
 
 class ResizableContainer extends React.Component {
   handleResize(prevIndex, index, targetElement, clientX, clientY) {

src/components/TabContainer/index.jsx → src/components/TabContainer/index.js

@@ -6,7 +6,7 @@ import faPlus from '@fortawesome/fontawesome-free-solid/faPlus';
 import { classes } from 'common/util';
 import { actions } from 'reducers';
 import { languages } from 'common/config';
-import styles from './stylesheet.module.scss';
+import styles from './TabContainer.module.scss';
 
 class TabContainer extends React.Component {
   handleAddFile() {

src/components/ToastContainer/index.jsx → src/components/ToastContainer/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { connect } from 'react-redux';
 import { actions } from 'reducers';
 import { classes } from 'common/util';
-import styles from './stylesheet.module.scss';
+import styles from './ToastContainer.module.scss';
 
 class ToastContainer extends React.Component {
   componentWillReceiveProps(nextProps) {

src/components/VisualizationViewer/index.jsx → src/components/VisualizationViewer/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { connect } from 'react-redux';
 import { BaseComponent } from 'components';
 import { actions } from 'reducers';
-import styles from './stylesheet.module.scss';
+import styles from './VisualizationViewer.module.scss';
 import * as TracerClasses from 'core/tracers';
 import * as LayoutClasses from 'core/layouts';
 import { classes } from 'common/util';

src/core/renderers/Array2DRenderer/index.jsx → src/core/renderers/Array2DRenderer/index.js

 import React from 'react';
 import { Array1DRenderer, Renderer } from 'core/renderers';
-import styles from './stylesheet.module.scss';
+import styles from './Array2DRenderer.module.scss';
 import { classes } from 'common/util';
 
 class Array2DRenderer extends Renderer {

src/core/renderers/ChartRenderer/index.jsx → src/core/renderers/ChartRenderer/index.js

 import React from 'react';
 import { Bar } from 'react-chartjs-2';
 import { Array1DRenderer } from 'core/renderers';
-import styles from './stylesheet.module.scss';
+import styles from './ChartRenderer.module.scss';
 
 class ChartRenderer extends Array1DRenderer {
   renderData() {

src/core/renderers/GraphRenderer/index.jsx → src/core/renderers/GraphRenderer/index.js

 import React from 'react';
 import { Renderer } from 'core/renderers';
 import { classes, distance } from 'common/util';
-import styles from './stylesheet.module.scss';
+import styles from './GraphRenderer.module.scss';
 
 class GraphRenderer extends Renderer {
   constructor(props) {

src/core/renderers/LogRenderer/index.jsx → src/core/renderers/LogRenderer/index.js

 import React from 'react';
 import { Renderer } from 'core/renderers';
-import styles from './stylesheet.module.scss';
+import styles from './LogRenderer.module.scss';
 
 class LogRenderer extends Renderer {
   constructor(props) {

src/core/renderers/MarkdownRenderer/index.jsx → src/core/renderers/MarkdownRenderer/index.js

 import React from 'react';
 import { Renderer } from 'core/renderers';
-import styles from './stylesheet.module.scss';
+import styles from './MarkdownRenderer.module.scss';
 import ReactMarkdown from 'react-markdown';
 
 class MarkdownRenderer extends Renderer {

src/core/renderers/Renderer/index.jsx → src/core/renderers/Renderer/index.js

 import React from 'react';
-import styles from './stylesheet.module.scss';
+import styles from './Renderer.module.scss';
 import { Ellipsis } from 'components';
 import { classes } from 'common/util';