pages/help/help.component.ts

0001 import {Component, SecurityContext} from '@angular/core';
0002 import {ShellComponent} from "../../components/shell/shell.component";
0003 import {MatIcon} from "@angular/material/icon";
0004 import {MarkdownComponent, MARKED_OPTIONS, provideMarkdown} from "ngx-markdown";
0005 import {MatIconButton} from "@angular/material/button";
0006 import {HttpClient} from "@angular/common/http";
0007 import {MatCard, MatCardTitle} from "@angular/material/card";
0008 import {MatListItem, MatNavList} from "@angular/material/list";
0009 import {NgForOf} from "@angular/common";
0010
0011 interface DocPage {
0012   title: string;
0013   path: string;
0014 }
0015
0016
0017 @Component({
0018   selector: 'app-page-help',
0019   imports: [
0020     ShellComponent,
0021     MatIcon,
0022     MarkdownComponent,
0023     MatIconButton,
0024     MatCard,
0025     MatCardTitle,
0026     MatListItem,
0027     MatNavList,
0028     NgForOf,
0029   ],
0030   providers: [
0031       provideMarkdown({
0032         loader: HttpClient,
0033         sanitize: SecurityContext.NONE,
0034         markedOptions: {
0035           provide: MARKED_OPTIONS,
0036           useValue: {
0037             gfm: true,
0038             breaks: false,
0039             pedantic: false,
0040           }
0041         }
0042       })
0043   ],
0044   templateUrl: './help.component.html',
0045   styleUrl: './help.component.scss'
0046 })
0047 export class HelpComponent {
0048
0049   /**
0050    * The current Markdown file being displayed
0051    */
0052   docUrl = 'assets/docs/intro.md';
0053
0054   /**
0055    * A simple list of documentation pages to show in the left pane.
0056    * `path` should match your .md files in assets/docs folder.
0057    */
0058   docPages: DocPage[] = [
0059     { title: 'Introduction', path: 'assets/docs/intro.md' },
0060     { title: 'Installation', path: 'assets/docs/pyrobird.md' },
0061     { title: 'DD4Hep plugin', path: 'assets/docs/dd4hep-plugin.md' },
0062     // ...add more as needed
0063   ];
0064
0065   /**
0066    * When a user clicks on a page, update the docUrl so <markdown> reloads it.
0067    */
0068   selectPage(page: DocPage) {
0069     this.docUrl = page.path;
0070   }
0071
0072   /**
0073    * (Optional) Suppose you also want a debug button in the header:
0074    */
0075   onDebugClick() {
0076     console.log('Debug button clicked');
0077   }
0078 }