+
+ {this.state.isLoading &&
}
+ {!this.state.isLoading &&
{ n && n.appendChild(this.renderedCard) }} />}
+
+
+ );
+ }
+}
diff --git a/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/components/IAdaptiveCardsImageGalleryProps.ts b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/components/IAdaptiveCardsImageGalleryProps.ts
new file mode 100644
index 000000000..37cf40146
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/components/IAdaptiveCardsImageGalleryProps.ts
@@ -0,0 +1,7 @@
+import { ServiceScope } from '@microsoft/sp-core-library';
+
+export interface IAdaptiveCardsImageGalleryProps {
+ serviceScope: ServiceScope;
+ imageGalleryName: string;
+ imagesToDisplay: number;
+}
diff --git a/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/components/IAdaptiveCardsImageGalleryState.ts b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/components/IAdaptiveCardsImageGalleryState.ts
new file mode 100644
index 000000000..90438ab07
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/components/IAdaptiveCardsImageGalleryState.ts
@@ -0,0 +1,5 @@
+export interface IAdaptiveCardsImageGalleryState {
+ galleryItems: any[];
+ isLoading: boolean;
+ showErrorMessage: boolean;
+}
\ No newline at end of file
diff --git a/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/loc/en-us.js b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/loc/en-us.js
new file mode 100644
index 000000000..1c7d9a593
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/loc/en-us.js
@@ -0,0 +1,9 @@
+define([], function() {
+ return {
+ "PropertyPaneDescription": "Description",
+ "BasicGroupName": "Group Name",
+ "DescriptionFieldLabel": "Description Field",
+ "ImageGalleryNameFieldLabel": "Image Gallery",
+ "ImagesToDisplayFieldLabel": "Number of images to display",
+ }
+});
\ No newline at end of file
diff --git a/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/loc/mystrings.d.ts b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/loc/mystrings.d.ts
new file mode 100644
index 000000000..7c3f06080
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/loc/mystrings.d.ts
@@ -0,0 +1,11 @@
+declare interface IAdaptiveCardsImageGalleryWebPartStrings {
+ PropertyPaneDescription: string;
+ BasicGroupName: string;
+ ImageGalleryNameFieldLabel: string;
+ ImagesToDisplayFieldLabel: string;
+}
+
+declare module 'AdaptiveCardsImageGalleryWebPartStrings' {
+ const strings: IAdaptiveCardsImageGalleryWebPartStrings;
+ export = strings;
+}
diff --git a/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/services/ImageGalleryService.ts b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/services/ImageGalleryService.ts
new file mode 100644
index 000000000..225910a11
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/src/webparts/adaptiveCardsImageGallery/services/ImageGalleryService.ts
@@ -0,0 +1,54 @@
+import { ServiceKey, ServiceScope } from '@microsoft/sp-core-library';
+import { PageContext } from '@microsoft/sp-page-context';
+import { SPHttpClient, SPHttpClientResponse } from '@microsoft/sp-http';
+import * as pnp from "sp-pnp-js";
+
+export interface IImageGalleryService {
+ getGalleryImages: (listName: string, rowLimit: number) => Promise
;
+}
+
+export class ImageGalleryService implements IImageGalleryService {
+ public static readonly serviceKey: ServiceKey = ServiceKey.create('ImageGallery:ImageGalleryService', ImageGalleryService);
+ private _pageContext: PageContext;
+
+ constructor(serviceScope: ServiceScope) {
+ serviceScope.whenFinished(() => {
+ this._pageContext = serviceScope.consume(PageContext.serviceKey);
+ });
+ }
+
+ public getGalleryImages(listName: string, rowLimit: number): Promise {
+ const xml = `
+
+
+
+
+
+
+
+
+
+
+
+ ` + rowLimit + `
+ `;
+
+ const q: any = {
+ ViewXml: xml,
+ };
+
+ return this._ensureList(listName).then((list) => {
+ if (list) {
+ return pnp.sp.web.lists.getByTitle(listName).getItemsByCAMLQuery(q).then((items: any[]) => {
+ return Promise.resolve(items);
+ });
+ }
+ });
+ }
+
+ private _ensureList(listName: string): Promise {
+ if (listName) {
+ return pnp.sp.web.lists.ensure(listName).then((listEnsureResult) => Promise.resolve(listEnsureResult.list));
+ }
+ }
+}
diff --git a/samples/react-adaptive-cards-image-gallery/teams/manifest.json b/samples/react-adaptive-cards-image-gallery/teams/manifest.json
new file mode 100644
index 000000000..737d37b5e
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/teams/manifest.json
@@ -0,0 +1,47 @@
+{
+ "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.2/MicrosoftTeams.schema.json",
+ "manifestVersion": "1.2",
+ "packageName": "AdaptiveCardsImageGallery",
+ "id": "769ec7d3-bd0d-4afc-9426-23a0c279acb4",
+ "version": "0.1",
+ "developer": {
+ "name": "SPFx + Teams Dev",
+ "websiteUrl": "https://products.office.com/en-us/sharepoint/collaboration",
+ "privacyUrl": "https://privacy.microsoft.com/en-us/privacystatement",
+ "termsOfUseUrl": "https://www.microsoft.com/en-us/servicesagreement"
+ },
+ "name": {
+ "short": "AdaptiveCardsImageGallery"
+ },
+ "description": {
+ "short": "Image Gallery implemented with Adaptive Cards",
+ "full": "Image Gallery implemented with Adaptive Cards"
+ },
+ "icons": {
+ "outline": "tab20x20.png",
+ "color": "tab96x96.png"
+ },
+ "accentColor": "#004578",
+ "configurableTabs": [
+ {
+ "configurationUrl": "https://{teamSiteDomain}{teamSitePath}/_layouts/15/TeamsLogon.aspx?SPFX=true&dest={teamSitePath}/_layouts/15/teamshostedapp.aspx%3FopenPropertyPane=true%26teams%26componentId=769ec7d3-bd0d-4afc-9426-23a0c279acb4",
+ "canUpdateConfiguration": false,
+ "scopes": [
+ "team"
+ ]
+ }
+ ],
+ "validDomains": [
+ "*.login.microsoftonline.com",
+ "*.sharepoint.com",
+ "*.sharepoint-df.com",
+ "spoppe-a.akamaihd.net",
+ "spoprod-a.akamaihd.net",
+ "resourceseng.blob.core.windows.net",
+ "msft.spoppe.com"
+ ],
+ "webApplicationInfo": {
+ "resource": "https://{teamSiteDomain}",
+ "id": "00000003-0000-0ff1-ce00-000000000000"
+ }
+}
diff --git a/samples/react-adaptive-cards-image-gallery/teams/tab20x20.png b/samples/react-adaptive-cards-image-gallery/teams/tab20x20.png
new file mode 100644
index 000000000..950c71d8c
Binary files /dev/null and b/samples/react-adaptive-cards-image-gallery/teams/tab20x20.png differ
diff --git a/samples/react-adaptive-cards-image-gallery/teams/tab96x96.png b/samples/react-adaptive-cards-image-gallery/teams/tab96x96.png
new file mode 100644
index 000000000..c9e4a2d79
Binary files /dev/null and b/samples/react-adaptive-cards-image-gallery/teams/tab96x96.png differ
diff --git a/samples/react-adaptive-cards-image-gallery/tsconfig.json b/samples/react-adaptive-cards-image-gallery/tsconfig.json
new file mode 100644
index 000000000..f13ec27a6
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/tsconfig.json
@@ -0,0 +1,34 @@
+{
+ "compilerOptions": {
+ "target": "es5",
+ "forceConsistentCasingInFileNames": true,
+ "module": "esnext",
+ "moduleResolution": "node",
+ "jsx": "react",
+ "declaration": true,
+ "sourceMap": true,
+ "experimentalDecorators": true,
+ "skipLibCheck": true,
+ "outDir": "lib",
+ "typeRoots": [
+ "./node_modules/@types",
+ "./node_modules/@microsoft"
+ ],
+ "types": [
+ "es6-promise",
+ "webpack-env"
+ ],
+ "lib": [
+ "es5",
+ "dom",
+ "es2015.collection"
+ ]
+ },
+ "include": [
+ "src/**/*.ts"
+ ],
+ "exclude": [
+ "node_modules",
+ "lib"
+ ]
+}
diff --git a/samples/react-adaptive-cards-image-gallery/tslint.json b/samples/react-adaptive-cards-image-gallery/tslint.json
new file mode 100644
index 000000000..23fa2aa43
--- /dev/null
+++ b/samples/react-adaptive-cards-image-gallery/tslint.json
@@ -0,0 +1,30 @@
+{
+ "extends": "@microsoft/sp-tslint-rules/base-tslint.json",
+ "rules": {
+ "class-name": false,
+ "export-name": false,
+ "forin": false,
+ "label-position": false,
+ "member-access": true,
+ "no-arg": false,
+ "no-console": false,
+ "no-construct": false,
+ "no-duplicate-variable": true,
+ "no-eval": false,
+ "no-function-expression": true,
+ "no-internal-module": true,
+ "no-shadowed-variable": true,
+ "no-switch-case-fall-through": true,
+ "no-unnecessary-semicolons": true,
+ "no-unused-expression": true,
+ "no-use-before-declare": true,
+ "no-with-statement": true,
+ "semicolon": true,
+ "trailing-comma": false,
+ "typedef": false,
+ "typedef-whitespace": false,
+ "use-named-parameter": true,
+ "variable-name": false,
+ "whitespace": false
+ }
+}
\ No newline at end of file