* new about page
* h2 for second biggest header
* save and close goes to newui
* Create custom tab goes to coming soon page
* logo obviously links to home on same site, not old site
* link to switch to classic site
* lint
---------
Co-authored-by: burnettk <burnettk@users.noreply.github.com>
* new view to kick off process instance
* now ProcessModelCard can kick off an instance
* show total child items rather than using a slash
* some initial code to implement frontend from figma w/ burnettk
* updated homepage tab names w/ burnettk
* updated field names in new ui w/ burnettk
* moved nabar to wrapper component w/ burnettk
* added basics for dark mode w/ burnettk
* use spiff logo and colors w/ burnettk
* use spiff logo and colors w/ burnettk
* corrected hover colors in dark mode
* some additional formatting
* added tree view to start process page in v3 site w/ burnettk
* some cleanup for the tree view w/ burnettk
* removed unused side nav items w/ burnettk
* actually navigate to locations when clicking in nav bar w/ burnettk
* moved custom button inline with other items w/ burnettk
* moved used items from v2 ui to v3 and change paths to v3 to newui and old to newuiv2
* updated v2 code to match main so we can more easily compare against it
* revert v2 route as well to be like main
* some fixes and clean and added profile button w/ burnettk
* revert nav bar w/ burnettk
* update profile menu so it can log out w/ burnettk
* added dark mode button back w/ burnettk
* profile menu update w/ burnettk
* profile menu update w/ burnettk
* moved side nav into own component w/ burnettk
* make sure you have to logged in to see the new ui w/ burnettk
* stack icons on collapse
* allow profile menu to go beyond constraint of sidenav
* profile menu when collapsed
* make thing not overlap
* removed duplicate attribute
* get tasks from the api instead of mock data
* added waiting for column w/ burnettk
* fixed header names of new pages w/ burnettk
* swap colors
* updated some bgcolors w/ burnettk
* updated some of the theme colors w/ burnettk
* some more color cleanup w/ burnettk
* add border to table and background lighter like design
* more colors w/ burnettk
* add border
* add height to tab indicator props
* use macro colors
* persist theme selection in local storage
* h1 as god intended
* fix highlight on main nav
* new started by me view
* avoid hardcoding color because themes
* fetch process instances
* extract shared junk into components
* extract more shared junk
* some cleanup to the new workflow view w/ burnettk
* update button
* more tweaks and fixes to task table w/ burnettk
* match design
* some updateds to headertabs w/ burnettk
* make the create custom tab button look more like the other tabs w/ burnettk
* added view mode tile table toggle w/ burnettk
* add startopen script to allow all interfaces for dev server
* hide complete task play button if no task
* remove waiting for from tile if blank w/ burnettk
* implemented hide complete w/ burnettk
* show non active
* fixed var w/ burnettk
* do not show action if user cannot complete task w/ burnettk
* time ago ts
* added timeago in words to task table w/ burnettk
* some updates to timeago for typsescript w/ burnettk
* some formatting to the tile w/ burnettk
* move arrow to top right
* make the whole tile clickable if there is a task w/ burnettk
* default sidenav to collapsed on mobile
* tile views by default on mobile
* completely hide menu on mobile, not just collapse
* get rid of autocollapse on mobile code, since it is all hidden
* mobile nav
* improve mobile nav
* when you open the nav on mobile, it should always be expanded
* some minor support for user group select
* lint
* persistent top nav so you can always access menu on mobile
* implemented group by option w/ burnettk
* allow ungroup
* only show Ungrouped if it is grouped
* group by text
* use accent color when grouping tasks
* added text.accent for dark mode w/ burnettk
* copied task show elements to v3 folder w/ burnettk
* newui task show routes work w/ burnettk
* converted task show elements to mui w/ burnettk
* fixed up task show page a big w/ burnettk
* added padding to tash show page w/ burnettk
* modified colors for dark mode and consistency w/ burnettk
* added interstitial and progress pages to new ui w/ burnettk
* go to newui appropriately from interstitial
* allow grouping tasks by the process group of their instance
* scroll to the card when selecting from the left nav tree w/ burnettk
* move task details to bottom of tile w/ burnettk
* navigate back to home page when no more tasks w/ burnettk
* avoid cutting off right side of main content
* a little cleanup w/ burnettk
* some format updates to h tags w/ burnettk
* fix class name for carbon
* Newuiv3a (#2046)
* wip to get only runnable prcess models for start process model page w/ burnettk
* wip to get only runnable prcess models for start process model page w/ burnettk
* wrote out method to group by process group w/ burnettk
* added test for grouping by process group
* some cleanup to prepare to be merged into the main newuiv3 branch
* fixed mypy issues
* fixed tests
* fixed lint issues w/ burnettk
---------
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* try to fix animations
* remove favorites icon and update pi creation flow w/ burnettk
* remove carbon from interstital page w/ burnettk
* title is bpmn_name and name is bpmn_id
* slow fade transition from interstitial to homepage
* do a hilariously long fade in when going from interstitial to homepage
* show last process instance id saved on interstitial
* get rid of local storage
* move last instance to top and avoid on mobile
* avoid useEffect and rock local storage
* added some error display w/ burnettk
* moved v3 specific code to v3 dir w/ burnettk
* some code rabbit suggestions w/ burnettk
* more code rabbit w/ burnettk
* remove bad id w/ burnettk
---------
Co-authored-by: burnettk <burnettk@users.noreply.github.com>
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
Co-authored-by: Kevin Burnett <18027+burnettk@users.noreply.github.com>
* updated bpmn-js items
* updated dmn-js items as well
* fixed some linting
* some initial changes to make our dmn and user task handlers work better with react w/ burnettk
* removed unnecessary useEffects and existing form can be edited
* json schema form can set data properly from examples w/ burnettk
* some cleanup w/ burnettk
---------
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* updated bpmn-js items
* updated dmn-js items as well
* fixed some linting
* use main of bpmn-js-spiffworkflow
---------
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* some initial refactoring to react diagram editor for pi show page w/ burnettk
* pi show and pm file show are now working w/ burnettk
* some minor tweaks w/ burnettk
* pi show is mostly working - need to handle future states w/ burnettk
* pass the task into the call activity overly so we can check the state w/ burnettk
* added an svg icon for pre and post script icons
* convert the svg react component into an html string and give that to bpmn-js
* removed hardcoded check for script icon
* typo
---------
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* some initial refactoring to react diagram editor for pi show page w/ burnettk
* pi show and pm file show are now working w/ burnettk
* some minor tweaks w/ burnettk
* pi show is mostly working - need to handle future states w/ burnettk
* pass the task into the call activity overly so we can check the state w/ burnettk
* removed commented out code w/ burnettk
* fixed issue with process model new file not showing w/ burnettk
* fixed endless reload new bpmn file w/ burnettk
* do not bother zooming dmn tables w/ burnettk
* use a linke instead of a button to open the call activity so it can be opened in a new tab if desired w/ burnettk
* Revert "use a linke instead of a button to open the call activity so it can be opened in a new tab if desired w/ burnettk"
This reverts commit 1c12725cd3300ee3bcc5db9a3dffcc50ec40da6f.
* listen for auxclick to know if call activity should be opened in new tab w/ burnettk
---------
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* display the given when a task fails while on the progress page
* add task info to the error details on progress page and added foreign key from event table to task table w/ burnettk
* do not attempt to add error details if one cannot be found w/ burnettk
* delete pi events when tasks are deleted w/ burnettk
* fixed migration file w/ burnettk
* removed db migration changes w/ burnettk
* pyl w/ burnettk
---------
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* added migration detail table along with migration fe page w/ burnettk
* allow specifying bpmn process defintion when getting instance w/ burnettk
* added a test for migration reverting w/ burnettk
* added result states to migration page w/ burnettk
* updated spiffworkflow to fix migration revert issue w/ burnettk
* added test for the migration events api w/ burnettk
* fixed tests
* finished migration web page w/ burnettk
* coderabbit and other issues and added spiffworkflow-local realm and use that if running locally
* fixed pyl issue
* just check for the git revision key in tests instead of a value since the value could be None
* ruff
* updated configs for cypress tests
* use correct realm in ci
---------
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* Scaffold new UI homepage, hide current nav bar
* Layout set up
Divider was fiddly, but got the same setup as Figma now.
* Config to allow svg loading and imports etc. in Vite
Also moved preact from dev deps to deps (recommended).
* Configure app to use Poppins
Was a little tricky, had to isolate this from the rest of the app.
* Move icons from figma to app, set up menus
SVGs have to be exported from Figma, moved into assets in app, etc.
* Layout and SideMenu
Components and layout all set.
* Some basic global themeing knocked off from Web3
* Datagrid Layout complete
Nothing works and the data is contrived, but it's all matchy-matchy with the Figma view and so on.
* Menu items hover and rollover states
* Add card row
* useProcessInstances hook
Knocked off from the call logic in ProcessInstanceListTable
* Responsiveness
* Responsive tweaks
* Live data in grid etc.
* Phone responsive
* Responsivness working across all breakpoints
* Side menu height simplification
* more chips for milestone and status
* Basic client grid search
* Newui README and component notes.
* Add docs, cleanups, etc.
* Component docs
* Theme more robust
Also added framework for dark mode.
* Dark mode and theme enhancements
* Install signals integration for vite, cleanup, and working darkmode toggle.
* Update SpiffUIV2.tsx
* Toggle feature for menu items
Includes ability to swap icon and text on a toggle. Useful for dark mode toggle and possibly other things.
* User menu pinned to bottom of VH
Doesn't get lost if datagrid is long.
* Color fixes for dark mode, added in tokens where possible.
* Responsive Side Menu
* adjusted filter cards to dark mode
* Customize global themes for light and dark success/light/info/warning/error
Pushing use of tokens everywhere, took some wrangling but it's in place now.
Also fixed cards and a few other things to size more cleanly in responsive modes.
* Fix tab light/dark mode swap
Requires a bit more customiization of the theme.
* Slide transition for menu
* Solved very annoying MUI problem
If there is a scrollbar on the screen, opening a Select removes it. This is intentional (use can not scroll the screen while select is open) but it has the unfortunate consequence of removing the browser scrollbar is that it increases the viewport size, causing all responsive layout to shift. This tells it "leave it be".
Also add ability to feed in info to process instance hook.
* Refactor some items to make layouts more declarative.
We want the info window to be in the center-right of the view all the time, with some appropriate padding on the top-bottom, so regardless of the scroll position or window size they never lose it.
Also, responsiveness (will resize until MD breakpoint then hide).
* Refactor Dashboard to switch grids more cleanly
* Info panel wired up
* Task Collection, view hook etc.
* My Tasks search working
* Tab nav set up
* "Old" forms loading into "new" flyout window.
Had to move a few things around and dig into the routes, but got it up and running for demo.
* InfoPanel displays selections from different grid views
Built mini-factory to feed InfoPanel ReactNodes to render using selected grid item data.
* Info panel toolbar, formatting and light/dark settings.
* InfoPanel display with tasks
APIs need to be sorted out, there doesn't appear to be an easy way to get all Tasks for a given ProcessId at this point.
* Format dates in grids
* Wire everything up for working workflow (demo-worthy)
* Toggle for Row click panel open/close
* Completed and waiting tasks in info panel.
* Scrollable grids in the Dashboard view (no more page scrolling)
* Remove mystery zero
Stray truthy test was rendering the result (false, 0)
* Tweak to prevent child scrollbars from overlaying infopanel windows.
* had to install jsdom for Vue testing.
* Update package-lock.json
* Possibly ran npm i in the wrong directory hmm...
* add optional platform dep
* update lock file with optional dep info
* Add ESBuild (this package was not found)
There might be a global install but Vite/npm ain't seein' it.
* Trying to make esbuild optional (it might already be global)
* Accordions for tasks, and create a hook to enable some flexible customization.
* Updates and refactoring to make more (possibly) extension-ready components for the data displays.
* PI times summary report
Also cleaned up some MUI Dom errors/warnings.
* build images for newui
* revert some changes in package-lock that did not help
* Rebuilding repo (had "bad objects" error)
* Charts (mostly for demo)
* Responsive!
* Collapsible side menu
Added a button component suitable for the positioning/display, adjusted responsiveness (when the menu is collapsed, we need the grid to take up more room, and when the menu is naturally collapsed by screen size, we don't want the toggle button, etc.)
* Adjust menu to display abbreviated spiff logo when collapsed.
* Update DashboardCharts.tsx
* Inserted Paper wrapper for sidemenu
Makes the background responsive to dark mode (so it's not just more black surface).
* Update SideMenu.tsx
Fix positioning to accommodate new wrapper padding.
* First wave of theme changes, global font alterations, restructure nav to top
* Moving the design revamp along
Walking the line between the new ideas but using the current functionality and components (we don't have designs for where things lik the dark mode and logout buttons go, the toolbar was removed but now we need a place for the start process button, we still need the tabs, etc.).
* Moving new style along
Had to add custom background palette for dark/light mode.
* Carousel display and task cards for new display
* Grids, carousels, accordions, etc.
All in design requirement Desktop 27 (Figma file)
* All finished
Revamped, workflow implemented, rotating charts, dark mode checked, new scrollbars for more ipad-like feel, search working, etc. etc.
* Tweaks and good to go.
* Update MyProcesses.tsx
Remove console.log.
* Collapse process detail by default, and fix tasks label.
* Full screen containers
We don't want th default max width enforced by MUI.
* TopNav responsiveness and speedial
* Responsive grid areas
* Add task counts
* create a top level route for the new spiff ui from App.tsx w/ burnettk (#1586)
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
* Unused imports
* Clean up wonky pie chart.
* Remove hardcoded url
* Clean up info panel
* Fix menu button responsive text wrap wonk
* Put grid back
With data changes since there is more stuff in the first column (based on the design). I took a best guess.
* Remove cell focus outline with CSS overrides MUI
* Flyout Panel for demo (new look etc.)
* Task switching in panel.
* Cleanup tweaks pre-demo.
There is a bug in the "first select" of a row with tasks, I'm aware of it.
* Rework flow of data, make it simpler
Fixes a bug; when you clicked a PI row the first time, its tasks wouldn't load. If you did it again, everything worked. The way the code moved data to the InfoPanel was unclear, cleaning that up made the bug obvious.
* put back psycopg2 and mysqlclient
* Create useProcessModels.tsx
* Create useProcessGroups.tsx
* Update ProcessInstanceCard.tsx
Fixes task count display
* Refactor for top level routing
Keeping all views as children of SpiffUIV2 (will make swapping app easier).
* Update SpiffUIV2.tsx
Routing and view scaffolding set.
* Menu and button nice nice in dark mode etc.
* View transitions
* Process group/model data under control and feeding into view.
* Using RXJS for broadcasting to menu items.
* Update SpiffUIV2.tsx
* Config seemed broken (I couldn't start the app, Vite not found etc.)
I fixed by moving @preact/preset-vite to dependencies (this seems required, probably because it adds types and primitives that are used in runtime code or something) and making sure Node was up to date.
* Fix for Preact breaking rendering lifecycle
One of their PRs put a ridiculously low check on rerenders, and in dev/debug mode throws an app-crashing error, which affected the MUI-X Datagrid.
* Button components aware of stream
Also had to add a way for buttons to know what the view they nav to was loaded from the URL (e.g. a bookmark) to meet the design req.
* Have to make sure buttons that have no paths don't respond to href load logic.
* Layout for components, menu, treeview, theme tweaks
Needed to alter text.secondary at theme level to accommodate designs.
* Recurse through Process Group data to PM tree build tree for display
All set.
* Treeview complete
Also moved some things around to track with evolving app structure.
* Fully working tree with counters.
* Favorites/Recently used layout, components, icons, etc.
* Favorites and process groups displays
A bit naive, but for now gets the job done.
* Select of a group CArdor a group in the Tree updates view
Display PMs and PGs for any group, and some ideas to tie selecting a Card into the Tree. This kind of has to work, if you don't do it the tree seems useless.
* Create TreeItem wrapper
TreeItems don't carry any data that could be used for crumbs. Need to wrap TreeItem and add a property that lets you expand any node anywhere in the hierarchy.
* Update __init__.py
* Update StartProcess.tsx
Scrolling content area
* Tree expansion from cards working as expected
Have to do the collapse side of it, but so far so good. Also tweaks to scrolling area.
* Wrap search bar and padding tweaks
More explicit layout around child components.
* Tree/card tracking working.
Highlighting based on clicks, etc, very fancy.
* Tree -> Cards -> Tree fully working, starting breadcrumbs.
Breadcrumbs will be how this works on mobile, nobody will use the tree on a phone.
* Collapse button will be used all over
* More wiring details tree -> card -> tree -> search
When search returns results, the tree or card nav is no longer the control. Use imperative ref to wipe expanded nodes. Also, make sure that if models and groups are returned that the accordions expand.
Remove console logs.
* Cross group model highlighting
Tricky one: If you have several folders expanded in the tree, and are clicking through the models, if you click a model in a "non active" group, we have to clear the current group assets and load that group's. Since the cards come after the switch, they don't hear the clickstream that initiated them, so the model that was selected in the tree won't update the associated card's style. Fix that by passing in the lastSelected object to the cards and inspecting on init.
* Localstorage, favorites, default favorite view (vs. groups), etc.
* Guard no groups.
* Update StartProcess.tsx
Padding change opened up window, needed to adjust.
* Update StartProcess.tsx
* Update LocalStorageService.ts
Update empty string to empty array.
* Tree panel collapse/expand
With everything else going on, this was tricky to get responsive, but working as expected now. Also tweak to fix annoying thing in MenuItems. Also made sure dark mode tracks.
* Hover effects for cards and text cleanups
Hover is useless on touch screens, but otherwise this is a bit more in keeping with the design.
* Breadcrumbs, root element and favorites in collapse tree view, etc.
This pretty much nails it.
* Add Favorite Count
Add count to favorites indicators. Helps user make sense of "I'm clicking it why are no items loading (because there are zero favorites).
* Docs, cleanup
Also fix that NavBar logo issue in the "old" app.
* fix breadcrumb re-render issue when saving json file for first time w/ burnettk
* fix / ignore eslint issues
* add types for react-slick
* ignore ts error
* revert nav bar to undo logout logo change w/ burnettk
* Update spiffworkflow-frontend/src/a-spiffui-v2/views/Dashboards/infopanels/ProcessInfo.tsx
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
* Update spiffworkflow-frontend/src/a-spiffui-v2/views/StartProcess/StartProcess.tsx
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
---------
Co-authored-by: Tim Consolazio <tcoz@tcoz.com>
Co-authored-by: burnettk <burnettk@users.noreply.github.com>
Co-authored-by: jasquat <jasquat@users.noreply.github.com>
Co-authored-by: Kevin Burnett <18027+burnettk@users.noreply.github.com>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
