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.

Sign up for GitHub

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

Jump to bottom

[4.x] Blueprints sections and tabs #7669

Merged
merged 49 commits into from
Mar 14, 2023
Merged

[4.x] Blueprints sections and tabs #7669

merged 49 commits into from
Mar 14, 2023

Conversation

jasonvarga
Copy link
Member

@jasonvarga jasonvarga commented Mar 7, 2023 •
edited
Loading

Wiring up blueprint section/tab changes.

  • Sections are now called tabs. They were displayed as tabs, we might as well call them that.
  • Tabs are at the top level of a blueprint.
  • Tabs have sections, which are visual groups of fields.
  • Replicator/Bard fields now have their sets grouped. In the builder, they use the UI for tabs as "groups" and sections as "sets".
  • Implemented the Replicator/Bard set picker UI from [4.x] WIP New Bard/Replicator Set Picker #7579
  • Blueprint builder UI is rough. That'll be fixed in a separate PR.

Todo:

  • Adjust ensureField and related methods to handle section/tab changes.
  • Publish tabs should be highlighted red when there's an error within them.
  • Wire up components in replicator/bard.
  • Allow old blueprint format to just work.
  • Allow old replicator/bard set configs to just work.

@what-the-diff
Copy link

what-the-diff bot commented Mar 7, 2023

  • Changed the name of tab to section
  • Added a new prop for sections called "sectionId" and removed it from tabs component
  • Removed isTabExpanded property as we don't need it anymore (it was used in RegularField)
  • Renamed blueprint-tab class names with blueprint-section ones, except when they are inside .blueprint-add-tab container which will be renamed later on this PR
  • Added a new component called BlueprintSection
  • Updated the template to use this new component and pass it props
  • Imported uniqid, BlueprintSection, CanDefineLocalizable into script section of file
  • Defined mixins for CanDefineLocalizable in data() method
  • Defined components as an object with key value pair where key is name of component (BlueprintSection) and value is import statement from above step 3 (import BlueprintSections from './Sections')
  • Removed tabs from the blueprint editor.
  • Added sections to the publish form and configure tab, which are now just a list of fieldsets with no nesting or grouping possible (for now).
  • Updated edit-form component so that it doesn't have any special handling for tabs anymore since they don't exist in blueprints anymore either.
  • The publish tab component was updated to support sections.
  • A new Section class was added, which is used in the Tab class for handling section data and transforming it into a format that can be consumed by VueJS components (toPublishArray).
  • ManagesBlueprints controller now handles tabs with sections instead of just fields directly under them.

@jasonvarga
bind tab display and handle as inputs
b67c1ed
@jasonvarga
make tabs a tiny bit better
4e78960
@jasonvarga
upgrade draggable so we can use the distance option ...
267dd2d 
If you click a tab and slightly move your mouse, it thinks its a drag, so itll start moving instead of selecting the tab.
The distance option will only trigger the drag after moving that many pixels.
@jasonvarga
fix tab error states
e7d68b6
@jasonvarga
update tests ...
8a51938 
Mostly just indenting "fields" in tabs under "sections".
But also tweaking a couple tests to make sure that ensuring fields can handle sections appropriately.
@jasonvarga
fix ensuring and removing field logic
799cafb
@jasonvarga
strip out empty display and instructions
8fc7048
@jasonvarga
more fixes
46f0c64
@jasonvarga
more fixies
a0443c5
@jasonvarga
allow old blueprints to continue to work
c7a775a
@jasonvarga
old faithful
8862cc2
@jasonvarga
make field settings work
6be4945
@jasonvarga jasonvarga mentioned this pull request Mar 8, 2023
Closed
@jackmcdade jackmcdade added the 4.0 label Mar 9, 2023
jasonvarga and others added 15 commits March 9, 2023 17:05
@jasonvarga
keyboard navigation
16f01dd
@jasonvarga
mouse works with keyboard
bade0e1
@jasonvarga
ability to delete tabs
d4c25da
@jasonvarga
bring back tab requirement
18ffead
@jasonvarga
add tab instructions for replicator only
6d1b9c9
@jasonvarga
add section handle for replicator only
1bf4439
@jasonvarga
improve section/tab handling
88cfd60
@jasonvarga
support old config for replicator/bard sets
9cc42a6
@StyleCIBot
Apply fixes from StyleCI
e050c74
@jasonvarga
Merge branch 'blueprints' into blueprint-sections-tabs
80a1082
@jasonvarga
fix set picker
6828635
@jackmcdade @jesseleite
@jasonvarga @StyleCIBot
[4.x] More UI Improvements (#7589)
fec4762 
* Better Markdown fieldtype in small containers

* Let parent/global components handle body overflow

* Better contrast on a few icons

* Fix weird visual glitching on User fieldtype drag interaction

* Use proper data type

* Redesign the List Fieldtype

* [4.x] Redesign the Entry Listing UI/UX (#7668)

* Redesign the Entry Listing UI/UX

Now with better use of space, more intuitive UX, and responsive friendly

* Ensure query changes to a filter will refresh the view properly

* Wire up Terms Listing

* Wire up Users Listing (filters not working on the PHP side yet)

* Don't need this check for allowColumnPicker here

* Adjust bulk actions height

* Make role queryable like user groups currently are.

* Fix user role and group filter class queries (stache only atm).

* Allow fields to be filtered on users listing.

* Pass tests again.

* Responsive improvements

* Autofocus search when showing filters

* nextTick to the rescue

* Bind `f` to show filters (which autofocuses search).

* Fix errors on listings that don’t have search filter (ie. collections listing).

* Remove `$pinned` property from filters in php.

* Remove `$pinned` property from new filter stub.

* Remove pinned filter concept from Filters component.

---------

Co-authored-by: Jesse Leite <jesseleite@gmail.com>

* Ensure you can delete a select option

* [4.x] Way Better Listings (DataTables) (#7676)

* Make Status its own column

Co-Authored-By: Jason Varga <jason@pixelfear.com>

* Greatly improve the data-tables UI in every way

- titles will wrap to 2 lines max, will show the status dot if there's no status field shown
- relationship fields have a new little badge style and will truncate to each on one line
- content fields get smaller text and wrap to 2 lines max
- new status column
- title fields have a reasonable min-width set because they're important
- title fields will still show the status dot if the status column isn't visible
- date fields will no longer wrap to two lines
- wide tables will scroll horizontally instead of overflow, keeping the checkbox and actions columns in view at all times

* Refresh the ColumnPicker UI

* Apply fixes from StyleCI

---------

Co-authored-by: Jason Varga <jason@pixelfear.com>
Co-authored-by: StyleCI Bot <bot@styleci.io>

* Show (F) shortcut on Show Filter Controls tooltip

* Refresh Green with Tailwind Green

* temp color move from red to rose (actually tailwind red)

* Rename rose back to red

* Apply fixes from StyleCI

* Give buttons ever slightly more depth

* Add config option to always show Listing Filters

* Set it to false

* Horizontal scroll for asset listing, fix overflow issue w/ selected rows

* Differentiate between new btn-sm and btn-xs (old btn-sm)

* Better h1-h6 icons (new from Streamline)

* Add prop to disable Popover Clickaway behavior

* Refactor Bard Link to Popover, improve UX, and remove Sticky Toolbars

Sticky toolbars were pretty problematic in lots of edge cases. I feel like it's better to just stick to full screening or using the floating toolbar for editing lots of text and not relying on the sticky toolbar.

* Set new h1-h6 icons to currentColor

* reindent to remove unnecessary outdenting of entire file

* the html too

* teeny tiny unnecessary diff change

* Better date fields in tight quarters

* Fix Bard typography in Fullscreen Mode

* Fix some fullscreen editor issues

* Better replicator toolbar

* Only show asset folders on the first page of results

Closes #2829.

* Make Markdown keyboard shortcuts work on windows.

Closes #6024.

---------

Co-authored-by: Jesse Leite <jesseleite@gmail.com>
Co-authored-by: Jason Varga <jason@pixelfear.com>
Co-authored-by: StyleCI Bot <bot@styleci.io>
@jasonvarga
Bring back section handle syncing
db24531
@jasonvarga
move tab and tab content into their own components
bdc842a
@jasonvarga
Sync tab display and handle
ad147b3
@jasonvarga jasonvarga marked this pull request as ready for review March 14, 2023 15:22
@jasonvarga
Merge branch 'master' into blueprint-sections-tabs
f7592e6 
# Conflicts:
#	resources/js/components/blueprints/Builder.vue
#	resources/js/components/nav/TabEditor.vue
@jasonvarga jasonvarga merged commit b967f49 into blueprints Mar 14, 2023
@jasonvarga jasonvarga deleted the blueprint-sections-tabs branch March 14, 2023 18:02
This was referenced Mar 15, 2023
Closed
Merged
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@jasonvarga @jackmcdade @StyleCIBot