docs: fix formatting in examples/create-react-app (#1943)

License: MIT
Signed-off-by: Nitin Patel <[email protected]>

Author: niinpatel

browser-create-react-app/public/manifest.json

@@ -1,6 +1,6 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "IPFS React App",
+  "name": "IPFS Create React App Example",
   "icons": [
     {
       "src": "favicon.ico",

browser-create-react-app/src/App.js

@@ -4,15 +4,15 @@ import useIpfs from './hooks/use-ipfs.js'
 import logo from './ipfs-logo.svg'
 
 const App = () => {
-  const { ipfs, ipfsInitError } = useIpfsFactory({commands: ['id']})
+  const { ipfs, ipfsInitError } = useIpfsFactory({ commands: ['id'] })
   const id = useIpfs(ipfs, 'id')
   return (
     <div className='sans-serif'>
-      <header className="flex items-center pa3 bg-navy bb bw3 b--aqua">
-        <a href="https://ipfs.io" title="home">
-          <img alt="IPFS logo" src={logo} style={{ height: 50 }} className='v-top' />
+      <header className='flex items-center pa3 bg-navy bb bw3 b--aqua'>
+        <a href='https://ipfs.io' title='home'>
+          <img alt='IPFS logo' src={logo} style={{ height: 50 }} className='v-top' />
         </a>
-        <h1 className="flex-auto ma0 tr f3 fw2 montserrat aqua">IPFS React</h1>
+        <h1 className='flex-auto ma0 tr f3 fw2 montserrat aqua'>IPFS React</h1>
       </header>
       <main>
         {ipfsInitError && (
@@ -26,20 +26,20 @@ const App = () => {
   )
 }
 
-const Title = ({children}) => {
+const Title = ({ children }) => {
   return (
-    <h2 className="f5 ma0 pb2 tracked aqua fw4 montserrat">{children}</h2>
+    <h2 className='f5 ma0 pb2 tracked aqua fw4 montserrat'>{children}</h2>
   )
 }
 
 const IpfsId = (props) => {
-  if  (!props) return null
+  if (!props) return null
   return (
     <section className='bg-snow mw7 center mt5'>
       <h1 className='f3 fw4 ma0 pv3 aqua montserrat tc'>Connected to IPFS</h1>
       <div className='pa4'>
         {['id', 'agentVersion'].map((key) => (
-          <div className="mb4" key={key}>
+          <div className='mb4' key={key}>
             <Title>{key}</Title>
             <div className='bg-white pa2 br2 truncate monospace'>{props[key]}</div>
           </div>

browser-create-react-app/src/App.test.js

@@ -6,4 +6,4 @@ it('renders without crashing', () => {
   const div = document.createElement('div')
   ReactDOM.render(<App />, div)
   ReactDOM.unmountComponentAtNode(div)
-});
+})

browser-create-react-app/src/hooks/use-ipfs-factory.js

@@ -13,8 +13,8 @@ let ipfs = null
  * so use-ipfs calls can grab it from there rather than expecting
  * it to be passed in.
  */
-export default function useIpfsFactory ({commands}) {
-  const [isIpfsReady, setIpfsReady] = useState(!!ipfs)
+export default function useIpfsFactory ({ commands }) {
+  const [isIpfsReady, setIpfsReady] = useState(Boolean(ipfs))
   const [ipfsInitError, setIpfsInitError] = useState(null)
 
   useEffect(() => {
@@ -34,11 +34,9 @@ export default function useIpfsFactory ({commands}) {
   async function startIpfs () {
     if (ipfs) {
       console.log('IPFS already started')
-
     } else if (window.ipfs && window.ipfs.enable) {
       console.log('Found window.ipfs')
-      ipfs = await window.ipfs.enable({commands})
-
+      ipfs = await window.ipfs.enable({ commands })
     } else {
       try {
         console.time('IPFS Started')
@@ -51,10 +49,10 @@ export default function useIpfsFactory ({commands}) {
       }
     }
 
-    setIpfsReady(!!ipfs)
+    setIpfsReady(Boolean(ipfs))
   }
 
-  return {ipfs, isIpfsReady, ipfsInitError}
+  return { ipfs, isIpfsReady, ipfsInitError }
 }
 
 function promiseMeJsIpfs (Ipfs, opts) {