EDI+

Screenshot

A tool for viewing and editing EDI files

👥

Team Members

📄

Project Abstract

EDI+ is a desktop application that simplifies the process of viewing and editing for users who are not familiar with EDI standards. The intuitive user interface allows users to easily navigate and understand the EDI file structure, while the built-in editor provides a seamless editing experience. Each section of the EDI file is displayed in its own dropdown menu with each element within written human-readable language, making it easy to understand the file structure. The application currently only supports X12 837 EDI files.

The format of an EDI file is not human-readable, and the process of editing an EDI file requires deep understanding of pre-existing structures and the order of the segments. Our application streamlines this process using a in-house parser that takes in EDI files and directly converts them to dropdown menu structure.

The user can edit the elements within each segment and see their changes reflected in real time in the unparsed file displayed in the application and vice versa. An indicator will be shown when the user has unsaved changes in a file. If the user wishes, they can save the changes into a new file. These features reduce the likelihood of errors and saving users valuable time.

EDI+ can be extremely beneficial to any industry professional who has to interact and utilize EDI files. They can take advantage of the robust features of EDI+ and streamline their workflow.

📝

Project Description

EDI+ was built using Electron and React. Electron is a Chromium-based tool for rendering website-type content as a desktop application that makes cross-platform development as convenient as building a traditional website. React is a powerful JavaScript library that provides a powerful framework for component-based UI development.

The application opens to a prompt inviting the user to open a file. Screenshot

Upon opening a file, the built-in EDI-837 parser is automatically applied to display the file contents in a human-readable format. So, while the editor allows a user to open any file type, all other file types will be at the mercy of the parser. Also, note that multiple files can be opened at once with different unsaved edits across each of them. Screenshot In the image above, notice that there are two views open at once: the raw view (left) and the parsed view (right). Editing is intended to be done in the text-boxes of the parsed view, but both sides are editable with changes appearing in both sides.

There is a settings menu that currently contains the dark-mode setting. It's built to be scalable so that developers can add future settings with ease. Screenshot

Shows the application opening multiple files through clickable tabs. Screenshot

Shows the application after clicking open on he file menu to bring up a open file window dialog. Screenshot

Shows how the user can modify the contents of the EDI file to change different properties and data. Screenshot