Skip to content

Commit

Permalink
Development: Use directive for programming test status details and di…
Browse files Browse the repository at this point in the history
…ff report (#9259)
  • Loading branch information
florian-glombik authored and JohannesWt committed Sep 23, 2024
1 parent f908cba commit ccf278a
Show file tree
Hide file tree
Showing 28 changed files with 219 additions and 137 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<span jhiTranslate="artemisApp.programmingExercise.diffReport.shortDescription"></span>
<div class="fw-bold">
<jhi-git-diff-line-stat
[addedLineCount]="detail.data.addedLineCount"
[removedLineCount]="detail.data.removedLineCount"
ngbTooltip="{{ 'artemisApp.programmingExercise.diffReport.lineStatTooltipDetailPage' | artemisTranslate }}"
placement="right"
/>
</div>
@if (detail.data.addedLineCount > 0 || detail.data.removedLineCount > 0) {
<div class="mt-1">
<jhi-button
[featureToggle]="FeatureToggle.ProgrammingExercises"
[isLoading]="detail.data.isLoadingDiffReport ?? false"
[btnSize]="ButtonSize.SMALL"
[icon]="faCodeCompare"
[title]="'artemisApp.programmingExercise.diffReport.button'"
[tooltip]="'artemisApp.programmingExercise.diffReport.tooltip'"
(onClick)="showGitDiff(detail.data.gitDiffReport)"
[btnType]="WARNING"
[tooltipPlacement]="TooltipPlacement.RIGHT"
/>
</div>
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { Component, Input, inject } from '@angular/core';
import type { ProgrammingDiffReportDetail } from 'app/detail-overview-list/detail.model';
import { FeatureToggle } from 'app/shared/feature-toggle/feature-toggle.service';
import { ButtonSize, ButtonType, TooltipPlacement } from 'app/shared/components/button.component';
import { faCodeCompare } from '@fortawesome/free-solid-svg-icons';
import { ProgrammingExerciseGitDiffReport } from 'app/entities/hestia/programming-exercise-git-diff-report.model';
import { GitDiffReportModalComponent } from 'app/exercises/programming/hestia/git-diff-report/git-diff-report-modal.component';
import { GitDiffReportModule } from 'app/exercises/programming/hestia/git-diff-report/git-diff-report.module';
import { ArtemisSharedComponentModule } from 'app/shared/components/shared-component.module';
import { ArtemisSharedModule } from 'app/shared/shared.module';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
selector: 'jhi-programming-diff-report-detail',
templateUrl: 'programming-diff-report-detail.component.html',
standalone: true,
imports: [ArtemisSharedModule, ArtemisSharedComponentModule, GitDiffReportModule],
})
export class ProgrammingDiffReportDetailComponent {
protected readonly FeatureToggle = FeatureToggle;
protected readonly ButtonSize = ButtonSize;
protected readonly TooltipPlacement = TooltipPlacement;
protected readonly WARNING = ButtonType.WARNING;

protected readonly faCodeCompare = faCodeCompare;

private readonly modalService = inject(NgbModal);

@Input({ required: true }) detail: ProgrammingDiffReportDetail;

showGitDiff(gitDiff?: ProgrammingExerciseGitDiffReport) {
if (!gitDiff) {
return;
}

const modalRef = this.modalService.open(GitDiffReportModalComponent, { windowClass: 'diff-view-modal' });
modalRef.componentInstance.report = gitDiff;
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
@if (detail.data.participation) {
<div class="d-flex align-items-center">
@if (!detail.data.loading) {
<jhi-updating-result
[exercise]="detail.data.exercise"
[participation]="detail.data.participation"
[showUngradedResults]="true"
[personalParticipation]="false"
[short]="false"
(onParticipationChange)="detail.data.onParticipationChange()"
class="me-2"
/>
}
@if (detail.data.participation.results?.length) {
<jhi-programming-exercise-instructor-status
class="repository-status-icon me-2"
[participationType]="detail.data.type"
[participation]="detail.data.participation"
[exercise]="detail.data.exercise"
/>
@if (detail.data.exercise.isAtLeastEditor) {
<jhi-programming-exercise-instructor-trigger-build-button [exercise]="detail.data.exercise" [participation]="detail.data.participation" />
}
}
@if (detail.data.exercise.isAtLeastEditor && detail.data.participation.id) {
<a [routerLink]="detail.data.submissionRouterLink" [queryParams]="{ isTmpOrSolutionProgrParticipation: true }" class="ms-2">
@switch (detail.data.type) {
@case (ProgrammingExerciseParticipationType.TEMPLATE) {
<span jhiTranslate="artemisApp.programmingExercise.detail.showTemplateSubmissions"></span>
}
@case (ProgrammingExerciseParticipationType.SOLUTION) {
<span jhiTranslate="artemisApp.programmingExercise.detail.showSolutionSubmissions"></span>
}
}
</a>
}
</div>
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import { Component, Input } from '@angular/core';
import type { ProgrammingTestStatusDetail } from 'app/detail-overview-list/detail.model';
import { RouterModule } from '@angular/router';
import { ArtemisProgrammingExerciseActionsModule } from 'app/exercises/programming/shared/actions/programming-exercise-actions.module';
import { SubmissionResultStatusModule } from 'app/overview/submission-result-status.module';
import { ArtemisProgrammingExerciseStatusModule } from 'app/exercises/programming/manage/status/programming-exercise-status.module';
import { TranslateDirective } from 'app/shared/language/translate.directive';
import { ProgrammingExerciseParticipationType } from 'app/entities/programming/programming-exercise-participation.model';

@Component({
selector: 'jhi-programming-test-status-detail',
templateUrl: 'programming-test-status-detail.component.html',
standalone: true,
imports: [RouterModule, ArtemisProgrammingExerciseActionsModule, SubmissionResultStatusModule, ArtemisProgrammingExerciseStatusModule, TranslateDirective],
})
export class ProgrammingTestStatusDetailComponent {
protected readonly ProgrammingExerciseParticipationType = ProgrammingExerciseParticipationType;

@Input({ required: true }) detail: ProgrammingTestStatusDetail;
}
Original file line number Diff line number Diff line change
Expand Up @@ -15,79 +15,6 @@ <h3 class="section-headline" [id]="headlinesRecord[section.headline]">{{ section
</dt>
}
@switch (detail.type) {
@case (DetailType.ProgrammingTestStatus) {
<dd id="detail-value-{{ detail.title }}">
@if (detail.data.participation) {
<div class="d-flex align-items-center">
@if (!detail.data.loading) {
<jhi-updating-result
[exercise]="detail.data.exercise"
[participation]="detail.data.participation"
[showUngradedResults]="true"
[personalParticipation]="false"
[short]="false"
(onParticipationChange)="detail.data.onParticipationChange()"
class="me-2"
/>
}
@if (detail.data.participation.results?.length) {
<jhi-programming-exercise-instructor-status
class="repository-status-icon me-2"
[participationType]="detail.data.type"
[participation]="detail.data.participation"
[exercise]="detail.data.exercise"
/>
@if (detail.data.exercise.isAtLeastEditor) {
<jhi-programming-exercise-instructor-trigger-build-button
[exercise]="detail.data.exercise"
[participation]="detail.data.participation"
/>
}
}
@if (detail.data.exercise.isAtLeastEditor && detail.data.participation.id) {
<a [routerLink]="detail.data.submissionRouterLink" [queryParams]="{ isTmpOrSolutionProgrParticipation: true }" class="ms-2">
@switch (detail.data.type) {
@case (ProgrammingExerciseParticipationType.TEMPLATE) {
<span jhiTranslate="artemisApp.programmingExercise.detail.showTemplateSubmissions"></span>
}
@case (ProgrammingExerciseParticipationType.SOLUTION) {
<span jhiTranslate="artemisApp.programmingExercise.detail.showSolutionSubmissions"></span>
}
}
</a>
}
</div>
}
</dd>
}
@case (DetailType.ProgrammingDiffReport) {
<dd id="detail-value-{{ detail.title }}">
<span jhiTranslate="artemisApp.programmingExercise.diffReport.shortDescription"></span>
<div class="fw-bold">
<jhi-git-diff-line-stat
[addedLineCount]="detail.data.addedLineCount"
[removedLineCount]="detail.data.removedLineCount"
ngbTooltip="{{ 'artemisApp.programmingExercise.diffReport.lineStatTooltipDetailPage' | artemisTranslate }}"
placement="right"
/>
</div>
@if (detail.data.addedLineCount > 0 || detail.data.removedLineCount > 0) {
<div class="mt-1">
<jhi-button
[featureToggle]="FeatureToggle.ProgrammingExercises"
[isLoading]="detail.data.isLoadingDiffReport ?? false"
[btnSize]="ButtonSize.SMALL"
[icon]="faCodeCompare"
[title]="'artemisApp.programmingExercise.diffReport.button'"
[tooltip]="'artemisApp.programmingExercise.diffReport.tooltip'"
(onClick)="showGitDiff(detail.data.gitDiffReport)"
[btnType]="WARNING"
[tooltipPlacement]="TooltipPlacement.RIGHT"
/>
</div>
}
</dd>
}
@case (DetailType.ProgrammingProblemStatement) {
@if (detail.data.exercise?.templateParticipation) {
<dd class="p-3 border" id="detail-value-{{ detail.title }}">
Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,7 @@
import { Component, Input, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { faCodeCompare } from '@fortawesome/free-solid-svg-icons';
import { isEmpty } from 'lodash-es';
import { FeatureToggle } from 'app/shared/feature-toggle/feature-toggle.service';
import { ButtonSize, ButtonType, TooltipPlacement } from 'app/shared/components/button.component';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { GitDiffReportModalComponent } from 'app/exercises/programming/hestia/git-diff-report/git-diff-report-modal.component';
import { ProgrammingExerciseGitDiffReport } from 'app/entities/hestia/programming-exercise-git-diff-report.model';
import { ButtonSize, TooltipPlacement } from 'app/shared/components/button.component';
import { IrisSubSettingsType } from 'app/entities/iris/settings/iris-sub-settings.model';
import { ModelingExerciseService } from 'app/exercises/modeling/manage/modeling-exercise.service';
import { AlertService } from 'app/core/util/alert.service';
Expand Down Expand Up @@ -52,6 +48,7 @@ export class DetailOverviewListComponent implements OnInit, OnDestroy {
protected readonly FeatureToggle = FeatureToggle;
protected readonly ButtonSize = ButtonSize;
protected readonly ProgrammingExerciseParticipationType = ProgrammingExerciseParticipationType;

readonly CHAT = IrisSubSettingsType.CHAT;

@Input()
Expand All @@ -62,16 +59,10 @@ export class DetailOverviewListComponent implements OnInit, OnDestroy {
// headline record to avoid function call in html
headlinesRecord: Record<string, string>;

// icons
readonly faCodeCompare = faCodeCompare;

WARNING = ButtonType.WARNING;

profileSubscription: Subscription;
isLocalVC = false;

constructor(
private modalService: NgbModal,
private modelingExerciseService: ModelingExerciseService,
private alertService: AlertService,
private profileService: ProfileService,
Expand All @@ -92,15 +83,6 @@ export class DetailOverviewListComponent implements OnInit, OnDestroy {
}, {});
}

showGitDiff(gitDiff?: ProgrammingExerciseGitDiffReport) {
if (!gitDiff) {
return;
}

const modalRef = this.modalService.open(GitDiffReportModalComponent, { windowClass: 'diff-view-modal' });
modalRef.componentInstance.report = gitDiff;
}

downloadApollonDiagramAsPDf(umlModel?: UMLModel, title?: string) {
if (umlModel) {
this.modelingExerciseService.convertToPdf(JSON.stringify(umlModel), `${title}-example-solution`).subscribe({
Expand Down
4 changes: 2 additions & 2 deletions src/main/webapp/app/detail-overview-list/detail.model.ts
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ export interface ProgrammingAuxiliaryRepositoryButtonsDetail extends DetailBase
data: { auxiliaryRepositories: AuxiliaryRepository[]; exerciseId?: number };
}

interface ProgrammingTestStatusDetail extends DetailBase {
export interface ProgrammingTestStatusDetail extends DetailBase {
type: DetailType.ProgrammingTestStatus;
data: {
participation?: TemplateProgrammingExerciseParticipation | SolutionProgrammingExerciseParticipation;
Expand All @@ -108,7 +108,7 @@ interface ProgrammingTestStatusDetail extends DetailBase {
submissionRouterLink?: (string | number | undefined)[];
};
}
interface ProgrammingDiffReportDetail extends DetailBase {
export interface ProgrammingDiffReportDetail extends DetailBase {
type: DetailType.ProgrammingDiffReport;
data: { addedLineCount: number; removedLineCount: number; isLoadingDiffReport?: boolean; gitDiffReport?: ProgrammingExerciseGitDiffReport };
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
import { ComponentRef, Directive, Input, OnDestroy, OnInit, Type, ViewContainerRef } from '@angular/core';
import type { Detail, ShownDetail } from 'app/detail-overview-list/detail.model';
import { DetailType } from 'app/detail-overview-list/detail-overview-list.component';
import { TextDetailComponent } from 'app/detail-overview-list/components/text-detail.component';
import { DateDetailComponent } from 'app/detail-overview-list/components/date-detail.component';
import { LinkDetailComponent } from 'app/detail-overview-list/components/link-detail.component';
import { BooleanDetailComponent } from 'app/detail-overview-list/components/boolean-detail.component';
import { ProgrammingRepositoryButtonsDetailComponent } from 'app/detail-overview-list/components/programming-repository-buttons-detail.component';
import { ProgrammingAuxiliaryRepositoryButtonsDetailComponent } from 'app/detail-overview-list/components/programming-auxiliary-repository-buttons-detail.component';
import { TextDetailComponent } from 'app/detail-overview-list/components/text-detail/text-detail.component';
import { DateDetailComponent } from 'app/detail-overview-list/components/date-detail/date-detail.component';
import { LinkDetailComponent } from 'app/detail-overview-list/components/link-detail/link-detail.component';
import { BooleanDetailComponent } from 'app/detail-overview-list/components/boolean-detail/boolean-detail.component';
import { ProgrammingRepositoryButtonsDetailComponent } from 'app/detail-overview-list/components/programming-repository-buttons-detail/programming-repository-buttons-detail.component';
import { ProgrammingAuxiliaryRepositoryButtonsDetailComponent } from 'app/detail-overview-list/components/programming-auxiliary-repository-buttons-detail/programming-auxiliary-repository-buttons-detail.component';
import { ProgrammingTestStatusDetailComponent } from 'app/detail-overview-list/components/programming-test-status-detail/programming-test-status-detail.component';
import { ProgrammingDiffReportDetailComponent } from 'app/detail-overview-list/components/programming-diff-report-detail/programming-diff-report-detail.component';

@Directive({
selector: '[jhiExerciseDetail]',
Expand All @@ -33,6 +35,8 @@ export class ExerciseDetailDirective implements OnInit, OnDestroy {
| BooleanDetailComponent
| ProgrammingRepositoryButtonsDetailComponent
| ProgrammingAuxiliaryRepositoryButtonsDetailComponent
| ProgrammingTestStatusDetailComponent
| ProgrammingDiffReportDetailComponent
>;
} = {
[DetailType.Text]: TextDetailComponent,
Expand All @@ -41,6 +45,8 @@ export class ExerciseDetailDirective implements OnInit, OnDestroy {
[DetailType.Boolean]: BooleanDetailComponent,
[DetailType.ProgrammingRepositoryButtons]: ProgrammingRepositoryButtonsDetailComponent,
[DetailType.ProgrammingAuxiliaryRepositoryButtons]: ProgrammingAuxiliaryRepositoryButtonsDetailComponent,
[DetailType.ProgrammingTestStatus]: ProgrammingTestStatusDetailComponent,
[DetailType.ProgrammingDiffReport]: ProgrammingDiffReportDetailComponent,
};

const detailComponent = detailTypeToComponent[this.detail.type];
Expand Down
1 change: 1 addition & 0 deletions src/main/webapp/app/shared/language/translate.directive.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import { takeUntil } from 'rxjs/operators';
*/
@Directive({
selector: '[jhiTranslate]',
standalone: true,
})
export class TranslateDirective implements OnChanges, OnInit, OnDestroy {
@Input() jhiTranslate!: string;
Expand Down
3 changes: 1 addition & 2 deletions src/main/webapp/app/shared/shared-common.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,12 @@ import { CloseCircleComponent } from 'app/shared/close-circle/close-circle.compo
import { ArtemisDateRangePipe } from 'app/shared/pipes/artemis-date-range.pipe';

@NgModule({
imports: [ArtemisSharedLibsModule],
imports: [ArtemisSharedLibsModule, TranslateDirective],
declarations: [
ArtemisDatePipe,
ArtemisDateRangePipe,
FindLanguageFromKeyPipe,
AlertOverlayComponent,
TranslateDirective,
SortByDirective,
SortDirective,
ArtemisTranslatePipe,
Expand Down
Loading

0 comments on commit ccf278a

Please sign in to comment.