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

feat: modal implementation for data ingestion table #1244

Merged
merged 43 commits into from
Oct 16, 2024

Conversation

soleksy-splunk
Copy link
Contributor

@soleksy-splunk soleksy-splunk commented Jun 21, 2024

Issue number: ADDON-70993, ADDON-72969

Summary

Changes

Added a modal for data ingestion table view to show the specific data for input selector.

User experience

Users can see the data volume and number of events visualization chart for the particular row using the modal popup in data ingestion table.

Checklist

If your change doesn't seem to apply, please leave them unchecked.

@rohanm-crest rohanm-crest changed the title [DO NOT MERGE]feat: spike poc dashboard side panel feat: modal implementation for data ingestion table Sep 3, 2024
@rohanm-crest rohanm-crest self-assigned this Sep 4, 2024
@rohanm-crest rohanm-crest marked this pull request as ready for review September 4, 2024 09:26
@rohanm-crest rohanm-crest requested review from a team as code owners September 4, 2024 09:26
@soleksy-splunk
Copy link
Contributor Author

@rohanm-crest as there was data_ingestion_modal_definition.json created, there is also a need to adjust smoke tests accordingly
so to file tests/testdata/expected_addons/expected_files_conflict_test/expected_log.json
at the end you need to add

  "appserver/static/js/build/custom/resources_tab_definition.json                  created\u001b[0m": "INFO",
  "appserver/static/js/build/custom/data_ingestion_modal_definition.json           created\u001b[0m": "INFO"

instead of current

  "appserver/static/js/build/custom/resources_tab_definition.json                  created\u001b[0m": "INFO"

lets make sure pipelines passed and i will than check all of it

Copy link
Contributor Author

@soleksy-splunk soleksy-splunk left a comment

Choose a reason for hiding this comment

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

just a small thing i found after brief look

ui/src/pages/Dashboard/dashboardStyle.css Outdated Show resolved Hide resolved
@soleksy-splunk
Copy link
Contributor Author

some ideas regarding selector inside modal,

  1. selector with input shouldn't be a part of fetched JSON, as data for it we can get inside method handleDashboardEvent via events
targetId: "data_ingestion_table_ds"
type: "datasource.done"

inside payload there are all data from table, thanks to that we can have all inputs from first column and add it into selector,

Also it would be nice to have a separated selector (from definition.json) as we need to change json definition based on selector change) , if user clicks testInput2 we need to adjust search queries,
Similar mechanism is already done for search functionality

  1. We can always use as it is so keep selector input inside definition.json but
    cons:
    we will double number of search calls (maybe not issue as they are cached)
    we need to find a way to dynamically edit search query based on those changes

pros:
less flickering
everything from ui perspective is handled via dashboard components

Copy link
Contributor Author

@soleksy-splunk soleksy-splunk left a comment

Choose a reason for hiding this comment

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

Also lets remember to not marge it untill we align all dynamics part into this PR.

ui/src/pages/Dashboard/DataIngestion.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
@soleksy-splunk
Copy link
Contributor Author

soleksy-splunk commented Oct 3, 2024

unfortunately seems like number of events diagram does not work correctly

Screenshot 2024-10-03 at 16 47 44

here is a view even when it works for rest

Screenshot 2024-10-03 at 16 49 04

I got all data by creating addon like that

ucc-gen init --addon-name "demo_addon_for_splunk” —addon-display-name "Demo Add-on for Splunk" --addon-input-name demo_input

poetry install
cd ui && sudo yarn run setup
cd ..
cp -n -R ui/dist/build/ splunk_add_on_ucc_framework/package/appserver/static/js/build/

poetry run ucc-gen build --source demo_addon_for_splunk/package

poetry run ucc-gen package --path output/demo_addon_for_splunk

after that just fill accounts in configuration page and add some inputs inside inputs page, wait 1-5 min and you should have all diagrams

Copy link
Contributor Author

@soleksy-splunk soleksy-splunk left a comment

Choose a reason for hiding this comment

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

Some comments left

Also a question can we render dashboard components faster, as currently i believe we display dashboard panels after we get all data for drop down, but we should be displaying all at once and if anything goes wrong just hide drop down with inputs

ui/src/pages/Dashboard/DashboardModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DataIngestionModal.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/dashboardStyle.css Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/utils.tsx Show resolved Hide resolved
ui/src/pages/Dashboard/utils.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/utils.tsx Outdated Show resolved Hide resolved
ui/src/pages/Dashboard/DashboardModal.tsx Show resolved Hide resolved
Copy link
Contributor Author

@soleksy-splunk soleksy-splunk left a comment

Choose a reason for hiding this comment

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

all looks good except that line
https://github.com/splunk/addonfactory-ucc-generator/pull/1244/files#diff-1eb337cab3b2550b4dec3115308f2f424bf6fb4c614683016fa667efc5a6e734R20

seems like when we remove it we have errors that shouldn't occur, but due to i wasn't a ble to reproduce it on real environment and that PR is here for long time i would say lets merge it and fix that one in next branch

@soleksy-splunk soleksy-splunk enabled auto-merge (squash) October 16, 2024 10:21
@soleksy-splunk soleksy-splunk merged commit 8246870 into develop Oct 16, 2024
77 checks passed
@soleksy-splunk soleksy-splunk deleted the feat/spike-poc-dashboard-side-panel branch October 16, 2024 10:56
@github-actions github-actions bot locked and limited conversation to collaborators Oct 16, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants