Resolve #295 and #407: Improve the UI/UX in adding/uploading resources

[seav]

Proposed changes in this pull request

• Make adding resources to projects, locations, parties, and relationships use modals consistently:
  • Add two new templates: resources/modal_add_lib.html and resources/modal_upload.html
  • Use these two new templates as a template for the 8 resource-adding/uploading templates
  • Add a tab bar to these modals to switch between adding a resource from the library or uploading a new resource
• Resolve Don't show the "Add from library" tab/button if there are no resources in the library #295:
  • Remove the tab bar mentioned above from the upload resource modals if there are no resources in the library
  • The changes above are facilitated by adding a project_has_resources context variable to all affected views, where the attribute is true if there are any resources belonging under the project
  • Update the view unit tests to reflect the new context variable
• Resolve Combine add resource options #407:
  • Convert the 2-set "Add from library"/"Upload new" buttons into a single "Add" button
  • Depending on whether the project library is empty or not (using the project_has_resources context variable mentioned above), this single "Add" button either links to the "Add from library" modal or the "Upload new" modal
• Make the messaging consistent for when there are no connected resources for locations, parties, and relationships in the place where resources are listed
• Improve styling of the add button associated with project data tables

Screenshots

Project that has resources in the library

Project that has an empty library

When should this PR be merged

• Needs manual functional testing:
  • Check all 8 modals for projects that have resources
  • Check 4 modals (only uploading new resources) for projects that don't have any resources
  • Check that the URL for canceling the 8 modals and switching tabs on the 8 modals are correct
  • Check that the resource-list messaging is consistent for locations, parties, and relationships that have no connected resources
• @clash99 should first review the UI/UX aspects of this PR (or it can be done as a follow-up action after the PR instead)

Risks

• No risks foreseen

Follow-up actions

• UI/UX review by @clash99, if not done before the PR is merged

[clash99]

This looks good but ideally everywhere will just have the one "add" button with the two tabs from there. This approach is to show the user available resources before adding new ones. I'm not sure why they became broken out.

[seav]

I see. OK, I'll try switching to the 1-button style with tabbed dialog boxes.

[oliverroick]

This snippet is added to five different classes, and we will likely need something similar for location-to-location and party-to-party relationships at some point. How about creating a mixin for this?

[seav]

I did think about creating a mixin, but these methods all currently access the project object in different ways. I think there's a get-project-object mixin for that and I'll try make all of these consistent and then build the resources mixin on top of that.

[oliverroick]

I think, all of these classes inherit ProjectMixin, so self.get_project() should be available everywhere.

[seav]

That should work perfectly.

Question: Do I subclass the project-has-resources mixin from ProjectMixin and inherit from that, or do I just do multiple inheritance from the ProjectMixin and the project-has-resources mixin?

[oliverroick]

You can do it either way. If you subclass your project-has-resources mixin from ProjectMixin, then you make sure self.get_project() is always available and you don't have to imply that ProjectMixin has been inherited before.

[seav]

That makes sense. I guess I was just wary of "incestuous" inheritances. I trust that Python is able to resolve the class family tree perfectly.

[ian-ross]

If you really want to understand how Python does method resolution for multiple inheritance, https://www.python.org/download/releases/2.3/mro/ is worth reading. There's a bit too much detail there, but there are some examples that will give you the idea.

[seav]

Hello @oliverroick and @clash99: I have resolved your comments. Please see the updated PR comment for the updated list of changes. I have also added #407 into this PR (use a single "Add" button instead of the 2-set buttons).

[oliverroick]

The placement of the add button looks a bit odd in the right-hand panel:

Otherwise, it's good to go. Let's see what @clash99 says.

[seav]

@oliverroick: I've updated the code to make the placement of the add button on the same row as the search bar if the add button is associated with project data tables. This includes the 4 types of resources data tables, as well as the relationships data table. Please see the following screenshots:

[oliverroick]

Good job, thanks! Merging this.