go.chromium.org/luci@v0.0.0-20240309015107-7cdc2e660f33/milo/ui/src/common/components/result_entry/artifact_provider.ts (about)

     1  // Copyright 2020 The LUCI Authors.
     2  //
     3  // Licensed under the Apache License, Version 2.0 (the "License");
     4  // you may not use this file except in compliance with the License.
     5  // You may obtain a copy of the License at
     6  //
     7  //      http://www.apache.org/licenses/LICENSE-2.0
     8  //
     9  // Unless required by applicable law or agreed to in writing, software
    10  // distributed under the License is distributed on an "AS IS" BASIS,
    11  // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    12  // See the License for the specific language governing permissions and
    13  // limitations under the License.
    14  
    15  import { html, PropertyValues } from 'lit';
    16  import { customElement } from 'lit/decorators.js';
    17  import { makeObservable, observable, reaction } from 'mobx';
    18  
    19  import { Artifact } from '@/common/services/resultdb';
    20  import { MobxExtLitElement } from '@/generic_libs/components/lit_mobx_ext';
    21  import { createContextLink, provider } from '@/generic_libs/tools/lit_context';
    22  
    23  export const [provideArtifacts, consumeArtifacts] =
    24    createContextLink<Map<string, Artifact>>();
    25  export const [provideArtifactsFinalized, consumeArtifactsFinalized] =
    26    createContextLink<boolean>();
    27  
    28  /**
    29   * Provides artifacts information.
    30   */
    31  @customElement('milo-artifact-provider')
    32  @provider
    33  export class ArtifactProvider extends MobxExtLitElement {
    34    @observable.ref
    35    @provideArtifacts()
    36    artifacts!: Map<string, Artifact>;
    37  
    38    @observable.ref
    39    @provideArtifactsFinalized()
    40    finalized = false;
    41  
    42    constructor() {
    43      super();
    44      makeObservable(this);
    45    }
    46  
    47    connectedCallback(): void {
    48      super.connectedCallback();
    49  
    50      this.addDisposer(
    51        reaction(
    52          () => this.artifacts,
    53          (artifacts) => {
    54            // Emulate @property() update.
    55            this.updated(new Map([['artifacts', artifacts]]));
    56          },
    57          { fireImmediately: true },
    58        ),
    59      );
    60      this.addDisposer(
    61        reaction(
    62          () => this.finalized,
    63          (finalized) => {
    64            // Emulate @property() update.
    65            this.updated(new Map([['finalized', finalized]]));
    66          },
    67          { fireImmediately: true },
    68        ),
    69      );
    70    }
    71  
    72    protected updated(changedProperties: PropertyValues) {
    73      super.updated(changedProperties);
    74    }
    75  
    76    protected render() {
    77      return html` <slot></slot> `;
    78    }
    79  }