Skip to content

Commit

Permalink
wip: training
Browse files Browse the repository at this point in the history
  • Loading branch information
cpaulve-1A committed Oct 2, 2024
1 parent 63b5bc1 commit 48e3818
Show file tree
Hide file tree
Showing 105 changed files with 3,880 additions and 51 deletions.
6 changes: 4 additions & 2 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
"jest.debugMode": true,
"jest.runMode": "on-save",
"testing.openTesting": "neverOpen",
"explorer.fileNesting.enabled": true,
"explorer.fileNesting.enabled": false,
"explorer.fileNesting.patterns": {
"readme.md": "security.md, code_of_conduct.md, contributing.md",
"*.js": "${capture}.js.map, ${capture}.d.ts, ${capture}.d.ts.map",
Expand Down Expand Up @@ -89,5 +89,7 @@
"files.trimTrailingWhitespace": true,
"files.trimFinalNewlines": false,
"otter.extract.styling.prefix": "o3r",
"typescript.tsserver.experimental.useVsCodeWatcher": false
"typescript.tsserver.experimental.useVsCodeWatcher": false,
"editor.tabSize": 2,
"explorer.fileNesting.expand": false
}
2 changes: 2 additions & 0 deletions apps/showcase/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,5 @@ dist-e2e-playwright
playwright-reports
test-results
training-assets
src/assets/sdk-training/**/exercise.json
src/assets/sdk-training/**/solution.json
1 change: 1 addition & 0 deletions apps/showcase/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
"start:no-translation": "ng serve",
"generate:translations:dev": "ng run showcase:generate-translations",
"generate:translations": "ng run showcase:generate-translations:production",
"prepare-training": "node scripts/prepare-training-exercises/index.cjs",
"cms-adapters:localizations": "ng run showcase:extract-translations",
"cms-adapters:metadata": "yarn run cms-adapters:localizations",
"update:otter": "ng update @o3r/core",
Expand Down
20 changes: 19 additions & 1 deletion apps/showcase/project.json
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,8 @@
"generate-theme",
"generate-dark-theme",
"generate-horizon-theme",
"copy-training-assets"
"copy-training-assets",
"prepare-training"
]
},
"serve": {
Expand Down Expand Up @@ -380,6 +381,23 @@
},
"dependsOn": ["^build-builders"]
},
"prepare-training": {
"executor": "nx:run-script",
"inputs": [
"global",
"{projectRoot}/package.json",
"{projectRoot}/src/assets/**/exercise/**",
"{projectRoot}/src/assets/**/solution/**",
"{projectRoot}/scripts/prepare-training-exercises/*.cjs"
],
"outputs": [
"{projectRoot}/src/assets/**/solution.json",
"{projectRoot}/src/assets/**/exercise.json"
],
"options": {
"script": "prepare-training"
}
},
"copy-training-assets": {
"executor": "nx:run-script",
"inputs": [
Expand Down
27 changes: 27 additions & 0 deletions apps/showcase/scripts/prepare-training-exercises/index.cjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
const {readdir, readFile, writeFile} = require('node:fs/promises');
const {getFilesTree} = require('@o3r/training-tools');
const {dirname, join, resolve} = require('node:path');
const glob = require('globby');

/**
* The Chrome Extension mechanism does not accept exports in loaded module
* The purpose of this script is to remove the empty `export` generated by TSC
*/

void (async () => {
const root = resolve(__dirname, '..', '..');
const files = await glob('src/assets/*-training/**/(exercise|solution)/**', {cwd: root});
const paths = files.reduce((exercisePaths, file) => {
const exerciseDirectory = dirname(file).match('(.*/(?:exercise|solution))')[0];
exercisePaths.add(`${exerciseDirectory}`);
return exercisePaths;
}, new Set());
for (const folder of paths) {
const filePath = join(root, folder);
const exerciseStructure = await getFilesTree([{isDir: true, path: `${filePath}`}], {readdir, readFile});
const [_, commonPath, folderName] = folder.match('(.*)/(exercise|solution)');
const targetPath = join(commonPath, `${folderName}.json`);
const content = JSON.stringify(exerciseStructure);
await writeFile(targetPath, content);
}
})();
1 change: 1 addition & 0 deletions apps/showcase/src/app/app-routing.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ const appRoutes: Routes = [
{path: 'run-app-locally', loadComponent: () => import('./run-app-locally/index').then((m) => m.RunAppLocallyComponent), title: 'Otter Showcase - Run App Locally'},
{path: 'sdk', loadComponent: () => import('./sdk/index').then((m) => m.SdkComponent), title: 'Otter Showcase - SDK'},
{path: 'placeholder', loadComponent: () => import('./placeholder/index').then((m) => m.PlaceholderComponent), title: 'Otter Showcase - Placeholder'},
{path: 'sdk-training', loadComponent: () => import('./sdk-training/index').then((m) => m.SdkTrainingComponent), title: 'Otter Showcase - SDK Training'},
{path: '**', redirectTo: '/home', pathMatch: 'full'}
];

Expand Down
41 changes: 22 additions & 19 deletions apps/showcase/src/app/app.component.html
Original file line number Diff line number Diff line change
@@ -1,28 +1,31 @@
<header class="navbar navbar-expand-lg flex-shrink-0">
<button class="navbar-toggler d-inline-block d-xl-none fa-bars" (click)="open(content)" title="Open side navigation">
</button>
<div class="header-title p-xl-3">
<div class="header-icon">
<img src="assets/otter-sticker.svg" width="48" height="48" alt="Otter logo" />
<div class="d-flex flex-column">
<header class="fw-bold w-100 d-flex align-items-center justify-content-start navbar navbar-expand-lg flex-shrink-0">
<button class="navbar-toggler d-inline-block d-xl-none icon-bars" (click)="open(content)" title="Open side navigation">
</button>
<div class="header-title d-flex p-xl-3">
<div class="d-flex me-3 header-icon">
<img src="assets/otter-sticker.svg" width="48" height="48" alt="Otter logo" />
</div>
<div class="d-block d-sm-none">Otter</div>
<div class="d-none d-sm-block">Otter Showcase</div>
</div>
<div class="d-block d-sm-none">Otter</div>
<div class="d-none d-sm-block">Otter Showcase</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="left-nav col-2 d-none d-xl-block">
<o3r-sidenav-pres
</header>
<!-- <div class="flex-fill container overflow-hidden mb-5">-->
<div class="flex-fill container">
<div class="row">
<div class="left-nav pt-5 col-2 d-none d-xl-block">
<o3r-sidenav-pres
[linksGroups]="linksGroups"
[activeUrl]="activeUrl$ | async"
></o3r-sidenav-pres>
</div>
<div class="page-content col-12 col-xl-10">
<router-outlet></router-outlet>
></o3r-sidenav-pres>
</div>
<div class="page-content col-12 col-xl-10">
<router-outlet></router-outlet>
</div>
</div>
</div>
</div>
<footer class="bg-body-tertiary">
<footer class="d-flex align-items-center w-100 text-body bg-body-tertiary">
<div class="container">
<div class="row">
<div class="col-12 col-md-8">
Expand Down
6 changes: 6 additions & 0 deletions apps/showcase/src/app/app.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,12 @@ export class AppComponent implements OnDestroy {
links: [
{ url: '/sdk', label: 'Generator' }
]
},
{
label: 'Training',
links: [
{ url: '/sdk-training', label: 'SDK Training' }
]
}
];

Expand Down
4 changes: 3 additions & 1 deletion apps/showcase/src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ import { HIGHLIGHT_OPTIONS } from 'ngx-highlightjs';
import { DatePickerHebrewInputPresComponent, ScrollBackTopPresComponent, SidenavPresComponent } from '../components/utilities';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import {MonacoEditorModule} from 'ngx-monaco-editor-v2';


const runtimeChecks: Partial<RuntimeChecks> = {
Expand Down Expand Up @@ -108,7 +109,8 @@ export function registerCustomComponents(): Map<string, any> {
C11nModule.forRoot({registerCompFunc: registerCustomComponents}),
StylingDevtoolsModule,
LocalizationDevtoolsModule,
ConfigurationDevtoolsModule
ConfigurationDevtoolsModule,
MonacoEditorModule.forRoot()
],
providers: [
{provide: MESSAGE_FORMAT_CONFIG, useValue: {}},
Expand Down
1 change: 1 addition & 0 deletions apps/showcase/src/app/sdk-training/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export * from './sdk-training.component';
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
o3r-training {
height: calc(100vh - 4rem);
}
23 changes: 23 additions & 0 deletions apps/showcase/src/app/sdk-training/sdk-training.component.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';

import { SdkTrainingComponent } from './sdk-training.component';

describe('SdkTrainingComponent', () => {
let component: SdkTrainingComponent;
let fixture: ComponentFixture<SdkTrainingComponent>;

beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [SdkTrainingComponent]
})
.compileComponents();

fixture = TestBed.createComponent(SdkTrainingComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
16 changes: 16 additions & 0 deletions apps/showcase/src/app/sdk-training/sdk-training.component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import {ChangeDetectionStrategy, Component} from '@angular/core';
import {
TrainingComponent
} from '../../components';

@Component({
selector: 'o3r-sdk-training',
standalone: true,
imports: [
TrainingComponent
],
changeDetection: ChangeDetectionStrategy.OnPush,
template: '<o3r-training [title]="\'SDK Training\'" [trainingPath]="\'sdk-training\'"></o3r-training>',
styleUrls: ['./sdk-training.component.scss']
})
export class SdkTrainingComponent {}
1 change: 1 addition & 0 deletions apps/showcase/src/assets/sdk-training-openapi-diagram.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
113 changes: 113 additions & 0 deletions apps/showcase/src/assets/sdk-training/program.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
[
{
"title": "Welcome to the Otter SDK tutorial",
"htmlContentUrl": "./steps/welcome/instructions.html"
},
{
"title": "Introduction",
"htmlContentUrl": "./steps/introduction/instructions.html"
},
{
"title": "How to use the Otter SDK?",
"htmlContentUrl": "./steps/typescript-sdk/instructions.html"
},
{
"title": "Customize your fetch client with plugins",
"htmlContentUrl": "./steps/plugins/instructions.html"
},
{
"title": "Integrate your component in Angular",
"htmlContentUrl": "./steps/angular-integration/instructions.html",
"filesConfiguration": {
"name": "angular-integration",
"startingFile": "apps/tutorial-app/src/app/app.component.ts",
"urls": {
".": "./shared/monorepo-template.json",
"./libs/sdk/src": "@o3r/training-sdk/folder-structure.json"
},
"mode": "interactive",
"commands": ["npm install --legacy-peer-deps --ignore-scripts --force", "npm run ng run sdk:build", "npm run ng run tutorial-app:serve"]
}
},
{
"title": "Generate your first SDK - Specifications",
"htmlContentUrl": "./steps/sdk-specs/instructions.html",
"filesConfiguration": {
"name": "sdk-specification",
"startingFile": "open-api.yaml",
"solutionUrls": {
".": "@o3r/training-sdk/openapi-structure.json"
},
"mode": "readonly",
"commands": []
}
},
{
"title": "Generate your first SDK - Command",
"htmlContentUrl": "./steps/sdk-generation/instructions.html",
"filesConfiguration": {
"name": "generate-sdk",
"startingFile": "src/api/dummy/dummy-api.ts",
"solutionUrls": {
"src": "@o3r/training-sdk/folder-structure.json",
".": "@o3r/training-sdk/openapi-structure.json"
},
"mode": "readonly",
"commands": []
}
},
{
"title": "SDK with Dates - Generation",
"htmlContentUrl": "./steps/date-sdk-generation/instructions.html",
"filesConfiguration": {
"name": "generate-date-sdk",
"startingFile": "open-api.yaml",
"urls": {
".": "@o3r/training-sdk/openapi-structure.json"
},
"solutionUrls": {
".": "@o3r/training-sdk/openapi-structure.json",
"./src": "@o3r/training-sdk/folder-structure.json"
},
"mode": "readonly",
"commands": []
}
},
{
"title": "SDK with Dates - How to use",
"htmlContentUrl": "./steps/date/instructions.html",
"filesConfiguration": {
"name": "utils-date",
"startingFile": "apps/app/src/app/app.component.ts",
"urls": {
".": "./shared/empty.json",
"./apps/app/src/app": "./steps/date/exercise.json"
},
"solutionUrls": {
"./apps/app/src/app": "./steps/date/solution.json"
},
"mode": "interactive",
"commands": [
"npm install --legacy-peer-deps --ignore-scripts --force",
"npm run ng run app:serve"
]
}
},
{
"title": "SDK with model extension",
"htmlContentUrl": "./steps/model-extension/instructions.html",
"filesConfiguration": {
"name": "model-extension",
"startingFile": "package.json",
"urls": {
".": "./shared/monorepo-template.json"
},
"mode": "interactive",
"commands": [
"npm install --legacy-peer-deps --ignore-scripts --force",
"npm run ng run sdk:build",
"npm run ng run tutorial-app:serve"
]
}
}
]
127 changes: 127 additions & 0 deletions apps/showcase/src/assets/sdk-training/shared/empty.json

Large diffs are not rendered by default.

Loading

0 comments on commit 48e3818

Please sign in to comment.