techrail / devta Goto Github PK

Issue: Inconsistent UI Design

Description

Components in this application has some UI inconsistencies. Common components like headers, button, input fields, copy text boxes and icon should follow some common styling.

Proposed Fix

• Make the components follow a common styling or build a custom reusable component that could be reused throughout the application.
• Refactor the headings with appropriate messages.
• Make sure that the text casing, headers and font-family is also consistent throughout components like headers, cards and text-inputs.
• Ensure buttons have appropriate colors based on their role (delete, copy, convert etc).

Description

The date picker gets cut off in mobile view for Date to Unix and Time zone converter.

Screenshots

Proposed fix

• Increase the height of the parent container for screens with max-width: 800px

Issue description

• The dark mode in markdown previewer for things like block quotes and tables shares the same css styles overload with the light mode.
• The code highlighting provided by highlight.js is only optimized for light mode and uses atom-one-light as the code theme.

Screenshots

Create a page where a user can upload an image file. The page will convert it to base64 and allow you to either copy a base64 value of the image which you can use in <img src="value" /> or allow you to download an HTML file which contains the img tag with the encoded value so that the user can just open it in a browser.

Hari has already done some work. The layout is not perfect but we can at least bring in the functionality to the project.

Feature request

I would like to propose the addition of a Json web Token(JWT) debugger that helps the debugging process by providing the users with a dedicated section that lets them analyze and verify the signature of the JWT tokens.

Key Functionalities

Some of the desired key functionalities for this feature is

• Token decoding
• Token validation
• Token inspection

Description

Requesting an autocomplete/search input for the sidebar that helps the user navigate to the component by just typing in the keywords instead of scrolling all the way down. With each feature addition, searching for components would require a lot of scrolling which can be avoided by implementing a searchbar.

Integrate a crontab expression functionality that provides information on when a scheduled task will be executed.
Example:

The current logo has yellow border to it.

Description

Requesting the addition of a component that helps in SQL formatting.

Key functionalities

• SQL Formatting.

We should totally have a CRON job expression parser in our list of tools!

Update the case of the routes from camel case to kebab case.

Description

The SQL formatter doesn't have any validation for queries and everything that is typed into the text area is rendered on the output regardless of the errors.

We need to clearly state on our index page that we do not send the data to any server for processing.

This issue requests addition of settings page. This page will allow user to customise Devta, things like indentation preference, theme and all can be placed here.

The output copy text area of the hash generator doesn't use the reusable output copy sections for single line and multi line. The content also gets cut off for SHA3, SHA224, SHA256, SHA384, SHA512 algorithms.

The JSON formatter has to be refactored so that it is consistent with the overall UI.

Other tasks include

• JSON validation during typing.
• Replacing the dropdown for the tab spacing with an input range.
• Move the copy and clear buttons to the right
• Add icons for beautify and minify
• Add a default placeholder

We must give credit to the third part libraries we have used!

Description

Requesting the addition of JSON to XML converter.

The output copy text area of the PostgreSQL URL Parser doesn't use the reusable output copy sections for single line and multi line. The content also gets cut off for language connector strings.

Search should work not just with Tool name. We should add some tags to tools and modify search to use those tags.
For e.g. Searching for database should show tools like Postgres URL Parser, SQL Formatter etc.

Right now hashing happens 1 second later reactivly at the change of input. We need to allow the user to push a button and see the change instantly.

Description

The timezone converter has a button that lets the user convert to different timezones. The button is disabled at the begining and becomes functional once all the refs like date, currentTimezone and requiredTimezone has values.
There is also another button called check that logs the above said refs on the console.

Current behaviour

The button is disabled at the beginning and even after updating the values of the date, currentTimezone and requiredTimezone refs, the disabled status is not being changed.

Expected behaviour

When all the three refs has values, the button should be enabled and should become clickable.

Other changes that has to be made includes,

• Removing the check button
• Improving the overall user interface by adding appropriate labels to the select, input and other relevant tags.
• Making other components like buttons, input fields, cards and other things like padding, margins consistent across the entire application

As the title suggests, this issue requests to add a github action workflow which will automatically build electron binaries and create a draft release.

Requesting an autofocus feature on the text fields/areas for all the components.

Description

The JSON converter should automatically convert the JSON whenever there is a change in the drop down menu instead of requiring the user to click a convert button.

Expected behavior

Conversion should be triggered whenever there is a change in the drop down menu.

Tasks

• The drop down menu should be disabled whenever the JSON is invalid. Use this as a reference.
• Remove the convert button and increase the size of the text area so that both the components (text area and drop down) occupy the full screen. This can be done by tweaking the height of the component with the id textInput

Changes to be done

UI responsiveness

• Make the ui responsive across all screens (mobile, tablets, and desktop)

Expected Behavior:
The sidebar should switch over to hamburger menu for small and medium screens

Actual Behavior:
There seems to be some gap between the breakpoints and the hamburger menu is not getting displayed in medium screens.

Existing converter improvements

• Make some necessary improvements to the functionalities of the converters and make the UI more intuitive.

Let's see if we get a webhook to discord server!!

Requesting a feature that lets the users test regular expressions.

For example, change the standard psql level URL parse to convert to PHP DB connection string and other formats.

Description

The markdown preview component doesn't have any styling for tables which makes it look misaligned on the output.

Other minor issues

• Output for the markdown preview has scrollbars by default.
• The parent component has scroll property instead of child (output card).

Screenshot

Proposed fix

This can be fixed by adding a css override for the markdown table.

Description

Requesting the change of dark theme CSS override from a11y-dark to atom-one-dark as the light theme uses atom-one-light styling.

Description

Requesting the addition of base64 decoder to the encoder component. This will enable the user to encode and decode the text side by side.