open-consul/ui/packages/consul-ui/app/services/repository/service-instance.js

43 lines
1.3 KiB
JavaScript
Raw Normal View History

/**
* Copyright (c) HashiCorp, Inc.
* SPDX-License-Identifier: MPL-2.0
*/
import RepositoryService from 'consul-ui/services/repository';
import { set } from '@ember/object';
import { ACCESS_READ } from 'consul-ui/abilities/base';
ui: DataSource Decorator (#9746) We use a `<DataSource @src={{url}} />` component throughout our UI for when we want to load data from within our components. The URL specified as the `@src` is used to map/lookup what is used in to retrieve data, for example we mostly use our repository methods wrapped with our Promise backed `EventSource` implementation, but DataSource URLs can also be mapped to EventTarget backed `EventSource`s and native `EventSource`s or `WebSockets` if we ever need to use those (for example these are options for potential streaming support with the Consul backend). The URL to function/method mapping previous to this PR used a very naive humongous `switch` statement which was a temporary 'this is fine for the moment' solution, although we'd always wanted to replace with something more manageable. Here we add `wayfarer` as a dependency - a very small (1kb), very fast, radix trie based router, and use that to perform the URL to function/method mapping. This essentially turns every `DataSource` into a very small SPA - change its URL and the view of data changes. When the data itself changes, either the yielded view of data changes or the `onchange` event is fired with the changed data, making the externally sourced view of data completely reactive. ```javascript // use the new decorator a service somewhere to annotate/decorate // a method with the URL that can be used to access this method @dataSource('/:ns/:dc/services') async findAllByDatacenter(params) { // get the data } // can use with JS in a route somewhere async model() { return this.data.source(uri => uri`/${nspace}/${dc}/services`) } ``` ```hbs {{!-- or just straight in a template using the component --}} <DataSource @src="/default/dc1/services" @onchange="" /> ``` This also uses a new `container` Service to automatically execute/import certain services yet not execute them. This new service also provides a lookup that supports both standard ember DI lookup plus Class based lookup or these specific services. Lastly we also provide another debug function called DataSourceRoutes() which can be called from console which gives you a list of URLs and their mappings.
2021-02-23 08:56:42 +00:00
import dataSource from 'consul-ui/decorators/data-source';
const modelName = 'service-instance';
export default class ServiceInstanceService extends RepositoryService {
getModelName() {
return modelName;
}
2021-10-07 11:38:04 +00:00
shouldReconcile(item, params) {
return super.shouldReconcile(...arguments) && item.Service.Service === params.id;
}
ui: feature-flagged peering mvp (#13425) * add peers route * add peers to nav * use regular app ui patterns peers template * use empty state in peers UI * mock `v1/peerings` request * implement custom adapter/serializer for `peers`-model * index request for peerings on peers route * update peers list to show as proper list * Use tailwind for easier styling * Unique ids in peerings response mock-api * Add styling peerings list * Allow creating empty tooltip To make it easier to iterate over a set of items where some items should not display a tooltip and others should. * Add tooltip Peerings:Badge * Add undefined peering state badge * Remove imported/exported services count peering This won't be included in the initial version of the API response * Implement Peerings::Search * Make it possible to filter peerings by name * Install ember-keyboard For idiomatic handling of key-presses. * Clear peering search input when pressing `Escape` * use peers.index instead of peers for peerings listing * Allow to include peered services in services-query * update services mock to add peerName * add Consul::Peer component To surface peering information on a resource * add PeerName as attribute to service model * surface peering information in service list * Add tooltip to Consul::Peer * Make services searchable by peer-name * Allow passing optional query-params to href-to * Add peer query-param to dc.services.show * Pass peer as query-param services listing * support option peer route-param * set peer-name undefined in services serializer when empty * update peer route-param when navigating to peered service * request sercice with peer-name if need be * make sure to reset peer route-param when leaving service.show * componentize services.peer-info * surface peer info services.show * make sure to reset peer route-param in main nav * fix services breadcrumb services.intentions we need to reset peer route-param here to not break the app * surface peer when querying for it on service api call * query for peer info service-instance api calls * surface peer info service-instance.show * Camelize peer attributes to match rest of app * Refactor peers.index to reflect camelized attributes for peer * Remove unused query-params services.show * make logo href reset peer route-param * Cleanup optional peer param query service-instance * Use replace decorator instead of serializer for empty peerName * make sure to only send peer info when correct qp is passed * Always send qp for querying peers services request * rename with-imports to with-peers * Use css for peer-icon * Refactor bucket-list component to surface peer-info * Remove Consul::Peer component This info is now displayed via the bucket-list component * Fix bucket-list component to surface service again * Update bucket-list docs to reflect peer-info addition * Remove tailwind related styles * Remove consul-tailwind package We won't be using tailwind for now * Fix typo badge scss * Add with-import handling mock-api nodes * Add peerName to node attributes * include peers when querying nodes * reflect api updates node list mock * Create consul::node::peer-info component * Surface peer-info in nodes list * Mock peer response for node request * Make it possible to add peer-name to node request * Update peer route-param when linking to node * Reset peers route-param when leaving nodes.show We need to reset the route-param to not introduce a bug - otherwise subsequent node show request would request with the old peer query-param * Add sourcePeer intentions api mock * add SourcePeer attr to intentions model * Surface peering info on intentions list * Request peered intentions differently intentions.edit * Handle peer info in intentions/exact mock * Surface peering info intention view * Add randomized peer data topology mock * Surface peer info topology view * fix service/peer-info styling We aren't using tailwind anymore - we need to create a custom scss file * Update peerings api mocks * Update peerings::badge with updated styling * cleanup intentions/exact mock * Create watcher component to declaratively register polling * Poll peers in background when on peers route * use existing colors for peering-badge * Add test for requesting service with `with-peers`-query * add imported/exported count to peers model * update mock-api to surface exported/imported count on peers * Show exported/imported peers count on peers list * Use translations for service import/export UI peers * Make sure to ask for nodes with peers * Add match-url step for easier url testing of service urls * Add test for peer-name on peered services * Add test for service navigation peered service * Implement feature-flag handling * Enable peering feature in test and development * Redirect peers to services.index when feature-flag is disabled * Only query for peers when feature is enabled * Only show peers in nav when feature is enabled * Componentize peering service count detail * Handle non-state Peerings::Badge * Use Peerings::ServiceCount in peerings list * Only send peer query for peered service-instances. * Add step to visit url directly * add test for accessing peered service directly * Remove unused service import peers.index * Only query for peer when peer provided node-adapter * fix tests
2022-06-23 13:16:26 +00:00
@dataSource('/:partition/:ns/:dc/service-instances/for-service/:id/:peer')
ui: DataSource Decorator (#9746) We use a `<DataSource @src={{url}} />` component throughout our UI for when we want to load data from within our components. The URL specified as the `@src` is used to map/lookup what is used in to retrieve data, for example we mostly use our repository methods wrapped with our Promise backed `EventSource` implementation, but DataSource URLs can also be mapped to EventTarget backed `EventSource`s and native `EventSource`s or `WebSockets` if we ever need to use those (for example these are options for potential streaming support with the Consul backend). The URL to function/method mapping previous to this PR used a very naive humongous `switch` statement which was a temporary 'this is fine for the moment' solution, although we'd always wanted to replace with something more manageable. Here we add `wayfarer` as a dependency - a very small (1kb), very fast, radix trie based router, and use that to perform the URL to function/method mapping. This essentially turns every `DataSource` into a very small SPA - change its URL and the view of data changes. When the data itself changes, either the yielded view of data changes or the `onchange` event is fired with the changed data, making the externally sourced view of data completely reactive. ```javascript // use the new decorator a service somewhere to annotate/decorate // a method with the URL that can be used to access this method @dataSource('/:ns/:dc/services') async findAllByDatacenter(params) { // get the data } // can use with JS in a route somewhere async model() { return this.data.source(uri => uri`/${nspace}/${dc}/services`) } ``` ```hbs {{!-- or just straight in a template using the component --}} <DataSource @src="/default/dc1/services" @onchange="" /> ``` This also uses a new `container` Service to automatically execute/import certain services yet not execute them. This new service also provides a lookup that supports both standard ember DI lookup plus Class based lookup or these specific services. Lastly we also provide another debug function called DataSourceRoutes() which can be called from console which gives you a list of URLs and their mappings.
2021-02-23 08:56:42 +00:00
async findByService(params, configuration = {}) {
if (typeof configuration.cursor !== 'undefined') {
ui: DataSource Decorator (#9746) We use a `<DataSource @src={{url}} />` component throughout our UI for when we want to load data from within our components. The URL specified as the `@src` is used to map/lookup what is used in to retrieve data, for example we mostly use our repository methods wrapped with our Promise backed `EventSource` implementation, but DataSource URLs can also be mapped to EventTarget backed `EventSource`s and native `EventSource`s or `WebSockets` if we ever need to use those (for example these are options for potential streaming support with the Consul backend). The URL to function/method mapping previous to this PR used a very naive humongous `switch` statement which was a temporary 'this is fine for the moment' solution, although we'd always wanted to replace with something more manageable. Here we add `wayfarer` as a dependency - a very small (1kb), very fast, radix trie based router, and use that to perform the URL to function/method mapping. This essentially turns every `DataSource` into a very small SPA - change its URL and the view of data changes. When the data itself changes, either the yielded view of data changes or the `onchange` event is fired with the changed data, making the externally sourced view of data completely reactive. ```javascript // use the new decorator a service somewhere to annotate/decorate // a method with the URL that can be used to access this method @dataSource('/:ns/:dc/services') async findAllByDatacenter(params) { // get the data } // can use with JS in a route somewhere async model() { return this.data.source(uri => uri`/${nspace}/${dc}/services`) } ``` ```hbs {{!-- or just straight in a template using the component --}} <DataSource @src="/default/dc1/services" @onchange="" /> ``` This also uses a new `container` Service to automatically execute/import certain services yet not execute them. This new service also provides a lookup that supports both standard ember DI lookup plus Class based lookup or these specific services. Lastly we also provide another debug function called DataSourceRoutes() which can be called from console which gives you a list of URLs and their mappings.
2021-02-23 08:56:42 +00:00
params.index = configuration.cursor;
params.uri = configuration.uri;
}
ui: Ensure we check intention service prefix permissions for per service (#11409) Port of: Ensure we check intention service prefix permissions for per service (#11270) Previously, when showing some action buttons for 'per service intentions' we used a global 'can I do something with any intention' permission to decide whether to show a certain button or not. If a user has a token that does not have 'global' intention permissions, but does have intention permissions on one or more specific services (for example via service / service_prefix), this meant that we did not show them certain buttons required to create/edit the intentions for this specific service. This PR adds that extra permissions check so we now check the intentions permissions per service instead of using the 'global' "can I edit intentions" question/request. **Notes:** - If a HTML button is `disabled` this means tippy.js doesn't adopt the popover properly and subsequently hide it from the user, so aswell as just disabling the button so you can't active the popover, we also don't even put the popover on the page - If `ability.item` or `ability.item.Resources` are empty then assume no access **We don't try to disable service > right hand side intention actions here** Whether you can create intentions for a service depends on the _destination_ of the intention you would like to create. For the topology view going from the LHS to the center, this is straightforwards as we only need to know the permissions for the central service, as when you are going from the LHS to the center, the center is the _destination_. When going from the center to the RHS the _destination[s]_ are on the RHS. This means we need to know the permissions for potentially 1000s of services all in one go in order to know when to show a button or not. We can't realistically discover the permissions for service > RHS services as we'd have either make a HTTP request per right hand service, or potentially make an incredibly large POST request for all the potentially 1000s of services on the right hand side (more preferable to 1000s of HTTP requests). Therefore for the moment at least we keep the old functionality (thin client) for the middle to RHS here. If you do go to click on the button and you don't have permissions to update the intention you will still not be able to update it, only you won't know this until you click the button (at which point you'll get a UI visible 403 error) Note: We reversed the conditional here between 1.10 and 1.11 So this make 100% sense that the port is different here to 1.11
2021-11-04 12:10:28 +00:00
return this.authorizeBySlug(
ui: chore - upgrade ember and friends (#14518) * v3.20.2...v3.24.0 * Fix handle undefined outlet in route component * Don't use template helper for optional modal.open Using the optional-helper here will trigger a computation in the same runloop error. This is because we are setting the `modal`-property when the `<Ref>` component gets rendered which will update the `this.modal`-property which will then recompute the `optional`-helper leading to this error. Instead we will create an action that will call the `open`-method on the modal when it is defined. This gets rid of the double computation error as we will not access the modal property twice in the same runloop when `modal` is getting set. * Fix - fn needs to be passed function tab-nav We create functions in the component file instead so that fn-helper stops complaining about the need to pass a function. * Update ember-exam to 6.1 version "Makes it compatible" with ember-qunit v5 * scheduleOnce setMaxHeight paged-collection We need to schedule to get around double-computation error. * Fix - model.data is removed from ember-data This has been private API all along - we need to work around the removal. Reference: https://github.com/emberjs/data/pull/7338/files#diff-9a8746fc5c86fd57e6122f00fef3155f76f0f3003a24b53fb7c4621d95dcd9bfL1310 * Fix `propContains` instead of `deepEqual` policy Recent model.data works differently than iterating attributes. We use `propContains` instead of `deepEqual`. We are only interested in the properties we assert against and match the previous behavior with this change. * Fix `propContains` instead of `deepEqual` token * Better handling single-records repo test-helper `model.data` has been removed we need to handle proxies and model instances differently. * Fix remaining repository tests with propContains We don't want to match entire objects - we don't care about properties we haven't defined in the assertion. * Don't use template helper for optional modal.open Using a template helper will give us a recomputation error - we work around it by creating an explicit action on the component instead. * Await `I $verb the $pageObject object` step * Fix no more customization ember-can No need to customize, the helper handles destruction fine on its own. * Fix - don't pass `optional` functions to fn We will declare the functions on the component instead. This gives us the same behavior but no error from `fn`, which expects a function to be passed. * Fix - handle `undefined` state on validate modifier StateChart can yield out an undefined `state` we need to handle that in the validate modifier * Fix linting errors tests directory * Warn / turn off new ember linting issues We will tackle them one by one and don't want to autofix issues that could be dangerous to auto-fix. * Auto-fix linting issues * More linting configuration * Fix remaining linting issues * Fix linting issues new files after rebase * ui: Remove ember-cli-uglify config now we are using terser (#14574) Co-authored-by: John Cowen <johncowen@users.noreply.github.com>
2022-09-15 08:43:17 +00:00
async (resources) => {
ui: Ensure we check intention service prefix permissions for per service (#11409) Port of: Ensure we check intention service prefix permissions for per service (#11270) Previously, when showing some action buttons for 'per service intentions' we used a global 'can I do something with any intention' permission to decide whether to show a certain button or not. If a user has a token that does not have 'global' intention permissions, but does have intention permissions on one or more specific services (for example via service / service_prefix), this meant that we did not show them certain buttons required to create/edit the intentions for this specific service. This PR adds that extra permissions check so we now check the intentions permissions per service instead of using the 'global' "can I edit intentions" question/request. **Notes:** - If a HTML button is `disabled` this means tippy.js doesn't adopt the popover properly and subsequently hide it from the user, so aswell as just disabling the button so you can't active the popover, we also don't even put the popover on the page - If `ability.item` or `ability.item.Resources` are empty then assume no access **We don't try to disable service > right hand side intention actions here** Whether you can create intentions for a service depends on the _destination_ of the intention you would like to create. For the topology view going from the LHS to the center, this is straightforwards as we only need to know the permissions for the central service, as when you are going from the LHS to the center, the center is the _destination_. When going from the center to the RHS the _destination[s]_ are on the RHS. This means we need to know the permissions for potentially 1000s of services all in one go in order to know when to show a button or not. We can't realistically discover the permissions for service > RHS services as we'd have either make a HTTP request per right hand service, or potentially make an incredibly large POST request for all the potentially 1000s of services on the right hand side (more preferable to 1000s of HTTP requests). Therefore for the moment at least we keep the old functionality (thin client) for the middle to RHS here. If you do go to click on the button and you don't have permissions to update the intention you will still not be able to update it, only you won't know this until you click the button (at which point you'll get a UI visible 403 error) Note: We reversed the conditional here between 1.10 and 1.11 So this make 100% sense that the port is different here to 1.11
2021-11-04 12:10:28 +00:00
const instances = await this.query(params);
set(instances, 'firstObject.Service.Resources', resources);
return instances;
},
ACCESS_READ,
ui: DataSource Decorator (#9746) We use a `<DataSource @src={{url}} />` component throughout our UI for when we want to load data from within our components. The URL specified as the `@src` is used to map/lookup what is used in to retrieve data, for example we mostly use our repository methods wrapped with our Promise backed `EventSource` implementation, but DataSource URLs can also be mapped to EventTarget backed `EventSource`s and native `EventSource`s or `WebSockets` if we ever need to use those (for example these are options for potential streaming support with the Consul backend). The URL to function/method mapping previous to this PR used a very naive humongous `switch` statement which was a temporary 'this is fine for the moment' solution, although we'd always wanted to replace with something more manageable. Here we add `wayfarer` as a dependency - a very small (1kb), very fast, radix trie based router, and use that to perform the URL to function/method mapping. This essentially turns every `DataSource` into a very small SPA - change its URL and the view of data changes. When the data itself changes, either the yielded view of data changes or the `onchange` event is fired with the changed data, making the externally sourced view of data completely reactive. ```javascript // use the new decorator a service somewhere to annotate/decorate // a method with the URL that can be used to access this method @dataSource('/:ns/:dc/services') async findAllByDatacenter(params) { // get the data } // can use with JS in a route somewhere async model() { return this.data.source(uri => uri`/${nspace}/${dc}/services`) } ``` ```hbs {{!-- or just straight in a template using the component --}} <DataSource @src="/default/dc1/services" @onchange="" /> ``` This also uses a new `container` Service to automatically execute/import certain services yet not execute them. This new service also provides a lookup that supports both standard ember DI lookup plus Class based lookup or these specific services. Lastly we also provide another debug function called DataSourceRoutes() which can be called from console which gives you a list of URLs and their mappings.
2021-02-23 08:56:42 +00:00
params
);
}
ui: feature-flagged peering mvp (#13425) * add peers route * add peers to nav * use regular app ui patterns peers template * use empty state in peers UI * mock `v1/peerings` request * implement custom adapter/serializer for `peers`-model * index request for peerings on peers route * update peers list to show as proper list * Use tailwind for easier styling * Unique ids in peerings response mock-api * Add styling peerings list * Allow creating empty tooltip To make it easier to iterate over a set of items where some items should not display a tooltip and others should. * Add tooltip Peerings:Badge * Add undefined peering state badge * Remove imported/exported services count peering This won't be included in the initial version of the API response * Implement Peerings::Search * Make it possible to filter peerings by name * Install ember-keyboard For idiomatic handling of key-presses. * Clear peering search input when pressing `Escape` * use peers.index instead of peers for peerings listing * Allow to include peered services in services-query * update services mock to add peerName * add Consul::Peer component To surface peering information on a resource * add PeerName as attribute to service model * surface peering information in service list * Add tooltip to Consul::Peer * Make services searchable by peer-name * Allow passing optional query-params to href-to * Add peer query-param to dc.services.show * Pass peer as query-param services listing * support option peer route-param * set peer-name undefined in services serializer when empty * update peer route-param when navigating to peered service * request sercice with peer-name if need be * make sure to reset peer route-param when leaving service.show * componentize services.peer-info * surface peer info services.show * make sure to reset peer route-param in main nav * fix services breadcrumb services.intentions we need to reset peer route-param here to not break the app * surface peer when querying for it on service api call * query for peer info service-instance api calls * surface peer info service-instance.show * Camelize peer attributes to match rest of app * Refactor peers.index to reflect camelized attributes for peer * Remove unused query-params services.show * make logo href reset peer route-param * Cleanup optional peer param query service-instance * Use replace decorator instead of serializer for empty peerName * make sure to only send peer info when correct qp is passed * Always send qp for querying peers services request * rename with-imports to with-peers * Use css for peer-icon * Refactor bucket-list component to surface peer-info * Remove Consul::Peer component This info is now displayed via the bucket-list component * Fix bucket-list component to surface service again * Update bucket-list docs to reflect peer-info addition * Remove tailwind related styles * Remove consul-tailwind package We won't be using tailwind for now * Fix typo badge scss * Add with-import handling mock-api nodes * Add peerName to node attributes * include peers when querying nodes * reflect api updates node list mock * Create consul::node::peer-info component * Surface peer-info in nodes list * Mock peer response for node request * Make it possible to add peer-name to node request * Update peer route-param when linking to node * Reset peers route-param when leaving nodes.show We need to reset the route-param to not introduce a bug - otherwise subsequent node show request would request with the old peer query-param * Add sourcePeer intentions api mock * add SourcePeer attr to intentions model * Surface peering info on intentions list * Request peered intentions differently intentions.edit * Handle peer info in intentions/exact mock * Surface peering info intention view * Add randomized peer data topology mock * Surface peer info topology view * fix service/peer-info styling We aren't using tailwind anymore - we need to create a custom scss file * Update peerings api mocks * Update peerings::badge with updated styling * cleanup intentions/exact mock * Create watcher component to declaratively register polling * Poll peers in background when on peers route * use existing colors for peering-badge * Add test for requesting service with `with-peers`-query * add imported/exported count to peers model * update mock-api to surface exported/imported count on peers * Show exported/imported peers count on peers list * Use translations for service import/export UI peers * Make sure to ask for nodes with peers * Add match-url step for easier url testing of service urls * Add test for peer-name on peered services * Add test for service navigation peered service * Implement feature-flag handling * Enable peering feature in test and development * Redirect peers to services.index when feature-flag is disabled * Only query for peers when feature is enabled * Only show peers in nav when feature is enabled * Componentize peering service count detail * Handle non-state Peerings::Badge * Use Peerings::ServiceCount in peerings list * Only send peer query for peered service-instances. * Add step to visit url directly * add test for accessing peered service directly * Remove unused service import peers.index * Only query for peer when peer provided node-adapter * fix tests
2022-06-23 13:16:26 +00:00
@dataSource('/:partition/:ns/:dc/service-instance/:serviceId/:node/:id/:peer')
ui: DataSource Decorator (#9746) We use a `<DataSource @src={{url}} />` component throughout our UI for when we want to load data from within our components. The URL specified as the `@src` is used to map/lookup what is used in to retrieve data, for example we mostly use our repository methods wrapped with our Promise backed `EventSource` implementation, but DataSource URLs can also be mapped to EventTarget backed `EventSource`s and native `EventSource`s or `WebSockets` if we ever need to use those (for example these are options for potential streaming support with the Consul backend). The URL to function/method mapping previous to this PR used a very naive humongous `switch` statement which was a temporary 'this is fine for the moment' solution, although we'd always wanted to replace with something more manageable. Here we add `wayfarer` as a dependency - a very small (1kb), very fast, radix trie based router, and use that to perform the URL to function/method mapping. This essentially turns every `DataSource` into a very small SPA - change its URL and the view of data changes. When the data itself changes, either the yielded view of data changes or the `onchange` event is fired with the changed data, making the externally sourced view of data completely reactive. ```javascript // use the new decorator a service somewhere to annotate/decorate // a method with the URL that can be used to access this method @dataSource('/:ns/:dc/services') async findAllByDatacenter(params) { // get the data } // can use with JS in a route somewhere async model() { return this.data.source(uri => uri`/${nspace}/${dc}/services`) } ``` ```hbs {{!-- or just straight in a template using the component --}} <DataSource @src="/default/dc1/services" @onchange="" /> ``` This also uses a new `container` Service to automatically execute/import certain services yet not execute them. This new service also provides a lookup that supports both standard ember DI lookup plus Class based lookup or these specific services. Lastly we also provide another debug function called DataSourceRoutes() which can be called from console which gives you a list of URLs and their mappings.
2021-02-23 08:56:42 +00:00
async findBySlug(params, configuration = {}) {
return super.findBySlug(...arguments);
}
}