Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

set appLayout in share #963

Merged
merged 2 commits into from
Oct 16, 2024
Merged

set appLayout in share #963

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
00d896a
set appLayout in share
jmhauck Oct 16, 2024
220d0a1
Merge branch 'develop' into add-share-to-map-card
jmhauck Oct 16, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions src/components.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -795,6 +795,10 @@ export namespace Components {
"showNextIcon"?: boolean;
}
interface LayerTable {
/**
* AppLayout: the current app layout
*/
"appLayout": AppLayout;
/**
* Closes the filter
*/
Expand Down Expand Up @@ -899,6 +903,10 @@ export namespace Components {
interface LocationFlowItem {
}
interface MapCard {
/**
* AppLayout: the current app layout
*/
"appLayout": AppLayout;
/**
* Array of objects containing proxy information for premium platform services.
*/
Expand Down Expand Up @@ -3488,6 +3496,10 @@ declare namespace LocalJSX {
"showNextIcon"?: boolean;
}
interface LayerTable {
/**
* AppLayout: the current app layout
*/
"appLayout"?: AppLayout;
/**
* boolean: create filter modal optional (default true) boolean value to create filter modal in layer table
*/
Expand Down Expand Up @@ -3588,6 +3600,10 @@ declare namespace LocalJSX {
interface LocationFlowItem {
}
interface MapCard {
/**
* AppLayout: the current app layout
*/
"appLayout"?: AppLayout;
/**
* Array of objects containing proxy information for premium platform services.
*/
Expand Down
2 changes: 2 additions & 0 deletions src/components/crowdsource-manager/crowdsource-manager.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -831,6 +831,7 @@ export class CrowdsourceManager {
return (
<div class={`${mapContainerClass} overflow-hidden`} id="card-mapView">
<map-card
appLayout={this.appLayout}
appProxies={this.appProxies}
basemapConfig={this.basemapConfig}
class="width-full"
Expand Down Expand Up @@ -991,6 +992,7 @@ export class CrowdsourceManager {
}
<div class={`width-full height-full position-relative z-index-0 ${tableClass}`}>
<layer-table
appLayout={this.appLayout}
createFilterModal={false}
defaultGlobalId={hasMapAndLayer ? globalId : undefined}
defaultLayerId={hasMapAndLayer ? this.defaultLayer : ""}
Expand Down
17 changes: 16 additions & 1 deletion src/components/layer-table/layer-table.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import { getLocaleComponentStrings } from "../../utils/locale";
import { getFeatureLayerView, getLayerOrTable, goToSelection } from "../../utils/mapViewUtils";
import { queryAllIds, queryAllOidsWithQueryFeatures, queryFeaturesByGlobalID } from "../../utils/queryUtils";
import * as downloadUtils from "../../utils/downloadUtils";
import { EditType, IColumnsInfo, IExportInfos, ILayerDef, IMapClick, IMapInfo, IToolInfo, IToolSizeInfo, TooltipPlacement } from "../../utils/interfaces";
import { AppLayout, EditType, IColumnsInfo, IExportInfos, ILayerDef, IMapClick, IMapInfo, IToolInfo, IToolSizeInfo, TooltipPlacement } from "../../utils/interfaces";
import "@esri/instant-apps-components/dist/components/instant-apps-social-share";
import { LayerExpression } from "@esri/instant-apps-components";

Expand All @@ -44,6 +44,11 @@ export class LayerTable {
//
//--------------------------------------------------------------------------

/**
* AppLayout: the current app layout
*/
@Prop() appLayout: AppLayout;

/**
* string: Global ID of the feature to select
*/
Expand Down Expand Up @@ -433,6 +438,14 @@ export class LayerTable {
//
//--------------------------------------------------------------------------

/**
* Update the url params when the appLayout changes
*/
@Watch("appLayout")
appLayoutWatchHandler(): void {
this._updateShareUrl();
}

/**
* Handle url defaults when defaultOid is set
*/
Expand Down Expand Up @@ -1658,6 +1671,8 @@ export class LayerTable {
urlObj.searchParams.delete("oid");
}

urlObj.searchParams.set("applayout", this.appLayout);

this._shareNode.shareUrl = urlObj.href;
}

Expand Down
45 changes: 23 additions & 22 deletions src/components/layer-table/readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,28 +7,29 @@

## Properties

| Property | Attribute | Description | Type | Default |
| ------------------------- | ----------------------------- | ------------------------------------------------------------------------------------------------------------------ | ---------- | ----------- |
| `createFilterModal` | `create-filter-modal` | boolean: create filter modal optional (default true) boolean value to create filter modal in layer table | `boolean` | `true` |
| `defaultGlobalId` | -- | string: Global ID of the feature to select | `string[]` | `undefined` |
| `defaultLayerId` | `default-layer-id` | string: when provided this layer ID will be used when the app loads | `string` | `undefined` |
| `defaultOid` | -- | number: when provided this will be used to select a feature in the table by default | `number[]` | `undefined` |
| `enableAutoRefresh` | `enable-auto-refresh` | boolean: when true the layer table will auto refresh the data | `boolean` | `undefined` |
| `enableCSV` | `enable-c-s-v` | boolean: when true the export to csv button will be available | `boolean` | `undefined` |
| `enableColumnReorder` | `enable-column-reorder` | boolean: when true the layer table will support drag/drop of columns to adjust order | `boolean` | `true` |
| `enableInlineEdit` | `enable-inline-edit` | boolean: when true edits can be applied directly within the table | `boolean` | `undefined` |
| `enableShare` | `enable-share` | boolean: when true the share widget will be available | `boolean` | `undefined` |
| `isMobile` | `is-mobile` | When true the component will render an optimized view for mobile devices | `boolean` | `undefined` |
| `mapHidden` | `map-hidden` | boolean: when true the map is hidden and map specific controls should be hidden | `boolean` | `undefined` |
| `mapInfo` | -- | IMapInfo: key configuration details about the current map | `IMapInfo` | `undefined` |
| `mapView` | -- | esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html | `MapView` | `undefined` |
| `onlyShowUpdatableLayers` | `only-show-updatable-layers` | boolean: When true only editable layers that support the update capability will be available | `boolean` | `undefined` |
| `selectedIds` | -- | number[]: A list of ids that are currently selected | `number[]` | `[]` |
| `shareIncludeEmbed` | `share-include-embed` | boolean: When true the share options will include embed option | `boolean` | `undefined` |
| `shareIncludeSocial` | `share-include-social` | boolean: When true the share options will include social media sharing | `boolean` | `undefined` |
| `showNewestFirst` | `show-newest-first` | boolean: when true the table will be sorted by objectid in descending order by default | `boolean` | `undefined` |
| `zoomAndScrollToSelected` | `zoom-and-scroll-to-selected` | boolean: When true the selected feature will zoomed to in the map and the row will be scrolled to within the table | `boolean` | `undefined` |
| `zoomToScale` | `zoom-to-scale` | number: default scale to zoom to when zooming to a single point feature | `number` | `undefined` |
| Property | Attribute | Description | Type | Default |
| ------------------------- | ----------------------------- | ------------------------------------------------------------------------------------------------------------------ | ----------------------------------------- | ----------- |
| `appLayout` | `app-layout` | AppLayout: the current app layout | `"mapView" \| "splitView" \| "tableView"` | `undefined` |
| `createFilterModal` | `create-filter-modal` | boolean: create filter modal optional (default true) boolean value to create filter modal in layer table | `boolean` | `true` |
| `defaultGlobalId` | -- | string: Global ID of the feature to select | `string[]` | `undefined` |
| `defaultLayerId` | `default-layer-id` | string: when provided this layer ID will be used when the app loads | `string` | `undefined` |
| `defaultOid` | -- | number: when provided this will be used to select a feature in the table by default | `number[]` | `undefined` |
| `enableAutoRefresh` | `enable-auto-refresh` | boolean: when true the layer table will auto refresh the data | `boolean` | `undefined` |
| `enableCSV` | `enable-c-s-v` | boolean: when true the export to csv button will be available | `boolean` | `undefined` |
| `enableColumnReorder` | `enable-column-reorder` | boolean: when true the layer table will support drag/drop of columns to adjust order | `boolean` | `true` |
| `enableInlineEdit` | `enable-inline-edit` | boolean: when true edits can be applied directly within the table | `boolean` | `undefined` |
| `enableShare` | `enable-share` | boolean: when true the share widget will be available | `boolean` | `undefined` |
| `isMobile` | `is-mobile` | When true the component will render an optimized view for mobile devices | `boolean` | `undefined` |
| `mapHidden` | `map-hidden` | boolean: when true the map is hidden and map specific controls should be hidden | `boolean` | `undefined` |
| `mapInfo` | -- | IMapInfo: key configuration details about the current map | `IMapInfo` | `undefined` |
| `mapView` | -- | esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html | `MapView` | `undefined` |
| `onlyShowUpdatableLayers` | `only-show-updatable-layers` | boolean: When true only editable layers that support the update capability will be available | `boolean` | `undefined` |
| `selectedIds` | -- | number[]: A list of ids that are currently selected | `number[]` | `[]` |
| `shareIncludeEmbed` | `share-include-embed` | boolean: When true the share options will include embed option | `boolean` | `undefined` |
| `shareIncludeSocial` | `share-include-social` | boolean: When true the share options will include social media sharing | `boolean` | `undefined` |
| `showNewestFirst` | `show-newest-first` | boolean: when true the table will be sorted by objectid in descending order by default | `boolean` | `undefined` |
| `zoomAndScrollToSelected` | `zoom-and-scroll-to-selected` | boolean: When true the selected feature will zoomed to in the map and the row will be scrolled to within the table | `boolean` | `undefined` |
| `zoomToScale` | `zoom-to-scale` | number: default scale to zoom to when zooming to a single point feature | `number` | `undefined` |


## Events
Expand Down
24 changes: 22 additions & 2 deletions src/components/map-card/map-card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
import { Component, Element, Event, EventEmitter, Host, h, Listen, Prop, State, Watch, Method, VNode } from "@stencil/core";
import MapCard_T9n from "../../assets/t9n/map-card/resources.json"
import { loadModules } from "../../utils/loadModules";
import { IBasemapConfig, IMapChange, IMapInfo, ISearchConfiguration, IToolInfo, IToolSizeInfo, theme, TooltipPlacement } from "../../utils/interfaces";
import { AppLayout, IBasemapConfig, IMapChange, IMapInfo, ISearchConfiguration, IToolInfo, IToolSizeInfo, theme, TooltipPlacement } from "../../utils/interfaces";
import { joinAppProxies } from "templates-common-library-esm/functionality/proxy";
import { getLocaleComponentStrings } from "../../utils/locale";
import { getFeatureLayerView, goToSelection } from "../../utils/mapViewUtils";
Expand Down Expand Up @@ -50,6 +50,11 @@ export class MapCard {
//
//--------------------------------------------------------------------------

/**
* AppLayout: the current app layout
*/
@Prop() appLayout: AppLayout;

/**
* Array of objects containing proxy information for premium platform services.
*/
Expand Down Expand Up @@ -386,6 +391,14 @@ export class MapCard {
//
//--------------------------------------------------------------------------

/**
* Update the url params when the appLayout changes
*/
@Watch("appLayout")
appLayoutWatchHandler(): void {
this._updateShareUrl();
}

/**
* Add/remove home widget
*/
Expand Down Expand Up @@ -621,6 +634,7 @@ export class MapCard {
this._resizeObserver.observe(this._toolbar);
this._observerSet = true;
}
this._updateShareUrl();
}

//--------------------------------------------------------------------------
Expand Down Expand Up @@ -711,6 +725,7 @@ export class MapCard {
mapView: this.mapView
});
}
this._updateShareUrl();
}

/**
Expand Down Expand Up @@ -974,7 +989,10 @@ export class MapCard {
class="instant-app-share"
embed={this.shareIncludeEmbed}
popoverButtonIconScale="s"
ref={el => this._shareNode = el}
ref={el => {
this._shareNode = el;
this._updateShareUrl();
}}
scale="m"
shareButtonColor="neutral"
shareButtonType="action"
Expand Down Expand Up @@ -1015,6 +1033,8 @@ export class MapCard {
urlObj.searchParams.delete("oid");
}

urlObj.searchParams.set("applayout", this.appLayout);

this._shareNode.shareUrl = urlObj.href;
}

Expand Down
1 change: 1 addition & 0 deletions src/components/map-card/readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@

| Property | Attribute | Description | Type | Default |
| ------------------------- | ---------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------- |
| `appLayout` | `app-layout` | AppLayout: the current app layout | `"mapView" \| "splitView" \| "tableView"` | `undefined` |
| `appProxies` | `app-proxies` | Array of objects containing proxy information for premium platform services. | `any` | `undefined` |
| `basemapConfig` | -- | IBasemapConfig: List of any basemaps to filter out from the basemap widget | `IBasemapConfig` | `undefined` |
| `defaultLayerId` | `default-layer-id` | string: when provided this layer ID will be used when the app loads | `string` | `undefined` |
Expand Down