<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Muhammad Abu Foysal</title>
    <description>The latest articles on DEV Community by Muhammad Abu Foysal (@afoysal).</description>
    <link>https://dev.to/afoysal</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F172269%2F521e3dd6-130b-49ac-ad94-f72a7eb68bbc.png</url>
      <title>DEV Community: Muhammad Abu Foysal</title>
      <link>https://dev.to/afoysal</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/afoysal"/>
    <language>en</language>
    <item>
      <title>Module parse failed: Unexpected token error in ReactJS</title>
      <dc:creator>Muhammad Abu Foysal</dc:creator>
      <pubDate>Mon, 26 Sep 2022 13:20:52 +0000</pubDate>
      <link>https://dev.to/afoysal/module-parse-failed-unexpected-token-error-in-reactjs-dj8</link>
      <guid>https://dev.to/afoysal/module-parse-failed-unexpected-token-error-in-reactjs-dj8</guid>
      <description>&lt;p&gt;I have below code in my &lt;code&gt;StatusEditAdmission.jsx&lt;/code&gt; file.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://controlc.com/f800d4e7"&gt;https://controlc.com/f800d4e7&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I am getting &lt;code&gt;Module parse failed: Unexpected token (100:29)&lt;br&gt;
You may need an appropriate loader to handle this file type.&lt;/code&gt; error.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.stack.imgur.com/8KRkr.png"&gt;https://i.stack.imgur.com/8KRkr.png&lt;/a&gt;&lt;/p&gt;

</description>
      <category>react</category>
    </item>
    <item>
      <title>Usage of React Redux in Modal</title>
      <dc:creator>Muhammad Abu Foysal</dc:creator>
      <pubDate>Mon, 27 May 2019 11:41:11 +0000</pubDate>
      <link>https://dev.to/afoysal/usage-of-react-redux-in-modal-1icn</link>
      <guid>https://dev.to/afoysal/usage-of-react-redux-in-modal-1icn</guid>
      <description>&lt;p&gt;I am learning Redux in React. I am using Redux in React for Modal development. My code is like below&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;render() {
    return (
      &amp;lt;Modal id="addressModal" open={this.props.controlModal} onClose={this.props.action}&amp;gt;
        &amp;lt;Provider store={store}&amp;gt;
          {this.props.addresObj ? (
            &amp;lt;Modal.Header&amp;gt;Address Details&amp;lt;/Modal.Header&amp;gt;
          ) : (
            &amp;lt;Modal.Header&amp;gt;Insert Address&amp;lt;/Modal.Header&amp;gt;
          )}
          &amp;lt;Modal.Content&amp;gt;
              &amp;lt;ModalElement
                update={this.update}
                element={this.props.addresObj}
                errors = {this.state.errors}
                update_state_photo={this.update_state_photo}
                address={this.props.address}
                action={this.props.action}
              /&amp;gt;
          &amp;lt;/Modal.Content&amp;gt;

          &amp;lt;Modal.Actions&amp;gt;
            {this.props.addresObj ? (
              &amp;lt;Button
                positive
                icon="checkmark"
                labelPosition="right"
                onClick={this.closeModal}
                content="OK"
              /&amp;gt;
            ) : (
              &amp;lt;Button
                positive
                icon="checkmark"
                labelPosition="right"
                onClick={this.insertAddress}
                content="Save"
              /&amp;gt;
            )}
          &amp;lt;/Modal.Actions&amp;gt;
        &amp;lt;/Provider&amp;gt;
      &amp;lt;/Modal&amp;gt;
    );
  }
}
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;

&lt;p&gt;(Did I use &lt;code&gt;&amp;lt;Provider store={store}&amp;gt;&lt;/code&gt; properly ?) In child component I can't use Redux syntax. Like if I use this &lt;code&gt;export default connect()(EditableRow);&lt;/code&gt; I am getting error (component execution is not finish at that component, execution forwared). If I use this syntax &lt;code&gt;export default EditableRow;&lt;/code&gt; I am not getting any error.&lt;/p&gt;

&lt;p&gt;May be I could not express my issue properly. &lt;/p&gt;

&lt;p&gt;Here is my repo    &lt;a href="https://github.com/afoysal/mern/blob/master/client/src/components/ModalBody.js"&gt;https://github.com/afoysal/mern/blob/master/client/src/components/ModalBody.js&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I am getting below error.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.stack.imgur.com/GMzMj.png"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Iiar_Lyo--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://i.stack.imgur.com/GMzMj.png" alt="enter image description here"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;How to use Redux in React Modal ?&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
