Apply Prettier to files touching Prism

Author: shepmaster

ui/frontend/.eslintrc.js

@@ -76,7 +76,11 @@ module.exports = {
         'BuildMenu.tsx',
         'ButtonSet.tsx',
         'Header.tsx',
+        'HelpExample.tsx',
         'Notifications.tsx',
+        'Output/OutputPrism.tsx',
+        'Output/PaneWithMir.tsx',
+        'Output/SimplePane.tsx',
         'PopButton.tsx',
         'Stdin.tsx',
         'actions.ts',

ui/frontend/.prettierignore

@@ -16,7 +16,11 @@ node_modules
 !BuildMenu.tsx
 !ButtonSet.tsx
 !Header.tsx
+!HelpExample.tsx
 !Notifications.tsx
+!Output/OutputPrism.tsx
+!Output/PaneWithMir.tsx
+!Output/SimplePane.tsx
 !PopButton.tsx
 !Stdin.tsx
 !actions.ts

ui/frontend/HelpExample.tsx

@@ -1,8 +1,7 @@
-import React, { useCallback } from 'react';
-import root from 'react-shadow';
-
 import 'prismjs/components/prism-rust.min';
+import React, { useCallback } from 'react';
 import { PrismCode } from 'react-prism';
+import root from 'react-shadow';
 
 import * as actions from './actions';
 import { useAppDispatch } from './hooks';
@@ -16,10 +15,7 @@ export interface HelpExampleProps {
 
 const HelpExample: React.FC<HelpExampleProps> = ({ code }) => {
   const dispatch = useAppDispatch();
-  const showExample = useCallback(
-    () => dispatch(actions.showExample(code)),
-    [dispatch, code]
-  );
+  const showExample = useCallback(() => dispatch(actions.showExample(code)), [dispatch, code]);
 
   return (
     <div className={styles.container}>
@@ -30,9 +26,7 @@ const HelpExample: React.FC<HelpExampleProps> = ({ code }) => {
         <link href={prismTheme} rel="stylesheet" />
 
         <pre>
-          <PrismCode className="language-rust">
-            {code}
-          </PrismCode>
+          <PrismCode className="language-rust">{code}</PrismCode>
         </pre>
       </root.div>
     </div>

ui/frontend/Output/OutputPrism.tsx

@@ -10,9 +10,7 @@ interface OutputPrismProps {
 
 const OutputPrism: React.FC<OutputPrismProps> = ({ languageCode, children }) => (
   <pre>
-    <PrismCode className={`${styles.container} ${languageCode}`}>
-      {children}
-    </PrismCode>
+    <PrismCode className={`${styles.container} ${languageCode}`}>{children}</PrismCode>
   </pre>
 );
 

ui/frontend/Output/PaneWithMir.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
 
 import Header from './Header';
-import SimplePane, { SimplePaneProps } from './SimplePane';
 import OutputPrism from './OutputPrism';
+import SimplePane, { SimplePaneProps } from './SimplePane';
 
 interface PaneWithMirProps extends SimplePaneProps {
   code?: string;
@@ -12,9 +12,7 @@ const PaneWithMir: React.FC<PaneWithMirProps> = ({ code, ...rest }) => (
   <SimplePane {...rest}>
     <div data-test-id="output-result">
       <Header label="Result" />
-      <OutputPrism languageCode="language-rust_mir">
-        {code}
-      </OutputPrism>
+      <OutputPrism languageCode="language-rust_mir">{code}</OutputPrism>
     </div>
   </SimplePane>
 );

ui/frontend/Output/SimplePane.tsx

@@ -2,15 +2,15 @@ import React from 'react';
 
 import Header from './Header';
 import Loader from './Loader';
-import Section from './Section';
 import OutputPrism from './OutputPrism';
+import Section from './Section';
 
 interface HighlightErrorsProps {
   children: React.ReactNode;
   label: string;
 }
 
-const onOutputPrismCopy: React.ClipboardEventHandler = event => {
+const onOutputPrismCopy: React.ClipboardEventHandler = (event) => {
   // Blank out HTML copy data.
   // Though linkified output is handy in the Playground, it does more harm
   // than good when copied elsewhere, and terminal output is usable on its own.
@@ -24,9 +24,7 @@ const onOutputPrismCopy: React.ClipboardEventHandler = event => {
 const HighlightErrors: React.FC<HighlightErrorsProps> = ({ label, children }) => (
   <div data-test-id="output-stderr" onCopy={onOutputPrismCopy}>
     <Header label={label} />
-    <OutputPrism languageCode="language-rust_errors">
-      {children}
-    </OutputPrism>
+    <OutputPrism languageCode="language-rust_errors">{children}</OutputPrism>
   </div>
 );
 
@@ -42,12 +40,16 @@ export interface ReallySimplePaneProps {
   error?: string;
 }
 
-const SimplePane: React.FC<SimplePaneProps> = props => (
+const SimplePane: React.FC<SimplePaneProps> = (props) => (
   <div data-test-id={`output-${props.kind}`}>
-    {(props.requestsInProgress > 0) && <Loader />}
-    <Section kind="error" label="Errors">{props.error}</Section>
+    {props.requestsInProgress > 0 && <Loader />}
+    <Section kind="error" label="Errors">
+      {props.error}
+    </Section>
     <HighlightErrors label="Standard Error">{props.stderr}</HighlightErrors>
-    <Section kind="stdout" label="Standard Output">{props.stdout}</Section>
+    <Section kind="stdout" label="Standard Output">
+      {props.stdout}
+    </Section>
     {props.children}
   </div>
 );