Repository: hashicorp/vault
File: ui/app/router.js (JavaScript)

Code before:
          // transit-specific routes
          this.route('actions-root', { path: '/actions/' });
          this.route('actions', { path: '/actions/*secret' });
          // database specific route
          this.route('overview');
        });
      });
      this.route('policies', { path: '/policies/:type' }, function () {
        this.route('index', { path: '/' });
        this.route('create');
      });
      this.route('policy', { path: '/policy/:type' }, function () {
        this.route('show', { path: '/:policy_name' });
        this.route('edit', { path: '/:policy_name/edit' });
      });
      this.route('replication-dr-promote', function () {
        this.route('details');
      });
      // TODO remove conditional once further feature work for single item recovery for release 1.21 is completed
      if (config.environment !== 'production') {
        this.route('recovery', function () {
          this.route('snapshots', function () {
            this.route('load');
            this.route('snapshot', function () {
              this.route('manage');
            });
          });
        });
      }
      if (config.addRootMounts) {
        config.addRootMounts.call(this);
      }

      this.route('not-found', { path: '/*path' });
    });
    this.route('not-found', { path: '/*path' });
  });
  if (config.environment !== 'production') {
    addDocfyRoutes(this);
  }
});


Review comment (suggestion):
In the RFC we had talked about this segment of the URL being a dynamic param called `snapshot_id` (As an aside, it's a good practice to have the url param - `snapshot_id` - match the param we'll use from the API.) 

In practice, this means that buttons or actions that navigate to manage a snapshot would look something like:
```js
const snapshot_id = 1234
this.router.transitionTo('recovery.snapshots.snapshot', snapshot_id)
```

If this is still the plan we'll need to define the `path` ([docs](https://guides.emberjs.com/release/routing/defining-your-routes/#toc_dynamic-segments)) for the dynamic segment here. I'm also wondering if `manage` is even necessary 🤔 Part of me thinks we should just get rid of the child route since right now it's just a single view to either read or recover items. We could have the "read" view just live at `snapshot`. If doing more things with a snapshot becomes a thing we can always extend it in the future. What do you think?


```suggestion
            this.route('snapshot', { path: '/:snapshot_id } )
```




Code after:
          this.route('create', { path: '/create/*secret' });
          this.route('edit', { path: '/edit/*secret' });

          this.route('credentials-root', { path: '/credentials/' });
          this.route('credentials', { path: '/credentials/*secret' });

          // ssh sign
          this.route('sign-root', { path: '/sign/' });
          this.route('sign', { path: '/sign/*secret' });
          // transit-specific routes
          this.route('actions-root', { path: '/actions/' });
          this.route('actions', { path: '/actions/*secret' });
          // database specific route
          this.route('overview');
        });
      });
      this.route('policies', { path: '/policies/:type' }, function () {
        this.route('index', { path: '/' });
        this.route('create');
      });
      this.route('policy', { path: '/policy/:type' }, function () {
        this.route('show', { path: '/:policy_name' });
        this.route('edit', { path: '/:policy_name/edit' });
      });
      this.route('replication-dr-promote', function () {
        this.route('details');
      });
      if (config.addRootMounts) {
        config.addRootMounts.call(this);
      }

      this.route('not-found', { path: '/*path' });
    });
    this.route('not-found', { path: '/*path' });
  });
  if (config.environment !== 'production') {
    addDocfyRoutes(this);
  }
});