fix(wiki): added wiki to ssr

Author: nsemets

src/@types/ace-builds.d.ts

@@ -0,0 +1 @@
+declare module 'ace-builds/src-noconflict/ext-language_tools';

src/app/app.routes.server.ts

@@ -141,6 +141,10 @@ export const serverRoutes: ServerRoute[] = [
     path: ':id/metadata/:recordId',
     renderMode: RenderMode.Server,
   },
+  {
+    path: ':id/wiki',
+    renderMode: RenderMode.Server,
+  },
   {
     path: ':id/files/**',
     renderMode: RenderMode.Server,

src/app/shared/components/wiki/edit-section/edit-section.component.spec.ts

@@ -186,8 +186,8 @@ describe('EditSectionComponent', () => {
     });
   });
 
-  it('should configure editor when onEditorLoaded is called', () => {
-    component.onEditorLoaded(mockEditorInstance);
+  it('should configure editor when onEditorLoaded is called', async () => {
+    await component.onEditorLoaded(mockEditorInstance);
 
     expect((component as any).editorInstance).toBe(mockEditorInstance);
     expect(mockEditorInstance.setShowPrintMargin).toHaveBeenCalledWith(false);

src/app/shared/components/wiki/edit-section/edit-section.component.ts

@@ -10,8 +10,6 @@ import { FormsModule } from '@angular/forms';
 
 import { CustomDialogService } from '@osf/shared/services/custom-dialog.service';
 
-import 'ace-builds/src-noconflict/ext-language_tools';
-
 import { WikiSyntaxHelpDialogComponent } from '../wiki-syntax-help-dialog/wiki-syntax-help-dialog.component';
 
 @Component({
@@ -63,14 +61,16 @@ export class EditSectionComponent {
   }
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  onEditorLoaded(editor: any) {
+  async onEditorLoaded(editor: any) {
     this.editorInstance = editor;
     editor.setShowPrintMargin(false);
-    const langTools = ace.require('ace/ext/language_tools');
+    await import('ace-builds/src-noconflict/ext-language_tools');
+    const aceGlobal = (globalThis as { ace?: { require?: (path: string) => { snippetCompleter?: unknown } } }).ace;
+    const langTools = aceGlobal?.require?.('ace/ext/language_tools');
     editor.setOptions({
       enableBasicAutocompletion: this.autoCompleteEnabled,
       enableLiveAutocompletion: this.autoCompleteEnabled,
-      enableSnippets: [langTools.snippetCompleter],
+      enableSnippets: langTools?.snippetCompleter ? [langTools.snippetCompleter] : [],
     });
   }
 

src/app/shared/components/wiki/wiki-list/wiki-list.component.html

@@ -10,7 +10,7 @@
     <p-skeleton width="100%" height="1.5rem" class="mb-2 flex" />
   } @else {
     @if (expanded()) {
-      <p-panel showHeader="false">
+      <p-panel ngSkipHydration [showHeader]="false">
         <div
           class="flex align-items-center mt-3 mb-2"
           [class]="canEdit() ? 'justify-content-between' : 'justify-content-end'"