FIO-5064: update libraries to the latest version of React

[mazlumtoprak]

Hey @AlexanderLihodievskiy

I installed a formio server with this Dockerimage and tried to create a react app with this repo. I found some routing issues, when displaying submissions. The View, Edit and Delete pages were always empty.

I made some changes in these files:

src/modules/events/components/EventPage.js
src/modules/events/components/EventsPage.js

I'm not sure yet, how to give you my suggestions. But you'll understand what I mean I guess :D

src/modules/events/components/EventPage.js [17-55]

  const Navbar = () => (
    <ul className="nav nav-tabs">
      <li className="nav-item">
        <Link className="nav-link" to={`/event`}>
          <i className="fa fa-chevron-left"></i>
        </Link>
      </li>
      <li className="nav-item">
        <Link className="nav-link" to={``}>
          <i className="fa fa-eye"></i> View
        </Link>
      </li>
      <li className="nav-item">
        <Link className="nav-link" to={`edit`}>
          <i className="fa fa-edit"></i> Edit
        </Link>
      </li>
      <li className="nav-item">
        <Link className="nav-link" to={`delete`}>
          <i className="fa fa-trash"></i> Delete
        </Link>
      </li>
    </ul>
  );

  return (
    <div>
      <Navbar />
      <Routes>
        <Route path="" element={<View />}/>
        <Route path="edit" element={<Edit />}/>
        <Route
          path="delete"
          element={(<SubmissionDelete formName={'event'} />)}
        />
      </Routes>
    </div>
  );
};

src/modules/events/components/EventPage.js [41-48]

          <Route
            path=":eventId/*"
            element={(
              <SubmissionProvider>
                <EventPage />
              </SubmissionProvider>
            )}
          />

If i Should do my own PR into yours , let me know. Glad for a feedback, since I am not too familiar with react.

Best regards

[AlexanderLihodievskiy]

Good afternoon. Thank you for your feedback. I fixed it and added changes to the PR.

On Sun, Jul 3, 2022 at 12:07 AM mazlumtoprak @.***> wrote:

Hey @AlexanderLihodievskiy https://github.com/AlexanderLihodievskiy

I installed a formio server with this Dockerimage https://github.com/calipseo/docker-formio/blob/master/Dockerfile and tried to create a react app with this repo. I found some routing issues, when displaying submissions. The View, Edit and Delete pages were always empty.

I made some changes in these files:

src/modules/events/components/EventPage.js src/modules/events/components/EventsPage.js

I'm not sure yet, how to give you my suggestions. But you'll understand what I mean I guess :D

src/modules/events/components/EventPage.js [17-55]

const Navbar = () => (

• View
• Edit
• Delete

);

return (

}/> }/> )} />

); };

src/modules/events/components/EventPage.js [41-48]

      <Route
        path=":eventId/*"
        element={(
          <SubmissionProvider>
            <EventPage />
          </SubmissionProvider>
        )}
      />

If i Should do my own PR into yours , let me know. Glad for a feedback, since I am not too familiar with react.

Best regards

— Reply to this email directly, view it on GitHub https://github.com/formio/react-app-starterkit/pull/42#issuecomment-1172960850, or unsubscribe https://github.com/notifications/unsubscribe-auth/AXPI52SSZ7RW22KNGI2X6KTVSCVQDANCNFSM5W5AH5OQ . You are receiving this because you were mentioned.Message ID: @.***>