Re-introduce app provided model view override #3721

timizuoebideri1 · 2023-05-09T19:30:30Z

Closes: #3711

What's Changed

The latest commit has the following:

ExampleModel uses the Nautobot Default ObjectRetrieveView.
AnotherExampleModel uses a Customized ModelView from example_plugin.
Finally, the Location model uses OverridenView provided by example_plugin_with_view_override.

TODO

Explanation of Change(s)
Added change log fragment(s) (for more information see the documentation)
Attached Screenshots, Payload Example
Unit, Integration Tests
Documentation Updates (when adding/changing features)
Example Plugin Updates (when adding/changing features)
Outline Remaining Work, Constraints from Design

bryanculver · 2023-05-10T01:11:39Z

w8... wot?

What is the code in the retrieve to render the plugin's view instead of the core one? I would have thought we accidentally removed that.

Two points:

Let's use nautobot-ui components in our example: https://github.com/nautobot/nautobot/pull/3721/files#diff-d4a3993cc893833a26c36f02b1e8774b12a594c8b1dbba604613fc98d4eb14b7R1
Can you have it provide a view for its own model too?

examples/example_plugin/example_plugin/ui/index.js

timizuoebideri1 · 2023-05-10T20:02:53Z

Can you have it provide a view for its own model too?

Example Plugin has a model view

bryanculver

😵 OK so I think I understand how this is working now.

What I'd like to see is three examples when starting the app with the example_plugin is installed:

A model provided by example_plugin that uses what we provide for it's detail view (what should be working today)
A model providing its own view for its own model (I suppose this is working) but isn't technically an override. It just wants to define its own view.
A model providing an overridden view for another model that is not its own (the thing we have to use example_plugin_with_view_override for as @glennmatthews stated above)

For the latter two cases they should have their own discrete dictionary items in the index.js

Here are a list of my views for my models (maybe something like views: {"example_plugin:example_models": Component})
Here are a list of the views I want to override elsewhere (like the existing view_overrides)

glennmatthews · 2023-05-11T21:10:06Z

development/nautobot_config.py

@@ -33,6 +33,7 @@

 PLUGINS = [
    "example_plugin",
+    "example_plugin_with_view_override",


Shouldn't be enabled by default; again, it will break tests. It should only be enabled ad-hoc for demo purposes.

Ooooh i understand now 😔

…mizuoebideri1-3711-app-provided-model-view

…eveView from example_plugin_with_view_override/ui/index.js/

HanlinMiao · 2023-05-12T19:28:14Z

The latest commit has the following:

ExampleModel uses the Nautobot Default ObjectRetrieveView.
AnotherExampleModel uses a Customized ModelView from example_plugin.
Finally, the Location model uses OverridenView provided by example_plugin_with_view_override.

jathanism

📖 📓 📚

jathanism · 2023-05-12T20:53:35Z

...ples/example_plugin_with_view_override/example_plugin_with_view_override/ui/OverridenView.js

This file and view need to be renamed from OverridenView to OverriddenView for correct spelling of "overridden", or maybe since that kind of reads weird we might just name it OverrideView?

jathanism · 2023-05-12T20:55:47Z

examples/example_plugin_with_view_override/example_plugin_with_view_override/ui/index.js

-export { default as PluginFullWidthPageComponent } from "./FullWidthPage.jsx";
-export { default as ExamplePluginRetrieveViewOverride } from "./CustomView"
+export { default as PluginFullWidthPageComponent } from "./FullWidthPage";
+export { default as ExamplePluginOverridenModelView } from "./OverridenView";


Same rename to fix the typo needs to happen here, too, please.

examples/example_plugin/example_plugin/ui/index.js

nautobot/ui/src/utils/nav.js

nautobot/ui/src/utils/string.js

nautobot/ui/src/utils/utils.js

glennmatthews · 2023-05-16T19:11:30Z

examples/example_plugin/example_plugin/ui/FullWidthPage.js

+import { Box } from '@nautobot/nautobot-ui';
+
+export function MyFancyCard(props) {
+    return <Box body>I am a full-fledge component provided by the default example App. The ID of the object I am displaying is: {props.id}</Box>;


Suggested change

return <Box body>I am a full-fledge component provided by the default example App. The ID of the object I am displaying is: {props.id}</Box>;

return <Box body>I am a full-fledged component provided by the Example App. The ID of the object I am displaying is: {props.id}</Box>;

glennmatthews · 2023-05-16T19:12:49Z

examples/example_plugin/example_plugin/ui/NonModelView.jsx

Doesn't this belong in #3736 instead? Seems like there's a lot of duplicated code between the two PRs, can you clarify?

HanlinMiao · 2023-05-18T14:51:42Z

Removed changes in example_plugin_with_view_override, since we already proved that we can override the Location Detail View from an app.

glennmatthews

Code looks good to me. At some point we need to document this pattern in the app developer guide - is that in scope here?

HanlinMiao · 2023-05-18T20:27:50Z

Code looks good to me. At some point we need to document this pattern in the app developer guide - is that in scope here?

I think this story only entails the re-introduction of the app overrides. I will open a follow-up issue that tracks this.

HanlinMiao · 2023-05-18T20:34:02Z

Code looks good to me. At some point we need to document this pattern in the app developer guide - is that in scope here?

I think this story only entails the re-introduction of the app overrides. I will open a follow-up issue that tracks this.

#3773

bryanculver · 2023-05-19T19:42:27Z

examples/example_plugin/example_plugin/ui/index.js

+    view_overrides: {
+        "example-plugin:other-models": {
+            "retrieve": "ExampleAppOverrideModelView"
+        },
+    }


Can you just add one paragraph to our existing docs to this convention? Not perfect but starts getting these conventions documented.

timizuoebideri1 added 2 commits May 9, 2023 21:27

Reintroduce Plugin Override

7f25475

prettier

e6fc157

glennmatthews reviewed May 10, 2023

View reviewed changes

examples/example_plugin/example_plugin/ui/index.js Outdated Show resolved Hide resolved

bryanculver linked an issue May 10, 2023 that may be closed by this pull request

UI 2.0: App Provided Model View #3711

Closed

timizuoebideri1 added 4 commits May 10, 2023 20:34

Stage One: Add custom plugin route to nautobot ui route

d068938

Merge branch 'next' into u/timizuoebideri1-3711-app-provided-model-view

8d81405

Add example plugin override

50d73f4

update view

ca034f4

timizuoebideri1 requested a review from glennmatthews May 10, 2023 20:00

bryanculver requested changes May 11, 2023

View reviewed changes

Non Model Component Views

d61a56a

glennmatthews reviewed May 11, 2023

View reviewed changes

timizuoebideri1 and others added 7 commits May 12, 2023 06:11

Remove example app with override

7ee6d51

non model view complete

73da06b

merge upstream

bb8d670

rename CustomView to ModelView and move it to example_plugin

ac359ca

disable example_plugin_with_view_override

2bdea48

Merge branch 'next' of https://github.com/nautobot/nautobot into u/ti…

747f0cc

…mizuoebideri1-3711-app-provided-model-view

Override AnotherExampleModel retrieve view and override LocationRetri…

9f7c947

…eveView from example_plugin_with_view_override/ui/index.js/

jathanism suggested changes May 12, 2023

View reviewed changes

glennmatthews mentioned this pull request May 15, 2023

App Provided Non Model View -View Without an associated API #3736

Merged

7 tasks

address PR feedback

87291bf

timizuoebideri1 changed the base branch from next to u/timizuoebideri1-3712-app-non-model-view May 16, 2023 12:55

timizuoebideri1 changed the base branch from u/timizuoebideri1-3712-app-non-model-view to next May 16, 2023 12:55

revert some of the changes in example_plugin_with_view_override

5d1946f

glennmatthews reviewed May 16, 2023

View reviewed changes

revert more changes in example_plugin_with_view_override

c08cf35

Hanlin Miao added 2 commits May 17, 2023 11:40

revert FullWidthPage.js

d16c2bf

revert FullWidthPage.js

70d4aa5

timizuoebideri1 force-pushed the u/timizuoebideri1-3711-app-provided-model-view branch from 64d470c to 1ea2aa6 Compare May 17, 2023 16:04

check if my changes solid

315abcb

timizuoebideri1 force-pushed the u/timizuoebideri1-3711-app-provided-model-view branch from 1ea2aa6 to 315abcb Compare May 17, 2023 16:07

export DetailFieldValue

6508a29

glennmatthews approved these changes May 18, 2023

View reviewed changes

jathanism approved these changes May 19, 2023

View reviewed changes

bryanculver approved these changes May 19, 2023

View reviewed changes

Documentation on app provided model view override

ca1d4d5

HanlinMiao merged commit af0cc5f into next May 22, 2023
19 checks passed

HanlinMiao deleted the u/timizuoebideri1-3711-app-provided-model-view branch May 22, 2023 00:48

HanlinMiao mentioned this pull request May 22, 2023

UI 2.0: App Provided Model View #3711

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Re-introduce app provided model view override #3721

Re-introduce app provided model view override #3721

timizuoebideri1 commented May 9, 2023 •

edited by HanlinMiao

Loading

bryanculver commented May 10, 2023

timizuoebideri1 commented May 10, 2023 •

edited

Loading

bryanculver left a comment

glennmatthews May 11, 2023

timizuoebideri1 May 11, 2023

HanlinMiao commented May 12, 2023 •

edited

Loading

jathanism left a comment

jathanism May 12, 2023

jathanism May 12, 2023

glennmatthews May 16, 2023

glennmatthews May 16, 2023

HanlinMiao commented May 18, 2023

glennmatthews left a comment

HanlinMiao commented May 18, 2023

HanlinMiao commented May 18, 2023

bryanculver May 19, 2023

	return <Box body>I am a full-fledge component provided by the default example App. The ID of the object I am displaying is: {props.id}</Box>;
	return <Box body>I am a full-fledged component provided by the Example App. The ID of the object I am displaying is: {props.id}</Box>;

Re-introduce app provided model view override #3721

Re-introduce app provided model view override #3721

Conversation

timizuoebideri1 commented May 9, 2023 • edited by HanlinMiao Loading

Closes: #3711

What's Changed

TODO

bryanculver commented May 10, 2023

timizuoebideri1 commented May 10, 2023 • edited Loading

bryanculver left a comment

Choose a reason for hiding this comment

glennmatthews May 11, 2023

Choose a reason for hiding this comment

timizuoebideri1 May 11, 2023

Choose a reason for hiding this comment

HanlinMiao commented May 12, 2023 • edited Loading

jathanism left a comment

Choose a reason for hiding this comment

jathanism May 12, 2023

Choose a reason for hiding this comment

jathanism May 12, 2023

Choose a reason for hiding this comment

glennmatthews May 16, 2023

Choose a reason for hiding this comment

glennmatthews May 16, 2023

Choose a reason for hiding this comment

HanlinMiao commented May 18, 2023

glennmatthews left a comment

Choose a reason for hiding this comment

HanlinMiao commented May 18, 2023

HanlinMiao commented May 18, 2023

bryanculver May 19, 2023

Choose a reason for hiding this comment

timizuoebideri1 commented May 9, 2023 •

edited by HanlinMiao

Loading

timizuoebideri1 commented May 10, 2023 •

edited

Loading

HanlinMiao commented May 12, 2023 •

edited

Loading