othmane/ohif-viewer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #873 from dannyrb/docs/monorepo-updates-3

Browse Source 
docs: contributing and recipes
This commit is contained in:
Danny Brown 2019-09-05 22:33:49 -04:00 committed by GitHub
commit 98bd960014
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
21 changed files with 166 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@ -273,7 +273,6 @@ MIT © [OHIF](https://github.com/OHIF)
[netlify-image]: https://api.netlify.com/api/v1/badges/a5d369ab-18a6-41c3-bcde-83805205ac7f/deploy-status
[netlify-url]: https://app.netlify.com/sites/ohif/deploys
[all-contributors-image]: https://img.shields.io/badge/all_contributors-0-orange.svg?style=flat-square
[contributing-url]: https://github.com/OHIF/Viewers/blob/master/CONTRIBUTING.md
[circleci-image]: https://circleci.com/gh/OHIF/Viewers.svg?style=svg
[circleci-url]: https://circleci.com/gh/OHIF/Viewers
[codecov-image]: https://codecov.io/gh/OHIF/Viewers/branch/master/graph/badge.svg

2
docs/latest/README.md
View File

@ -40,7 +40,7 @@ Check out these helpful links:
- Ready to dive into some code? Check out our
[Getting Started Guide](./essentials/getting-started.md).
- We're an active, vibrant community.
[Learn how you can be more involved.](./contributing.md)
[Learn how you can be more involved.](./contributing/index.md)
- Feeling lost? Read our [help page](./help.md).
<!--

2
docs/latest/SUMMARY.md
View File

@ -46,6 +46,6 @@
---
- [FAQ](frequently-asked-questions.md)
- [Contributing](contributing.md)
- [Contributing](contributing/index.md)
- [Browser Support](browser-support.md)
- [Help](help.md)

BIN
docs/latest/assets/img/cornerstone-tools-link.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 422 KiB

103
docs/latest/contributing.md
View File

@ -1,103 +0,0 @@
# Contributing
## I would like to contribute code - how do I do this?
Fork the repository, make your change and submit a pull request.
- The OHIF Viewer consists of code from three different repositories. Make sure
your change is modifying the appropriate one:
- `ohif-core`: Business Logic
- `react-viewerbase`: Reusable React Component Library
- `Viewers`: The glue, PWA, and primary extension point
- At a minimum, you may want to read the following documentation:
- [Essentials: Getting Started](./essentials/getting-started.md)
- [Advanced: Architecture](./advanced/architecture.md)
### When changes impact multiple repositories
This is a particularly tricky scenario. We don't want to publish code in one
repository, just so we can test and complete the other half of its requirements
in another. Thankfully, there are a couple of ways you can test unpublished
dependent changes locally before publishing:
- [Use `yarn link`](https://yarnpkg.com/en/docs/cli/link)
For example if you are working on `ohif-core` and would like to use your local
version to debug a problem in `Viewers`, simply run yarn link inside of the
`ohif-core` project.
- If you're experiencing issues with `yarn link`,
[try `yalc`](https://github.com/whitecolor/yalc)
Yalc provides an improved workflow as we add more and more dependent packages
that are "in-progress". This comes into play as we begin working on extensions
and their dependencies.
```js
// Install yalc for the first time
yarn global add yalc
// EXAMPLE: using an in-development version of ohif-core w/ Viewers locally
// 1. Navigate to ohif-core's project root
yarn install
yalc publish
// 2. Run the following after each change to ohif-core
yarn build
yalc push .
// 3. Use the local package in our Viewers project. Navigate to the Viewers
// Project root.
yarn install
yalc add ohif-core
yarn run dev
```
## Any guidance on submitting changes?
While we do appreciate code contributions, triaging and integrating contributed
code changes can be very time consuming. Please consider the following tips when
working on your pull requests:
- Functionality is appropriate for the repository. Consider creating a GitHub
issue to discuss your suggested changes.
- The scope of the pull request is not too large. Please consider separate pull
requests for each feature as big pull requests are very time consuming to
understand.
We will provide feedback on your pull requests as soon as possible. Following
the tips above will help ensure your changes are reviewed.
## Testing contribution pull requests
OHIF uses [netlify](netlify.com) so that pull requests are autogenerated and
available for testing.
For example, [this url][example-url] allows you to test [pull request 237, the
request that created this FAQ entry,][pr-237] using data pulled from Amazon S3.
Replacing the number 237 in the link below with your pull request number should
let you test it as well and you can use this link for discussions on github
without requiring reviewers to download and build your branch.
```bash
https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
```
If you have made a documentation change, a link like this will let you preview
the gitbook generated by the pull request:
```bash
https://deploy-preview-237--ohif.netlify.com/contributing.html
```
<!--
Links
-->
<!-- prettier-ignore-start -->
[example-url]: https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
[pr-237]: https://github.com/OHIF/Viewers/pull/237
<!-- prettier-ignore-end -->

115
docs/latest/contributing/index.md Normal file
View File

@ -0,0 +1,115 @@
# Contributing
## How can I help?
Fork the repository, make your change and submit a pull request. If you would
like to discuss the changes you intend to make to clarify where or how they
should be implemented, please don't hesitate to create a new issue. At a
minimum, you may want to read the following documentation:
- [Essentials: Getting Started](./essentials/getting-started.md)
- [Advanced: Architecture](./advanced/architecture.md)
### When changes impact multiple repositories
While this can be tricky, we've tried to reduce how often this situation crops
up this with our [recent switch to a monorepo][monorepo]. Our maintained
extensions, ui components, internationalization library, and business logic can
all be developed by simply running `yarn run dev` from the repository root.
Testing the viewer with locally developed, unpublished package changes from a
package outside of the monorepo is most common with extension development. Let's
demonstrate how to accomplish this with two commonly forked extension
dependencies:
#### `cornerstone-tools`
On your local file system:
```bash
# code/my-projects/
.
├── cornerstonejs/cornerstone-tools
└── ohif/viewers
```
- Open a terminal/shell
- Navigate to `cornerstonejs/cornerstone-tools`
- `npm install`
- [`yarn link`](https://yarnpkg.com/en/docs/cli/link)
- `npm run dev`
- Open a new terminal/shell
- Navigate to `ohif/viewers`.
- `yarn install`
- [`yarn link cornerstone-tools`](https://yarnpkg.com/en/docs/cli/link)
- `yarn run dev`
As you make changed to `cornerstone-tools`, and it's output is rebuilt, you
should see the following behavior:
<!-- Insert GIF here -->
If you wish to stop using your local package, run the following commands in the
`ohif/viewers` repository root:
- `yarn unlink cornerstone-tools`
- `yarn install --force`
#### `react-vtkjs-viewport`
...
#### Other linkage notes
We're still working out some of the kinks with local package development as
there are a lot of factors that can influence the behavior of our development
server and bundler. If you encounter issues not addressed here, please don't
hesitate to reach out on GitHub.
## Any guidance on submitting changes?
While we do appreciate code contributions, triaging and integrating contributed
code changes can be very time consuming. Please consider the following tips when
working on your pull requests:
- Functionality is appropriate for the repository. Consider creating a GitHub
issue to discuss your suggested changes.
- The scope of the pull request is not too large. Please consider separate pull
requests for each feature as big pull requests are very time consuming to
understand.
We will provide feedback on your pull requests as soon as possible. Following
the tips above will help ensure your changes are reviewed.
## Testing contribution pull requests
OHIF uses [netlify](netlify.com) so that pull requests are autogenerated and
available for testing.
For example, [this url][example-url] allows you to test [pull request 237, the
request that created this FAQ entry,][pr-237] using data pulled from Amazon S3.
Replacing the number 237 in the link below with your pull request number should
let you test it as well and you can use this link for discussions on github
without requiring reviewers to download and build your branch.
```bash
https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
```
If you have made a documentation change, a link like this will let you preview
the gitbook generated by the pull request:
```bash
https://deploy-preview-237--ohif.netlify.com/contributing.html
```
<!--
Links
-->
<!-- prettier-ignore-start -->
[example-url]: https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
[pr-237]: https://github.com/OHIF/Viewers/pull/237
[monorepo]: https://github.com/OHIF/Viewers/issues/768
<!-- prettier-ignore-end -->

6
docs/latest/essentials/themeing.md
View File

@ -4,7 +4,7 @@ Themeing is currently accomplished with color variables that are defined within
the [`:root`](https://css-tricks.com/almanac/selectors/r/root/) selector
(allowing them to cascade across all elements). This repository's components,
and the ones we consume from our
[React Viewerbase component library](https://react.ohif.org/styling-and-theming)
[`@ohif/ui` component library](https://react.ohif.org/styling-and-theming)
utilize them. We are interested in pursuing more robust themeing options, and
open to pull requests and discussion issues.
@ -80,12 +80,12 @@ function RadicalImagingLogo() {
href: 'http://radicalimaging.com',
},
React.createElement('h5', {}, 'RADICAL IMAGING')
)
);
}
props.whiteLabelling = {
logoComponent: RadicalImagingLogo(),
}
};
```
<!--

4
docs/latest/essentials/translating.md
View File

@ -145,8 +145,8 @@ becomes a new namespace automatically.
- CineDialog: Translations for the toll tips inside the Cine Player Dialog
- Common: all common jargons that can be reused like `t('$t(common:image)')`
- Header: translations related to OHIF's Header Top Bar
- MeasurementTable - Translations for the react-viewerbase Measurement Table
- UserPreferencesModal - Translations for the react-viewerbase Preferences Modal
- MeasurementTable - Translations for the `@ohif/ui` Measurement Table
- UserPreferencesModal - Translations for the `@ohif/ui` Preferences Modal
### How to use another NameSpace inside the current NameSpace?

4
docs/latest/frequently-asked-questions.md
View File

@ -19,8 +19,8 @@ Follow the steps outlined in the [Bug Report Template][bug-report-template].
At the moment we are in the process of defining our roadmap and will do our best
to communicate this to the community. If your requested feature is on the
roadmap, then it will most likely be built at some point. If it is not, you are
welcome to build it yourself and [contribute it](contributing.md). If you have
resources and would like to fund the development of a feature, please
welcome to build it yourself and [contribute it](contributing/index.md). If you
have resources and would like to fund the development of a feature, please
[contact us](http://www.ohif.org) or work with community members that offer
[consulting services][commercial-support].

2
extensions/cornerstone/src/toolbarModule.js
View File

@ -3,8 +3,6 @@
// - Include SVG Source/Inline?
// - By URL, or own component?
// TODO: `ohif-core` toolbar builder?
// What KINDS of toolbar buttons do we have...
// - One's that dispatch commands
// - One's that set tool's active

4
extensions/dicom-html/package.json
View File

@ -20,9 +20,9 @@
"access": "public"
},
"scripts": {
"dev": "cross-env NODE_ENV=production webpack --config .webpack/webpack.dev.js --watch --debug --output-pathinfo",
"dev": "cross-env NODE_ENV=development webpack --config .webpack/webpack.dev.js --watch --debug --output-pathinfo",
"dev:dicom-html": "yarn run dev",
"build": "webpack --config .webpack/webpack.prod.js",
"build": "cross-env NODE_ENV=production webpack --config .webpack/webpack.prod.js",
"build:package": "yarn run build",
"prepublishOnly": "yarn run build",
"start": "yarn run dev"

13
platform/core/README.md
View File

@ -35,7 +35,7 @@ can be used with Vue, React, Vanilla JS, or any number of other frameworks.
The documentation for this library is sparse. The best way to get started is to
look at its
[top level exports](https://github.com/OHIF/ohif-core/blob/master/src/index.js),
[top level exports](https://github.com/OHIF/Viewers/blob/master/platform/core/src/index.js),
and explore the source code of features that interest you. If you want to see
how we use this library, you can check out [our viewer
implementation][react-viewer].
@ -57,12 +57,12 @@ yarn add @ohif/core --exact
### Usage
Usage is dependent on the feature(s) you want to leverage. The bulk of
`ohif-core`'s features are "pure" and can be imported and used in place.
`@ohif/core`'s features are "pure" and can be imported and used in place.
_Example: retrieving study metadata from a server_
```js
import { studies } from "@ohif/core";
import { studies } from '@ohif/core';
const studiesMetadata = await studies.retrieveStudiesMetadata(
server, // Object
@ -125,11 +125,10 @@ Links:
<!-- prettier-ignore-start -->
<!-- ROW -->
[npm-url]: https://npmjs.org/package/ohif-core
[npm-downloads-image]: https://img.shields.io/npm/dm/ohif-core.svg?style=flat-square
[npm-version-image]: https://img.shields.io/npm/v/ohif-core.svg?style=flat-square
[npm-url]: https://npmjs.org/package/@ohif/core
[npm-downloads-image]: https://img.shields.io/npm/dm/@ohif/core.svg?style=flat-square
[npm-version-image]: https://img.shields.io/npm/v/@ohif/core.svg?style=flat-square
[all-contributors-image]: https://img.shields.io/badge/all_contributors-0-orange.svg?style=flat-square
[contributing-url]: https://github.com/OHIF/ohif-core/blob/master/CONTRIBUTING.md
[license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square
[license-url]: LICENSE
<!-- Misc. -->

17
platform/ui/README.md
View File

@ -49,8 +49,8 @@ yarn add @ohif/ui --exact
## Usage
```jsx
import React, { Component } from "react";
import { LayoutButton } from "@ohif/ui";
import React, { Component } from 'react';
import { LayoutButton } from '@ohif/ui';
class Example extends Component {
constructor(props) {
@ -58,10 +58,10 @@ class Example extends Component {
this.state = {
selectedCell: {
className: "hover",
className: 'hover',
col: 1,
row: 1
}
row: 1,
},
};
}
@ -117,10 +117,9 @@ Links:
<!-- prettier-ignore-start -->
[all-contributors-image]: https://img.shields.io/badge/all_contributors-0-orange.svg?style=flat-square
[contributing-url]: https://github.com/OHIF/react-viewerbase/blob/master/CONTRIBUTING.md
[npm-url]: https://npmjs.org/package/react-viewerbase
[npm-downloads-image]: https://img.shields.io/npm/dm/react-viewerbase.svg?style=flat-square
[npm-version-image]: https://img.shields.io/npm/v/react-viewerbase.svg?style=flat-square
[npm-url]: https://npmjs.org/package/@ohif/ui
[npm-downloads-image]: https://img.shields.io/npm/dm/@ohif/ui.svg?style=flat-square
[npm-version-image]: https://img.shields.io/npm/v/@ohif/ui.svg?style=flat-square
[license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square
[license-url]: LICENSE
<!-- prettier-ignore-end -->

2
platform/ui/src/__docs__/compatibility.mdx
View File

@ -7,7 +7,7 @@ route: /compatibility
## Browser Support
React Viewerbase relies on
`@ohif/ui` relies on
[browsers supported by Styled Components](https://www.styled-components.com/docs/faqs#which-browsers-are-supported)
or browsers supported by emotion.

16
platform/ui/src/__docs__/getting-started.mdx
View File

@ -11,20 +11,20 @@ route: /getting-started
> possibility of introducing breaking changes. Please depend on an "exact"
> version in your projects to prevent issues caused by loose versioning.
Install `react-viewerbase` from npm:
Install `@ohif/ui` from npm:
```shell
// with npm
npm i react-viewerbase --save-exact
npm i @ohif/ui --save-exact
// with yarn
yarn add react-viewerbase --exact
yarn add @ohif/ui --exact
```
## Usage
There is some setup required for `react-viewerbase`. We are working to eliminate
these requirements with the goal of providing ready to use components.
There is some setup required for `@ohif/ui`. We are working to eliminate these
requirements with the goal of providing ready to use components.
### External Dependencies
@ -37,8 +37,8 @@ or the font you set for your theme:
'https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700|Sanchez&display=swap';
```
React Viewerbase also looks for theme CSS variabled defined on `:root`. You can
find a list of variables [on the theming page](/styling-and-theming)
`@ohif/ui` also looks for theme CSS variabled defined on `:root`. You can find a
list of variables [on the theming page](/styling-and-theming)
### Import & Use
@ -46,7 +46,7 @@ You can use components in your React app:
```js
import React, { Component } from 'react';
import { LayoutButton } from 'react-viewerbase';
import { LayoutButton } from '@ohif/ui';
class Example extends Component {
constructor(props) {

18
platform/ui/src/__docs__/introduction.mdx
View File

@ -3,14 +3,14 @@ name: Introduction
route: /
---
import { Playground, Props } from 'docz'
import { State } from 'react-powerplug'
import { TableList, TableListItem } from './../index.js'
import { Playground, Props } from 'docz';
import { State } from 'react-powerplug';
import { TableList, TableListItem } from './../index.js';
# Introduction
**React Viewerbase is a collection of components and utilities** that power
OHIF's [zero-footprint DICOM viewer](https://github.com/OHIF/Viewers)
**@ohif/ui is a collection of components and utilities** that power OHIF's
[zero-footprint DICOM viewer](https://github.com/OHIF/Viewers)
([demo][demo-url]). We maintain them as a separate component library to:
- Decouple presentation from business logic
@ -25,11 +25,11 @@ OHIF's [zero-footprint DICOM viewer](https://github.com/OHIF/Viewers)
> version in your projects to prevent issues caused by loose versioning.
```js
// Add 'react-viewerbase' as a dependency
yarn add react-viewerbase
// Add '@ohif/ui' as a dependency
yarn add @ohif/ui
// Import and use components
import { TableList } from 'react-viewerbase'
import { TableList } from '@ohif/ui'
```
<Playground>
@ -56,7 +56,7 @@ import { TableList } from 'react-viewerbase'
>
<label>{item.label}</label>
</TableListItem>
)
);
})}
</TableList>
)}

12
platform/ui/src/__docs__/translating.mdx
View File

@ -36,9 +36,9 @@ export default withTranslation('MyNameSpace')(MyComponent);
For further information about namespaces and how they work, please visit
[OHIF Namespaces docs](https://docs.ohif.org/essentials/translating.html#namespaces).
### How to get right the Name Space of a react-viewerbase component?
### How to get right the Namespace of a `@ohif/ui` component?
Check the component's page in this site, the NameSpace information should be on
Check the component's page in this site, the Namespace information should be on
the bottom line.
Also, a nameSpace is defined when exporting a component, this information can be
@ -50,10 +50,10 @@ E.g.
export default withTranslation('TheNamespaceYouAreLookingFor')(TheComponentYouWantToUse);
```
### How to use another NameSpace inside the current NameSpace?
### How to use another Namespace inside the current Namespace?
i18next provides a parsing feature able to get translations strings from any
NameSpace, like this following example getting data from `InnerSpace` NameSpace:
Namespace, like this following example getting data from `InnerSpace` Namespace:
```
$t(InnerSpace:Reset)
@ -64,8 +64,8 @@ export default withTranslation('OuterSpace')(TheComponent);
## I18next Provider
**React Viewerbase** pass down the `t` function trough the custom
[withTranslation HOC](https://github.com/OHIF/react-viewerbase/blob/master/src/utils/LanguageProvider.js).
**@ohif/ui** pass down the `t` function trough the custom
[withTranslation HOC](https://github.com/OHIF/Viewers/blob/master/platform/ui/src/utils/LanguageProvider.js).
---

5
platform/ui/src/components/cineDialog/CineDialog.js
View File

@ -121,11 +121,6 @@ class CineDialog extends PureComponent {
}
};
// TODO:
// - Add next / previous display set buttons which just call
// onClickNextDisplaySet and onClickPreviousDisplaySet which are passed in as props.
// See https://github.com/OHIF/Viewers/blob/master/Packages/ohif-viewerbase/client/components/viewer/cineDialog/cineDialog.html#L38
// - Add 'isEnabled' prop: https://github.com/OHIF/Viewers/blob/master/Packages/ohif-viewerbase/client/components/viewer/cineDialog/cineDialog.js#L301
render() {
const { t } = this.props;
return (

1
platform/viewer/README.md
View File

@ -188,7 +188,6 @@ Links:
[docker-pulls-img]: https://img.shields.io/docker/pulls/ohif/viewer.svg?style=flat-square
[docker-image-url]: https://hub.docker.com/r/ohif/viewer
[all-contributors-image]: https://img.shields.io/badge/all_contributors-0-orange.svg?style=flat-square
[contributing-url]: https://github.com/OHIF/Viewers/blob/react/CONTRIBUTING.md
[license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square
[license-url]: LICENSE
<!-- DOCS -->

3
platform/viewer/public/config/docker_openresty-orthanc-keycloak.js
View File

@ -13,7 +13,6 @@ window.config = {
imageRendering: 'wadors',
thumbnailRendering: 'wadors',
// REQUIRED TAG:
// https://github.com/OHIF/ohif-core/blob/59e1e04b92be24aee5d4402445cb3dcedb746995/src/studies/retrieveStudyMetadata.js#L54
// TODO: Remove tag after https://github.com/OHIF/ohif-core/pull/19 is merged and we bump version
requestOptions: {
// undefined to use JWT + Bearer auth
@ -39,4 +38,4 @@ window.config = {
post_logout_redirect_uri: '/logout-redirect.html',
},
],
}
};

2
platform/viewer/src/store/index.js
View File

@ -11,7 +11,7 @@ import { reducer as oidcReducer } from 'redux-oidc';
import { redux } from '@ohif/core';
import thunkMiddleware from 'redux-thunk';
// Combine our ohif-core, ui, and oidc reducers
// Combine our @ohif/core, ui, and oidc reducers
// Set init data, using values found in localStorage
const { reducers, localStorage } = redux;
const middleware = [thunkMiddleware];