diff --git a/app/components/crate-sidebar.hbs b/app/components/crate-sidebar.hbs index e58acef3b79..8e0aafb96b2 100644 --- a/app/components/crate-sidebar.hbs +++ b/app/components/crate-sidebar.hbs @@ -48,37 +48,13 @@

Install

-

Run the following Cargo command in your project directory:

- {{#if (is-clipboard-supported)}} - - {{this.cargoAddCommand}} - {{svg-jar "copy" aria-hidden="true" local-class="copy-icon"}} - - {{else}} - - {{this.cargoAddCommand}} - - {{/if}} - -

Or add the following line to your Cargo.toml:

- {{#if (is-clipboard-supported)}} - - {{this.tomlSnippet}} - {{svg-jar "copy" aria-hidden="true" local-class="copy-icon"}} - - {{else}} - - {{this.tomlSnippet}} - - {{/if}} +
{{/unless}} diff --git a/app/components/crate-sidebar.js b/app/components/crate-sidebar.js index 35163b23b04..5915b375cd4 100644 --- a/app/components/crate-sidebar.js +++ b/app/components/crate-sidebar.js @@ -14,18 +14,6 @@ export default class CrateSidebar extends Component { return homepage && (!repository || simplifyUrl(repository) !== simplifyUrl(homepage)); } - get cargoAddCommand() { - return this.args.requestedVersion - ? `cargo add ${this.args.crate.name}@=${this.args.requestedVersion}` - : `cargo add ${this.args.crate.name}`; - } - - get tomlSnippet() { - let version = this.args.version.num.split('+')[0]; - let exact = this.args.requestedVersion ? '=' : ''; - return `${this.args.crate.name} = "${exact}${version}"`; - } - get playgroundLink() { let playgroundCrates = this.playground.crates; if (!playgroundCrates) return; diff --git a/app/components/crate-sidebar.module.css b/app/components/crate-sidebar.module.css index 3fc9311e8bc..c95382d5288 100644 --- a/app/components/crate-sidebar.module.css +++ b/app/components/crate-sidebar.module.css @@ -50,60 +50,6 @@ font-variant-numeric: tabular-nums; } -.copy-help { - font-size: 12px; -} - -.copy-button, -.copy-fallback { - display: flex; - width: 100%; - align-items: center; - justify-content: space-between; - padding: var(--space-2xs) var(--space-xs); - font-family: var(--font-monospace); - font-size: 14px; - line-height: 1.5em; - color: var(--main-color); - background: transparent; - border-radius: var(--space-3xs); - border: solid var(--space-4xs) var(--gray-border); - - span { - flex: auto; - display: block; - word-break: break-word; - } -} - -.copy-button { - text-align: start; - cursor: pointer; - - &:hover { - background-color: light-dark(white, #141413); - } -} - -.copy-icon { - flex-shrink: 0; - height: 1.1em; - width: auto; - /* for slightly nicer alignment... */ - margin-top: -3px; - margin-left: var(--space-2xs); - opacity: 0; - transition: opacity var(--transition-fast); - - .copy-button:hover & { - opacity: 1; - } -} - -.selectable { - user-select: text; -} - .links { > * + * { margin-top: var(--space-m); diff --git a/app/components/crate-sidebar/install-instructions.hbs b/app/components/crate-sidebar/install-instructions.hbs new file mode 100644 index 00000000000..f665f3d50db --- /dev/null +++ b/app/components/crate-sidebar/install-instructions.hbs @@ -0,0 +1,82 @@ +{{#if @binNames}} + {{#if (is-clipboard-supported)}} + + {{this.cargoInstallCommand}} + {{svg-jar "copy" aria-hidden="true" local-class="copy-icon"}} + + {{else}} + + {{this.cargoInstallCommand}} + + {{/if}} + +

+ {{#if (eq @binNames.length 1)}} + Running the above command will globally install the + {{get @binNames 0}} + binary. + {{else if (eq @binNames.length 2)}} + Running the above command will globally install the + {{get @binNames 0}} + and + {{get @binNames 1}} + binaries. + {{else}} + Running the above command will globally install these binaries: + {{#each @binNames as |binName index|~}} + {{~#if (eq index 0)~}} + {{binName}} + {{~else if (eq index (sum @binNames.length -1))}} + and {{binName}} + {{~else~}} + , {{binName}} + {{~/if}} + {{~/each}} + {{/if}} +

+ +{{/if}} + +{{#if (and @hasLib @binNames)}} +

Install as library

+{{/if}} + +{{#if @hasLib}} +

Run the following Cargo command in your project directory:

+ + {{#if (is-clipboard-supported)}} + + {{this.cargoAddCommand}} + {{svg-jar "copy" aria-hidden="true" local-class="copy-icon"}} + + {{else}} + + {{this.cargoAddCommand}} + + {{/if}} + +

Or add the following line to your Cargo.toml:

+ + {{#if (is-clipboard-supported)}} + + {{this.tomlSnippet}} + {{svg-jar "copy" aria-hidden="true" local-class="copy-icon"}} + + {{else}} + + {{this.tomlSnippet}} + + {{/if}} +{{/if}} \ No newline at end of file diff --git a/app/components/crate-sidebar/install-instructions.js b/app/components/crate-sidebar/install-instructions.js new file mode 100644 index 00000000000..e6a8ec185f4 --- /dev/null +++ b/app/components/crate-sidebar/install-instructions.js @@ -0,0 +1,21 @@ +import Component from '@glimmer/component'; + +export default class InstallInstructions extends Component { + get cargoInstallCommand() { + return this.args.exactVersion + ? `cargo install ${this.args.crate}@${this.args.version}` + : `cargo install ${this.args.crate}`; + } + + get cargoAddCommand() { + return this.args.exactVersion + ? `cargo add ${this.args.crate}@=${this.args.version}` + : `cargo add ${this.args.crate}`; + } + + get tomlSnippet() { + let version = this.args.version.split('+')[0]; + let exact = this.args.exactVersion ? '=' : ''; + return `${this.args.crate} = "${exact}${version}"`; + } +} diff --git a/app/components/crate-sidebar/install-instructions.module.css b/app/components/crate-sidebar/install-instructions.module.css new file mode 100644 index 00000000000..0499522eb20 --- /dev/null +++ b/app/components/crate-sidebar/install-instructions.module.css @@ -0,0 +1,59 @@ +.copy-help { + font-size: 12px; + overflow-wrap: break-word; +} + +.copy-button, +.copy-fallback { + display: flex; + width: 100%; + align-items: center; + justify-content: space-between; + padding: var(--space-2xs) var(--space-xs); + font-family: var(--font-monospace); + font-size: 14px; + line-height: 1.5em; + color: var(--main-color); + background: transparent; + border-radius: var(--space-3xs); + border: solid var(--space-4xs) var(--gray-border); + + span { + flex: auto; + display: block; + word-break: break-word; + } +} + +.copy-button { + text-align: start; + cursor: pointer; + + &:hover { + background-color: light-dark(white, #141413); + } +} + +.copy-icon { + flex-shrink: 0; + height: 1.1em; + width: auto; + /* for slightly nicer alignment... */ + margin-top: -3px; + margin-left: var(--space-2xs); + opacity: 0; + transition: opacity var(--transition-fast); + + .copy-button:hover & { + opacity: 1; + } +} + +.selectable { + user-select: text; +} + +.bin-name { + font-family: var(--font-monospace); + font-weight: bold; +} diff --git a/app/helpers/sum.js b/app/helpers/sum.js new file mode 100644 index 00000000000..b6ecabe262a --- /dev/null +++ b/app/helpers/sum.js @@ -0,0 +1,5 @@ +import { helper } from '@ember/component/helper'; + +export default helper(function ([...values]) { + return values.reduce((a, b) => a + b, 0); +}); diff --git a/app/models/version.js b/app/models/version.js index 83c46d3a53f..7a3ad8b4ca0 100644 --- a/app/models/version.js +++ b/app/models/version.js @@ -28,6 +28,11 @@ export default class Version extends Model { */ @attr rust_version; + /** @type {boolean | null} */ + @attr has_lib; + /** @type {string[] | null} */ + @attr bin_names; + @belongsTo('crate', { async: false, inverse: 'versions' }) crate; @belongsTo('user', { async: false, inverse: null }) published_by;