Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WIP]Expression editor conversion from HAML to React #8944

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

amalvijayan03
Copy link
Contributor

@amalvijayan03 amalvijayan03 commented Oct 26, 2023

Part of angular conversion task - Replace angular code #7603 > /miq_ae_class/:

Automation/Automate/Explorer/Datastore -> Select a Domain -> Select a Namespace -> Select a Class -> Add a New Method / Expression Editor

Sections in Pages and its file path - #8944 (comment)

image

@amalvijayan03 amalvijayan03 requested a review from a team as a code owner October 26, 2023 07:09
@jeffibm jeffibm self-assigned this Oct 26, 2023
@jeffibm jeffibm mentioned this pull request Oct 26, 2023
10 tasks
@jeffibm
Copy link
Member

jeffibm commented Oct 26, 2023

Hey @amalvijayan03 , could you please update the PR description on your findings about how the expression editor works?

@jeffibm
Copy link
Member

jeffibm commented Oct 26, 2023

Sections in the page and files

New Project (3)

@amalvijayan03
Copy link
Contributor Author

amalvijayan03 commented Oct 29, 2023

UI Flow: Expression Type Selection and Editing

- Selection of Expression Type:

  1. Upon selecting the "Type" as "Expression," the user interface dynamically updates to reveal additional editing options.

  2. Edit Expression and Selected Element Display:

  3. The "Edit Expression" and "Edit Selected Element" components become visible.

  • Edit Selecting Element:
  1. Within the "Edit Selected Element" section, there are around four dropdown menus.(The dropdown values are determined based on the condition we are selecting in the Expression Object dropdown in main info)
  2. The visibility of each dropdown is conditional and depends on the values selected in the previous dropdowns.
  • Expression Condition Selection:

1.Users can select expression conditions from the dropdown menus.
2.A user input text field is also available to receive values for the expression.

  • Committing the Selection:

    1. After the user commits the selected expression from the dropdowns, it is sent to the "Edit Expression" component.
    2. The object is updated with the newly selected expression.
  • Selectable Expressions:

  1. The newly added expression becomes selectable, enabling users to make further modifications.
  2. Conditional buttons (AND, OR, NOT) become enabled upon selecting the expression.
    Conditional Logic (AND, OR, NOT):
  3. If the user selects "AND" as the condition:
  4. The selected expression is converted into plain text.
  5. The "AND" condition is added.
  6. A new field is enabled to receive the next expression values.
  7. "AND" and "OR" conditions are added as suffixes to the initially selected expression.
  8. "NOT" is added as a prefix to an expression.

1. _exp_editor.html.haml:
This file setting JavaScript variables if a saved expression already exists when first showing the editor.
These variables are used to initialize the editor with the correct type and title.It sets up the UI components.
If there is a selected expression atom, it renders the editor for that atom.

2. _editor.html.haml:
This file handles the editing of individual expression elements
It determines the model for the expression element and offers options for selecting the type of element(AND, OR, NOT)
then renders the appropriate editor based on the selected element type.
Data is passed between these views through instance variables like @edit, which seems to contain information about the current state of the expression editor, including the selected expression atom, type, and title. This information is used to prefill values and manage the expression editing process.
filter.rb defines various methods related to filtering, searching, and handling expressions.

@miq-bot miq-bot added the wip label Oct 31, 2023
@miq-bot
Copy link
Member

miq-bot commented Oct 31, 2023

Checked commit amalvijayan03@94ca76d with ruby 2.6.10, rubocop 1.28.2, haml-lint 0.35.0, and yamllint
0 files checked, 0 offenses detected
Everything looks fine. 👍

@miq-bot
Copy link
Member

miq-bot commented Dec 4, 2023

This pull request is not mergeable. Please rebase and repush.

Comment on lines +30 to +44
export const DateParameters = [
{ id: 'choose', label: '<choose>' },
{ id: 'thishour', label: 'This Hour' },
{ id: 'lasthour', label: 'Last Hour' },
{ id: '2hoursago', label: '2 Hours Ago' },
{ id: '3hoursago', label: '3 Hours Ago' },
{ id: '4hoursago', label: '4 Hours Ago' },
{ id: '5hoursago', label: '5 Hours Ago' },
{ id: '6hoursago', label: '6 Hours Ago' },
{ id: '7hoursago', label: '7 Hours Ago' },
{ id: '8hoursago', label: '8 Hours Ago' },
{ id: '9hoursago', label: '9 Hours Ago' },
{ id: '10hoursago', label: '10 Hours Ago' },
{ id: '11hoursago', label: '11 Hours Ago' },
{ id: '12hoursago', label: '12 Hours Ago' },
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe we can reuse this - app/helpers/view_helper.rb

@miq-bot
Copy link
Member

miq-bot commented Jun 3, 2024

This pull request has been automatically marked as stale because it has not been updated for at least 3 months.

If these changes are still valid, please remove the stale label, make any changes requested by reviewers (if any), and ensure that this issue is being looked at by the assigned/reviewer(s).

@miq-bot miq-bot added the stale label Jun 3, 2024
@miq-bot
Copy link
Member

miq-bot commented Sep 9, 2024

This pull request has been automatically marked as stale because it has not been updated for at least 3 months.

If these changes are still valid, please remove the stale label, make any changes requested by reviewers (if any), and ensure that this issue is being looked at by the assigned/reviewer(s).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants