update makefile

added storybook for medical sources card.
added shortDomain pipe + tests
This commit is contained in:
Jason Kulatunga 2023-05-12 17:34:27 -04:00
parent 8e203a5b3c
commit 2d1a9bf6d1
12 changed files with 225 additions and 46 deletions

View File

@ -21,7 +21,7 @@ jobs:
node-version: 18.x
- name: Test Frontend
run: |
make frontend-test-coverage
make test-frontend-coverage
- name: Upload coverage
uses: actions/upload-artifact@v3
with:
@ -41,7 +41,7 @@ jobs:
run: |
go install github.com/golang/mock/mockgen@v1.6.0
go generate ./...
make backend-test-coverage
make test-backend-coverage
CGO_ENABLED=0 go build -buildvcs=false ./backend/cmd/fasten/
- name: Upload coverage
uses: actions/upload-artifact@v3

View File

@ -24,7 +24,7 @@ jobs:
go-version: '1.18.3'
- run: go version
- run: |
make frontend-dep
make dep-frontend
cd frontend
yarn run build -- --configuration cloud_sandbox --output-path=../dist

View File

@ -39,10 +39,10 @@ Before making changes to Fasten, you'll want to run the test suites to ensure th
make test
# if you only want to run the frontend tests (Angular), you can run:
make frontend-test
make test-frontend
# alternatively, if you only care about backend (Go) tests, you can run:
make backend-test
make test-backend
```
# Start Development Environment

View File

@ -5,7 +5,7 @@
# General
########################################################################################################################
.PHONY: test
test: backend-test frontend-test
test: test-backend test-frontend
.PHONY: serve-frontend
serve-frontend:
@ -24,52 +24,52 @@ serve-backend:
# Backend
########################################################################################################################
.PHONY: backend-clean
backend-clean:
.PHONY: clean-backend
clean-backend:
go clean
.PHONY: backend-dep
backend-dep:
.PHONY: dep-backend
dep-backend:
go mod vendor
.PHONY: backend-test
backend-test: backend-dep
.PHONY: test-backend
test-backend: dep-backend
go vet ./...
go test -v ./...
.PHONY: backend-test-coverage
backend-test-coverage: backend-dep
.PHONY: test-backend-coverage
test-backend-coverage: dep-backend
go test -coverprofile=backend-coverage.txt -covermode=atomic -v ./...
########################################################################################################################
# Frontend
########################################################################################################################
.PHONY: frontend-dep
frontend-dep:
.PHONY: dep-frontend
dep-frontend:
cd frontend
yarn install --frozen-lockfile
.PHONY: frontend-build-sandbox
frontend-build-sandbox: frontend-dep
.PHONY: build-frontend-sandbox
build-frontend-sandbox: dep-frontend
cd frontend
yarn run build -- --configuration sandbox --output-path=../dist
.PHONY: frontend-build-prod
frontend-build-prod: frontend-dep
.PHONY: build-frontend-prod
build-frontend-prod: dep-frontend
cd frontend
yarn run build -- --configuration prod --output-path=../dist
.PHONY: frontend-test
.PHONY: test-frontend
# reduce logging, disable angular-cli analytics for ci environment
frontend-test: frontend-dep
test-frontend: dep-frontend
cd frontend && npx ng test --watch=false
.PHONY: frontend-test-coverage
.PHONY: test-frontend-coverage
# reduce logging, disable angular-cli analytics for ci environment
frontend-test-coverage: frontend-dep
test-frontend-coverage: dep-frontend
cd frontend && npx ng test --watch=false --code-coverage
.PHONY: frontend-test-coverage-ci
.PHONY: test-frontend-coverage-ci
# reduce logging, disable angular-cli analytics for ci environment
frontend-test-coverage-ci: frontend-dep
test-frontend-coverage-ci: dep-frontend
cd frontend && npx ng test --watch=false --code-coverage --browsers=ChromeHeadlessCI

View File

@ -208,6 +208,7 @@
"."
],
"assets": [
"src/assets/sources",
{
"glob": "**/*",
"input": "./node_modules/dwv/decoders/",

View File

@ -81,23 +81,6 @@ const meta: Meta<GlossaryLookupComponent> = {
export default meta;
type Story = StoryObj<GlossaryLookupComponent>;
// More on writing stories with args: https://storybook.js.org/docs/angular/writing-stories/args
export const Empty: Story = {
};
export const PlainText: Story = {
args: {
code: "36955009",
codeSystem: "2.16.840.1.113883.6.96"
},
parameters: {
httpClientResp: {
url: "https://www.nidcr.nih.gov/health-info/taste-disorders/more-info?utm_source=medlineplus-connect&utm_medium=website&utm_campaign=mlp-connect",
publisher: "U.S. National Library of Medicine",
description: "Problems with the sense of taste can have a big impact on life. Taste stimulates the desire to eat and therefore plays a key role in nutrition. The sense of taste also helps keep us healthy by helping us detect spoiled food or drinks.",
}
}
};
export const Html: Story = {
args: {
@ -159,3 +142,21 @@ export const Html: Story = {
}
}
};
// More on writing stories with args: https://storybook.js.org/docs/angular/writing-stories/args
export const Empty: Story = {
};
export const PlainText: Story = {
args: {
code: "36955009",
codeSystem: "2.16.840.1.113883.6.96"
},
parameters: {
httpClientResp: {
url: "https://www.nidcr.nih.gov/health-info/taste-disorders/more-info?utm_source=medlineplus-connect&utm_medium=website&utm_campaign=mlp-connect",
publisher: "U.S. National Library of Medicine",
description: "Problems with the sense of taste can have a big impact on life. Taste stimulates the desire to eat and therefore plays a key role in nutrition. The sense of taste also helps keep us healthy by helping us detect spoiled food or drinks.",
}
}
};

View File

@ -1,4 +1,4 @@
<div class="card h-100 d-flex align-items-center justify-content-center mt-3 mt-3 rounded-0 cursor-pointer">
<div class="card h-100 d-flex align-items-center justify-content-center mt-3 mt-3 rounded-0 cursor-pointer" [ngClass]="{'card-disable': sourceInfo?.metadata?.hidden}">
<div (click)="onCardClick()" class="card-body">
<div class="h-100 d-flex align-items-center">

View File

@ -0,0 +1,114 @@
import type { Meta, StoryObj } from '@storybook/angular';
import {MedicalSourcesCardComponent} from './medical-sources-card.component'
// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction
const meta: Meta<MedicalSourcesCardComponent> = {
title: 'Components/MedicalSourcesCard',
component: MedicalSourcesCardComponent,
decorators: [
// moduleMetadata({
// imports: [AppModule]
// })
// applicationConfig({
// providers: [importProvidersFrom(AppModule)],
// }),
],
tags: ['autodocs'],
render: (args: MedicalSourcesCardComponent) => ({
props: {
backgroundColor: null,
...args,
},
}),
argTypes: {
sourceInfo: {
control: 'object',
},
status: {
control: 'text',
},
},
};
export default meta;
type Story = StoryObj<MedicalSourcesCardComponent>;
// More on writing stories with args: https://storybook.js.org/docs/angular/writing-stories/args
export const Entry: Story = {
args: {
sourceInfo: {
metadata: {
// aliases?: string[]
// brand_logo?: string
category: [],
display: "Aetna",
hidden: false,
// identifiers?: {[name:string]: string}
// patient_access_description?: string
// patient_access_url?: string
platform_type: "aetna",
source_type: "aetna"
}
}
}
};
export const LoadingAuthorize: Story = {
args: {
sourceInfo: {
metadata: {
// aliases?: string[]
// brand_logo?: string
category: [],
display: "Aetna",
hidden: false,
// identifiers?: {[name:string]: string}
// patient_access_description?: string
// patient_access_url?: string
platform_type: "aetna",
source_type: "aetna"
}
},
status: 'authorize'
},
};
export const LoadingToken: Story = {
args: {
sourceInfo: {
metadata: {
// aliases?: string[]
// brand_logo?: string
category: [],
display: "Aetna",
hidden: false,
// identifiers?: {[name:string]: string}
// patient_access_description?: string
// patient_access_url?: string
platform_type: "aetna",
source_type: "aetna"
}
},
status: 'token'
},
};
export const Hidden: Story = {
args: {
sourceInfo: {
metadata: {
// aliases?: string[]
// brand_logo?: string
category: [],
display: "Aetna",
hidden: true,
// identifiers?: {[name:string]: string}
// patient_access_description?: string
// patient_access_url?: string
platform_type: "aetna",
source_type: "aetna"
}
}
},
};

View File

@ -98,7 +98,7 @@
<a *ngIf="modalSelectedSourceListItem?.metadata.patient_access_url"
[href]="modalSelectedSourceListItem.metadata?.patient_access_url"
target="_blank"
class="mg-b-0">{{modalSelectedSourceListItem?.metadata.patient_access_url}}</a>
class="mg-b-0">{{modalSelectedSourceListItem?.metadata.patient_access_url | shortDomain}}</a>
</div><!-- media-body -->
</div><!-- media -->
<button type="button" class="btn btn-close" aria-label="Close" (click)="modal.dismiss('Cross click')">

View File

@ -4,19 +4,22 @@ import { NgModule } from '@angular/core';
// Pipes
import {FhirPathPipe} from './fhir-path.pipe';
import {FilterPipe} from './filter.pipe';
import { ShortDomainPipe } from './short-domain.pipe';
@NgModule({
declarations: [
FhirPathPipe,
FilterPipe,
ShortDomainPipe,
],
imports: [
],
exports: [
FhirPathPipe,
FilterPipe
FilterPipe,
ShortDomainPipe
]
})
export class PipesModule {}

View File

@ -0,0 +1,34 @@
import { ShortDomainPipe } from './short-domain.pipe';
describe('ShortDomainPipe', () => {
it('create an instance', () => {
const pipe = new ShortDomainPipe();
expect(pipe).toBeTruthy();
});
it('should successfully extract domains', () => {
//setup
const pipe = new ShortDomainPipe();
const urls = [
{test: "http://www.blog.classroom.me.uk/index.php", result: "www.blog.classroom.me.uk"},
{test: "http://www.youtube.com/watch?v=ClkQA2Lb_iE", result: "www.youtube.com"},
{test: "https://www.youtube.com/watch?v=ClkQA2Lb_iE", result: "www.youtube.com"},
{test: "www.youtube.com/watch?v=ClkQA2Lb_iE", result: "www.youtube.com"},
{test: "websitename.com:1234/dir/file.txt", result: "websitename.com:1234"},
{test: "example.com?param=value", result: "example.com"},
{test: "https://facebook.github.io/jest/", result: "facebook.github.io"},
{test: "youtube.com/watch?v=ClkQA2Lb_iE", result: "youtube.com"},
{test: "www.食狮.公司.cn", result: "www.食狮.公司.cn"},
{test: "b.c.kobe.jp", result: "b.c.kobe.jp"},
{test: "a.d.kyoto.or.jp", result: "a.d.kyoto.or.jp"},
{test: "http://localhost:4200/watch?v=ClkQA2Lb_iE", result: "localhost"},
];
//test
for(let urltest of urls) {
expect(pipe.transform(urltest.test)).toBe(urltest.result, `testing "${urltest.test}". Expecting ${pipe.transform(urltest.test)} to be ${urltest.result}`);
}
//assert
});
});

View File

@ -0,0 +1,26 @@
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'shortDomain'
})
export class ShortDomainPipe implements PipeTransform {
transform(url: string, args?: any): any {
if(!url){
return url
}
//check if protocol is included
if (!(url.indexOf('://') > -1)) {
return url.split('/')[0].split('?')[0];
} else {
try {
return (new URL(url).hostname) || url;
} catch (e) {
console.log("error parsing url", url, e)
return url
}
}
}
}