BREAKING postCreate before URL redirect #7167

In some cases we must do something async after creation
but before redirect. And the redirect must not happen until our
async operation is complete. This is now possible.

For instance in OKpilot when creating an Objective auto-linked to a Process,
the newly created Objective must not be reloaded until after the Process
was actually linked to the Objective via the postCreate hook. Otherwise we would
incorrectly show an Objective without Process, which would not match DB content.

That use-case was not clearly visible before, because all cases until now were
many-to-many relations, and those relations were loaded slightly later, probably
giving enough time for the link mutation to finish. And even if the link was not
complete yet, it was harder to notice that one element in a list in a tab was missing,
compared to a very obvious natural-select on default tab.

The old behavior to do something after the redirect is still possible by returning
`EMPTY` and doing the async work "later".

projects/natural/src/lib/classes/abstract-detail.ts

@@ -12,6 +12,7 @@ import {ifValid, validateAllFormControls} from './validators';
 import {mergeOverrideArray} from './utility';
 import {PaginatedData} from './data-source';
 import {QueryVariables} from './query-variable-manager';
+import {EMPTY, Observable} from 'rxjs';
 
 @Directive()
 export class NaturalAbstractDetail<
@@ -130,18 +131,21 @@ export class NaturalAbstractDetail<
             .subscribe(model => {
                 this.alertService.info($localize`Créé`);
                 this.form.patchValue(model);
-                this.postCreate(model);
-
-                if (redirect) {
-                    if (this.isPanel) {
-                        const oldUrl = this.router.url;
-                        const nextUrl = this.panelData?.config.params.nextRoute;
-                        const newUrl = oldUrl.replace('/new', '/' + model.id) + (nextUrl ? '/' + nextUrl : '');
-                        this.router.navigateByUrl(newUrl); // replace /new by /123
-                    } else {
-                        this.router.navigate(['..', model.id], {relativeTo: this.route});
-                    }
-                }
+
+                this.postCreate(model).subscribe({
+                    complete: () => {
+                        if (redirect) {
+                            if (this.isPanel) {
+                                const oldUrl = this.router.url;
+                                const nextUrl = this.panelData?.config.params.nextRoute;
+                                const newUrl = oldUrl.replace('/new', '/' + model.id) + (nextUrl ? '/' + nextUrl : '');
+                                this.router.navigateByUrl(newUrl); // replace /new by /123
+                            } else {
+                                this.router.navigate(['..', model.id], {relativeTo: this.route});
+                            }
+                        }
+                    },
+                });
             });
     }
 
@@ -178,7 +182,13 @@ export class NaturalAbstractDetail<
 
     protected postUpdate(model: ExtractTupdate<TService>): void {}
 
-    protected postCreate(model: ExtractTcreate<TService>): void {}
+    /**
+     * Returns an observable that will be subscribed to immediately and the
+     * redirect navigation will only happen after the observable completes.
+     */
+    protected postCreate(model: ExtractTcreate<TService>): Observable<unknown> {
+        return EMPTY;
+    }
 
     protected preDelete(model: ExtractTone<TService>): void {}