zitadel/console/src/app/pages/granted-projects/granted-project-detail/granted-project-detail.component.html

<app-meta-layout>
    <div class="max-width-container">
        <div class="head" *ngIf="project?.id">
            <a [routerLink]="[ '/granted-projects' ]" mat-icon-button>
                <mat-icon class="icon">arrow_back</mat-icon>
            </a>
            <h1>{{ 'PROJECT.PAGES.TITLE' | translate }} {{project?.projectName}}</h1>

            <div class="full-width">
                <p class="desc">{{ 'PROJECT.PAGES.DESCRIPTION' | translate }}</p>
                <p *ngIf="isZitadel" class="zitadel-warning">{{'PROJECT.PAGES.ZITADELPROJECT' | translate}}</p>
            </div>
        </div>

        <!-- <ng-template appHasRole [appHasRole]="['project.grant.user.grant.read']"> -->
        <app-card *ngIf="project?.projectId" title="{{ 'GRANTS.PROJECT.TITLE' | translate }}"
            description="{{'GRANTS.PROJECT.DESCRIPTION' | translate }}">
            <app-user-grants [context]="userGrantContext" [projectId]="projectId" [grantId]="grantId"
                [allowCreate]="['project.grant.user.grant.write'] | hasRole"
                [allowDelete]="['project.grant.user.grant.delete'] | hasRole">
            </app-user-grants>
        </app-card>
        <!-- </ng-template> -->
    </div>
    <metainfo class="side">
        <div class="details">
            <div class="row">
                <span class="first">{{'PROJECT.STATE.TITLE' | translate}}:</span>
                <span *ngIf="project && project.state !== undefined"
                    class="second">{{'PROJECT.STATE.'+project.state | translate}}</span>
            </div>
        </div>

        <mat-tab-group mat-stretch-tabs class="tab-group" disablePagination="true">
            <mat-tab label="Details">
                <app-project-contributors *ngIf="project && grantId"
                    [disabled]="project?.state !== ProjectState.PROJECTSTATE_ACTIVE"
                    [projectType]="ProjectType.PROJECTTYPE_GRANTED" [project]="project" [grantId]="grantId">
                </app-project-contributors>
            </mat-tab>
            <mat-tab label="{{ 'CHANGES.PROJECT.TITLE' | translate }}" class="flex-col">
                <app-changes *ngIf="project" [changeType]="ChangeType.PROJECT" [id]="project.id"></app-changes>
            </mat-tab>
        </mat-tab-group>
    </metainfo>
</app-meta-layout>