How to use snapshots method in ava

1// Licensed to the Apache Software Foundation (ASF) under one2// or more contributor license agreements.  See the NOTICE file3// distributed with this work for additional information4// regarding copyright ownership.  The ASF licenses this file5// to you under the Apache License, Version 2.0 (the6// "License"); you may not use this file except in compliance7// with the License.  You may obtain a copy of the License at8//9//   http://www.apache.org/licenses/LICENSE-2.010//11// Unless required by applicable law or agreed to in writing,12// software distributed under the License is distributed on an13// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY14// KIND, either express or implied.  See the License for the15// specific language governing permissions and limitations16// under the License.17(function(cloudStack, $) {18    cloudStack.uiCustom.recurringSnapshots = function(args) {19        var desc = args.desc;20        var selects = args.selects;21        var actions = args.actions;22        var dataProvider = args.dataProvider;23        return function(args) {24            var $snapshots = $('#template').find('.recurring-snapshots').clone();25            var context = args.context;26            // Update labels27            $snapshots.find('.forms ul li.hourly a').html(_l('label.hourly'));28            $snapshots.find('.forms ul li.daily a').html(_l('label.daily'));29            $snapshots.find('.forms ul li.weekly a').html(_l('label.weekly'));30            $snapshots.find('.forms ul li.monthly a').html(_l('label.monthly'));31            $snapshots.find('.field.timezone .name').html(_l('label.timezone'));32            $snapshots.find('.field.time .name').html(_l('label.time'));33            $snapshots.find('.field.time .value label').html(_l('label.minute.past.hour'));34            $snapshots.find('.add-snapshot-action.add').html(_l('label.add'));35            // Get description36            $snapshots.find('.desc').html(_l(desc));37            // Snapshot type tabs38            $snapshots.find('.forms').tabs();39            // Populate selects40            $snapshots.find('form select').each(function() {41                var $select = $(this);42                var selectData = selects[$select.attr('name')];43                if (selectData) {44                    selectData({45                        response: {46                            success: function(args) {47                                $(args.data).each(function() {48                                    var $option = $('<option>').appendTo($select);49                                    $option.val(this.id).html(_l(this.name));50                                });51                            }52                        }53                    });54                }55            });56            // Form validation57            $snapshots.find('form').validate();58            // Add snapshot59            $snapshots.find('.add-snapshot-action.add').click(function() {60                var $form = $snapshots.find('form:visible');61                if (!$form.valid()) return false;62                var formData = cloudStack.serializeForm($form);63                actions.add({64                    context: context,65                    snapshot: formData,66                    response: {67                        success: function(args) {68                            var $snapshotRow = $snapshots.find('.scheduled-snapshots tr').filter(function() {69                                return $(this).index() == args.data.type;70                            }).addClass('active').show();71                            $snapshotRow.data('json-obj', args.data);72                            // Update fields73                            $snapshotRow.find('td.time span').html(args.data.time);74                            $snapshotRow.find('td.day-of-week span').html(_l(75                                args.data['day-of-week'] ?76                                $snapshots.find('select[name=day-of-week] option').filter(function() {77                                    return $(this).val() == args.data['day-of-week'];78                                }).html() :79                                args.data['day-of-month']80                            ));81                            $snapshotRow.find('td.timezone span').html(82                                $snapshots.find('select[name=timezone] option').filter(function() {83                                    return $(this).val() == args.data['timezone'];84                                }).html()85                            );86                            $snapshotRow.find('td.keep span').html(args.data.keep);87                            $(':ui-dialog').dialog('option', 'position', 'center');88                            refreshSnapshotTabs();89                        }90                    }91                });92                return true;93            });94            // Enable/disable snapshot tabs based on table contents;95            var refreshSnapshotTabs = function() {96                $snapshots.find('li').each(function() {97                    var index = $(this).index();98                    var $tr = $snapshots.find('tr').filter(function() {99                        return $(this).index() == index;100                    });101                    if ($tr.size() && $tr.hasClass('active')) {102                        $(this).addClass('disabled ui-state-disabled');103                    } else {104                        $(this).removeClass('disabled ui-state-disabled');105                    }106                    if ($(this).is('.ui-tabs-selected.ui-state-disabled')) {107                        $snapshots.find('form').show();108                        if ($snapshots.find('li.ui-state-disabled').size() == $snapshots.find('li').size()) {109                            $snapshots.find('form').hide();110                        } else {111                            $snapshots.find('li:not(.ui-state-disabled):first a').click();112                        }113                    }114                });115            };116            // Remove snapshot117            $snapshots.find('.action.destroy').click(function() {118                var $tr = $(this).closest('tr');119                actions.remove({120                    context: context,121                    snapshot: $tr.data('json-obj'),122                    response: {123                        success: function(args) {124                            $tr.hide().removeClass('active');125                            $(':ui-dialog').dialog('option', 'position', 'center');126                            refreshSnapshotTabs();127                        }128                    }129                });130            });131            // Get existing data132            dataProvider({133                context: context,134                response: {135                    success: function(args) {136                        $(args.data).each(function() {137                            var snapshot = this;138                            // Get matching table row139                            var $tr = $snapshots.find('tr').filter(function() {140                                return $(this).index() == snapshot.type;141                            }).addClass('active').show();142                            $tr.data('json-obj', snapshot);143                            $tr.find('td.time span').html(snapshot.time);144                            $tr.find('td.timezone span').html(145                                $snapshots.find('select[name=timezone] option').filter(function() {146                                    return $(this).val() == snapshot['timezone'];147                                }).html()148                            );149                            $tr.find('td.keep span').html(snapshot.keep);150                            $tr.find('td.day-of-week span').html(151                                snapshot['day-of-week'] ?152                                $snapshots.find('select[name=day-of-week] option').filter(function() {153                                    return $(this).val() == snapshot['day-of-week'];154                                }).html() :155                                snapshot['day-of-month']156                            );157                        });158                        refreshSnapshotTabs();159                    }160                }161            });162            // Create dialog163            var $dialog = $snapshots.dialog({164                title: _l('label.action.recurring.snapshot'),165                dialogClass: 'recurring-snapshots',166                closeOnEscape: false,167                width: 600,168                buttons: [{169                    text: _l('label.done'),170                    'class': 'ok',171                    click: function() {172                        $dialog.fadeOut(function() {173                            $dialog.remove();174                        });175                        $('div.overlay').fadeOut(function() {176                            $('div.overlay').remove();177                        });178                    }179                }]180            }).closest('.ui-dialog').overlay();181            return $dialog;182        };183    };...

1import React, {2  memo, useCallback, useEffect, useRef, useState3} from "react";4import VirtualList from "react-tiny-virtual-list";5import PerfectScrollbar from "perfect-scrollbar";6import cx from "classnames";7import PropTypes from "prop-types";8import { toTwelveHourTime, compareProps, useDidUpdateEffect } from "../../../utils";9import Icon from "../icon";10import styles from "./card.module.css";11import Progress from "./progress";12const SnapshotList = memo((props) => {13  const scrollContainerRef = useRef(null);14  useEffect(15    () => {16      if (!props.loadingSnapshots && scrollContainerRef && scrollContainerRef.current) {17        // eslint-disable-next-line no-new18        new PerfectScrollbar(scrollContainerRef.current.rootNode);19      }20    },21    [props.loadingSnapshots]22  );23  return (24    <>25      {props.loadingSnapshots && <Progress />}26      {!_.isEmpty(props.snapshots) && (27        <div style={{ height: "100%" }}>28          <VirtualList29            ref={scrollContainerRef}30            width="100%"31            className={styles.scroll__container}32            height={Math.min(_.size(_.get(props, "snapshots")) * 25, 400)}33            itemCount={_.size(_.get(props, "snapshots"))}34            itemSize={25}35            renderItem={({ index, style }) => {36              const t = _.nth(_.get(props, "snapshots"), index);37              const status = _.get(t, "status");38              const value = _.get(t, "value");39              return (40                <div41                  aria-roledescription="link"42                  role="link"43                  tabIndex={0}44                  className={cx({45                    [styles.value]: true,46                    [styles.value___selected]: props.selectedTS === value47                  })}48                  key={`ts-${value}-${index}`}49                  onClick={props.onTsClick(value)}50                  style={style}51                >52                  <span>{toTwelveHourTime(_.toString(value).substr(-6))}</span>53                  {(status === 301 || status === 302) && (54                    <Icon55                      className={cx({56                        [styles.redirect_icon]: true,57                        [styles.redirect_icon___active]:58                          props.redirectTSCollection &&59                          value ===60                            props.redirectTSCollection[props.redirectedTS]61                      })}62                      name="redirect"63                      width={10}64                    />65                  )}66                  {status > 400 && (67                    <Icon68                      className={styles.error__icon}69                      name="error"70                      title="Error"71                      width={10}72                    />73                  )}74                </div>75              );76            }}77          />78        </div>79      )}80    </>81  );82}, compareProps(["snapshots", "loadingSnapshots", "selectedTS", "redirectedTS", "redirectTSCollection"]));83SnapshotList.propTypes = {84  onTsClick: PropTypes.func.isRequired,85  loadingSnapshots: PropTypes.bool.isRequired,86  snapshots: PropTypes.array,87  selectedTS: PropTypes.number,88  redirectTSCollection: PropTypes.object,89  redirectedTS: PropTypes.number90};91SnapshotList.defaultProps = {92  snapshots: [],93  selectedTS: null,94  redirectedTS: null,95  redirectTSCollection: null96};97const Card = memo((props) => {98  const {99    day,100    month,101    snapshots,102    x,103    y,104    year,105    onCardLeave,106    showCard,107    onTsClick,108    selectedTS,109    redirectedTS,110    redirectTSCollection,111    loadSnaphots,112    abort,113    loadingSnapshots,114    snapshotsError,115    cancelLoadSnapshots,116    retry,117    __CACHED__118  } = props;119  useDidUpdateEffect(120    () => {121      if (!_.isEmpty(snapshots)) {122        return;123      }124      if (showCard) {125        if (!__CACHED__) {126          loadSnaphots(127            `${year}${_.padStart(month, 2, "0")}${_.padStart(day, 2, "0")}`128          );129        } else {130          abort();131        }132      } else if (!__CACHED__) {133        cancelLoadSnapshots();134        abort();135      }136    },137    [showCard]138  );139  if (!showCard) {140    return null;141  }142  return (143    <div144      className={cx({145        [styles.card]: true,146        [styles.card___empty]: _.isEmpty(snapshots),147        [styles.card___redirect]: _.some(148          snapshots,149          (t) => _.indexOf([301, 302], _.get(t, "status")) > -1 ||150            _.get(t, "status") > 400151        )152      })}153      style={{ transform: `translate(${x}px, ${y}px)` }}154      onMouseLeave={onCardLeave}155    >156      {snapshotsError ? (157        <button type="button" className={styles.retry__btn} onClick={retry}>158          Retry159        </button>160      ) : null}161      <SnapshotList162        loadingSnapshots={loadingSnapshots || (!__CACHED__ && _.isEmpty(snapshots) &&163          !snapshotsError)}164        snapshots={snapshots}165        selectedTS={selectedTS}166        redirectedTS={redirectedTS}167        redirectTSCollection={redirectTSCollection}168        onTsClick={onTsClick}169        day={day}170        month={month}171        year={year}172      />173    </div>174  );175}, compareProps(["day", "x", "y", "snapshots", "tsCount", "year", "selectedTS", "redirectedTS", "redirectTSCollection", "__CACHED__", "showCard", "loadingSnapshots"]));176Card.propTypes = {177  onCardLeave: PropTypes.func.isRequired,178  cancelLoadSnapshots: PropTypes.func.isRequired,179  loadSnaphots: PropTypes.func.isRequired,180  onTsClick: PropTypes.func.isRequired,181  day: PropTypes.number,182  month: PropTypes.number,183  snapshots: PropTypes.array,184  x: PropTypes.number,185  y: PropTypes.number,186  year: PropTypes.number,187  showCard: PropTypes.bool,188  selectedTS: PropTypes.number,189  redirectedTS: PropTypes.number,190  redirectTSCollection: PropTypes.object,191  abort: PropTypes.func.isRequired,192  loadingSnapshots: PropTypes.bool,193  snapshotsError: PropTypes.bool,194  retry: PropTypes.func.isRequired,195  __CACHED__: PropTypes.bool196};197Card.defaultProps = {198  day: null,199  month: null,200  snapshots: null,201  x: null,202  y: null,203  year: null,204  redirectTSCollection: null,205  selectedTS: null,206  redirectedTS: null,207  showCard: false,208  loadingSnapshots: false,209  snapshotsError: false,210  __CACHED__: false211};212let cardInterpreter;213const CardContainer = memo((props) => {214  const [cardState, setCardState] = useState(215    _.get(props, "cardRef.state.context", {})216  );217  const loadSnaphots = (date) => {218    props.cardRef.send("LOAD_SNAPSHOTS", {219      payload: {220        url: props.url,221        date222      }223    });224  };225  const debouncedLoadSnapshots = useCallback(_.debounce(loadSnaphots, 1000), []);226  useEffect(227    () => {228      if (!props.cardRef) return;229      cardInterpreter = props.cardRef.onTransition((state) => {230        if (state.changed) {231          setCardState({232            ...state.context.card,233            ...{234              loadingSnapshots: state.matches("loadingSnapshots"),235              snapshotsError:236                state.matches("snapshotsError.rejected") ||237                state.matches("snapshotsError.timeout"),238              url: props.url,239              showCard: state.context.showCard240            }241          });242        }243      });244    },245    [props.cardRef, props.url]246  );247  useEffect(() => {248    if (cardInterpreter) {249      cardInterpreter.start();250    }251    return () => {252      if (cardInterpreter) {253        cardInterpreter.stop();254      }255    };256  }, []);257  return (258    <Card259      {...cardState}260      snapshots={_.get(cardState, "ts")}261      selectedTS={props.selectedTS}262      redirectedTS={props.redirectedTS}263      redirectTSCollection={props.redirectTSCollection}264      loadSnaphots={debouncedLoadSnapshots}265      cancelLoadSnapshots={() => {266        debouncedLoadSnapshots.cancel();267      }}268      onTsClick={props.onTsClick}269      onCardLeave={() => {270        props.cardRef.send("HIDE_CARD");271        props.onCardLeave();272      }}273      retry={() => {274        props.cardRef.send("RETRY");275      }}276      abort={() => {277        props.cardRef.send("CLEANUP");278      }}279    />280  );281}, compareProps(["cardRef", "url", "selectedTS", "redirectedTS", "redirectTSCollection"]));282CardContainer.propTypes = {283  cardRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,284  url: PropTypes.string.isRequired,285  onCardLeave: PropTypes.func.isRequired,286  onTsClick: PropTypes.func.isRequired,287  selectedTS: PropTypes.number,288  redirectedTS: PropTypes.number,289  redirectTSCollection: PropTypes.object290};291CardContainer.defaultProps = {292  selectedTS: null,293  redirectedTS: null,294  redirectTSCollection: null295};...

1'use strict';2import React from 'react';3import moment from 'moment';4import { sortListByDate } from './helpers/sort';5import { renderProvisionalLink } from "./render_provisional_status";6/**7 * Method to render the 'NEW PROVISIONAL' status of a given GDM's classification8 * @param {array} snapshots - List of snapshots associated with classification9 * @param {string} resourceType - A string value of either 'classification' or 'interpretation'10 * @param {object} gdm - The GDM object11 * @param {object} context - The global context object12 * @param {boolean} showLink - Whether to render link to view/approve provisional (gdm) or view provisional summary (interpretation)13 * @param {boolean} stringOnly - Whether return status text or status labels/tags (default returns labels/tags)14 * @param {boolean|null} isMyClassification - refer to `renderProvisionalLink()`15 * @param {string|null} affiliationId - refer to `renderProvisionalLink()`16 * @param {string|null} userId - refer to `renderProvisionalLink()`17 */18export function renderNewProvisionalStatus(snapshots, resourceType, gdm, context, showLink, stringOnly=false, isMyClassification=null, affiliationId=null, userId=null) {19    const sortedSnapshots = snapshots && snapshots.length ? sortListByDate(snapshots, 'date_created') : [];20    // Get any snapshots that had been provisioned21    const provisionedSnapshots = sortedSnapshots.filter(snapshot => {22        return snapshot.approvalStatus === 'Provisioned' && snapshot.resourceType === resourceType;23    });24    // Get any snapshots that had been approved25    const approvedSnapshots = sortedSnapshots.filter(snapshot => {26        return snapshot.approvalStatus === 'Approved' && snapshot.resourceType === resourceType;27    });28    // If the current provisional Classification is more recent than this approved Classification, display 'New Provisional' status29    let newProvisionalExist = false;30    if (provisionedSnapshots && provisionedSnapshots.length && approvedSnapshots && approvedSnapshots.length) {31        // The 'resource' object was absent in the flatten 'snapshot' object prior to R22 release.32        // So for those snapshots saved into 'associatedClassificationSnapshots' array previously,33        // comparing 'provisionalDate' to 'approvalDate' is impossible due to the absence of 'resource' obejct.34        // Going forward, we still want the 'provisionalDate' to 'approvalDate' comparison because it's more accurate.35        if (provisionedSnapshots[0].resource && provisionedSnapshots[0].resource.provisionalDate && approvedSnapshots[0].resource && approvedSnapshots[0].resource.approvalDate) {36            newProvisionalExist = moment(provisionedSnapshots[0].resource.provisionalDate).isAfter(approvedSnapshots[0].resource.approvalDate);37        } else {38            // Fallback timestamp comparison for old snapshots prior to R22 release39            newProvisionalExist = moment(provisionedSnapshots[0].date_created).isAfter(approvedSnapshots[0].date_created);40        }41    }42    let showProvisionalLink = false;43    if (resourceType === 'classification' &&44        context && context.name.match(/curation-central|provisional-curation|provisional-classification/) 45        && showLink) {46        showProvisionalLink = true;47    } else if (resourceType === 'interpretation' && showLink) {48        showProvisionalLink = true;49    }50    if (newProvisionalExist) {51        if (stringOnly) {52            return 'New Provisional';53        } else {54            return (55                <span className="status-wrapper new-provisional">56                    <span className="label label-info status-item" data-toggle="tooltip" data-placement="top"57                        data-tooltip={'Provisioned on ' + moment(provisionedSnapshots[0].date_created).format("YYYY MMM DD, h:mm a")}>58                        <span className="badge">NEW</span> PROVISIONAL59                    </span>60                    {showProvisionalLink ? renderProvisionalLink(provisionedSnapshots[0], resourceType, gdm, isMyClassification, affiliationId, userId) : null}61                </span>62            );63        }64    } else {65        return null;66    }...

1'use strict';2import React from 'react';3import moment from 'moment';4import { sortListByDate } from './helpers/sort';5/**6 * Method to render the publication status of a given GDM's classification7 * @param {array} snapshots - List of snapshots associated with classification8 * @param {boolean} stringOnly - Whether return status text or status labels/tags (default returns labels/tags)9 */10export function renderPublishStatus(snapshots, stringOnly=false) {11    const sortedSnapshots = snapshots && snapshots.length ? sortListByDate(snapshots, 'date_created') : [];12    // Get any snapshots that had been published13    const publishedSnapshots = sortedSnapshots.filter(snapshot => {14        return (snapshot.resource && snapshot.resource.publishClassification) || snapshot.publishStatus;15    });16    // Get any snapshots that had been approved but not published17    const approvedSnapshots = sortedSnapshots.filter(snapshot => {18        return snapshot.approvalStatus === 'Approved' && ((snapshot.resource && !snapshot.resource.publishClassification) || !snapshot.publishStatus);19    });20    // If the current approved Classification is more recent than this published Classification, show warning message21    let publishedWarningMessage = false; 22    if (approvedSnapshots && approvedSnapshots.length && publishedSnapshots && publishedSnapshots.length) {23        // The 'resource' object was absent in the flatten 'snapshot' object prior to R22 release.24        // So for those snapshots saved into 'associatedClassificationSnapshots' array previously,25        // comparing 'approvalDate' to 'publishDate' is impossible due to the absence of 'resource' obejct.26        // Going forward, we still want the 'approvalDate' to 'publishDate' comparison because it's more accurate.27        if (approvedSnapshots[0].resource && approvedSnapshots[0].resource.approvalDate && publishedSnapshots[0].resource && publishedSnapshots[0].resource.publishDate) {28            publishedWarningMessage = moment(approvedSnapshots[0].resource.approvalDate).isAfter(publishedSnapshots[0].resource.publishDate);29        } else {30            // For snapshots saved into 'associatedClassificationSnapshots' array prior to R22 release,31            // we fallback to compare their 'date_created' timestamps - current approved vs. previously approved/published32            publishedWarningMessage = moment(approvedSnapshots[0].date_created).isAfter(publishedSnapshots[0].date_created);33        }34    }35    if (publishedSnapshots && publishedSnapshots.length) {36        let publishDate = publishedSnapshots[0].resource && publishedSnapshots[0].resource.publishDate ? publishedSnapshots[0].resource.publishDate : null;37        if (stringOnly) {38            return 'Published';39        } else {40            return (41                <span className="status-wrapper publication">42                    {publishDate ?43                        <span className="label publish-background status-item" data-toggle="tooltip" data-placement="top"44                            data-tooltip={'Published on ' + moment(publishDate).format("YYYY MMM DD, h:mm a")}>45                            PUBLISHED46                        </span>47                        :48                        <span className="label publish-background status-item">PUBLISHED</span>49                    }50                    {publishedWarningMessage ? renderPublishedWarningMessage() : null}51                </span>52            );53        }54    } else {55        return null;56    }57}58function renderPublishedWarningMessage() {59    return (60        <span className="publish-warning" data-toggle="tooltip" data-placement="top"61            data-tooltip="The current approved Classification is more recent than this published Classification.">62            <i className="icon icon-exclamation-triangle"></i>63        </span>64    );...

1(function() {2    'use strict';3    angular.module('frontend.snapshots', [4    ]);5    // Module configuration6    angular.module('frontend.snapshots')7        .config([8            '$stateProvider',9            function config($stateProvider) {10                $stateProvider11                    .state('snapshots', {12                        url: '/snapshots',13                        parent : 'frontend',14                        data : {15                            access : 2,16                            pageName : "Snapshots",17                            pageDescription : "Snapshots_detail",18                            prefix : '<i class="mdi mdi-camera"></i>'19                        },20                        views: {21                            'content@': {22                                templateUrl: 'js/app/snapshots/index.html',23                                controller: 'SnapshotsController'24                            },25                            'list@snapshots': {26                                templateUrl: 'js/app/snapshots/views/snapshots-list.html',27                                controller: 'SnapshotsListController',28                            },29                            'scheduled@snapshots': {30                                templateUrl: 'js/app/snapshots/views/snapshots-scheduled.html',31                                controller: 'SnapshotsScheduledController',32                            },33                        }34                    })35                    .state('snapshots.show', {36                        url: '/:id',37                        parent : 'snapshots',38                        data : {39                            access :  2,40                            pageName : "Snapshot Details",41                            displayName : "snapshot details",42                            pageDescription : null,43                            prefix : '<i class="mdi mdi-36px mdi-camera"></i>'44                        },45                        views: {46                            'content@': {47                                templateUrl: 'js/app/snapshots/views/snapshot.html',48                                controller: 'SnapshotController'49                            },50                        }51                    });52            }53        ])54    ;...