Instantly share code, notes, and snippets.

Embed
What would you like to do?
import * as React from 'react';
import { ICalendarEvent, ICalendarService } from '../../../shared/services/CalendarService';
import { MockCalendarService } from '../../../shared/services/CalendarService/MockCalendarService';
import styles from './CalendarFeedSummary.module.scss';
import { ICalendarFeedSummaryProps, ICalendarFeedSummaryState } from './CalendarFeedSummary.types';
export default class CalendarFeedSummary extends React.Component<ICalendarFeedSummaryProps, ICalendarFeedSummaryState> {
constructor(props: ICalendarFeedSummaryProps) {
super(props);
this.state = {
isLoading: false,
events: [],
};
}
public componentDidMount(): void {
this._loadEvents();
}
public render(): React.ReactElement<ICalendarFeedSummaryProps> {
return (
<div className={ styles.calendarFeedSummary }>
<ul>
{ this.state.events.map(e=>{
return <li>{e.title}</li>;
})}
</ul>
</div>
);
}
private _loadEvents(): Promise<void> {
// nothing in cache, load fresh
const dataProvider: ICalendarService = new MockCalendarService();
if (dataProvider) {
this.setState({
isLoading: true
});
return dataProvider.getEvents().then((events: ICalendarEvent[]) => {
// don't cache in the case of errors
this.setState({
isLoading: false,
events: events
});
return;
}).catch((error: any) => {
console.log("Exception returned by getEvents", error.message);
this.setState({
isLoading: false,
events: []
});
});
}
}
}
import { ICalendarEvent } from "../../../shared/services/CalendarService";
export interface ICalendarFeedSummaryProps {
description: string;
}
export interface ICalendarFeedSummaryState {
isLoading: boolean;
events: ICalendarEvent[];
}
import * as React from 'react';
import * as ReactDom from 'react-dom';
import { Version } from '@microsoft/sp-core-library';
import {
BaseClientSideWebPart,
IPropertyPaneConfiguration,
PropertyPaneTextField
} from '@microsoft/sp-webpart-base';
import * as strings from 'CalendarFeedSummaryWebPartStrings';
import CalendarFeedSummary from './components/CalendarFeedSummary';
import { ICalendarFeedSummaryProps } from './components/CalendarFeedSummary.types';
import { ICalendarFeedSummaryWebPartProps } from './CalendarFeedSummaryWebPart.types';
export default class CalendarFeedSummaryWebPart extends BaseClientSideWebPart<ICalendarFeedSummaryWebPartProps> {
public render(): void {
const element: React.ReactElement<ICalendarFeedSummaryProps > = React.createElement(
CalendarFeedSummary,
{
description: this.properties.description
}
);
ReactDom.render(element, this.domElement);
}
protected get dataVersion(): Version {
return Version.parse("1.0");
}
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
return {
pages: [
{
header: {
description: strings.PropertyPaneDescription
},
groups: [
{
groupName: strings.BasicGroupName,
groupFields: [
PropertyPaneTextField("description", {
label: strings.DescriptionFieldLabel
})
]
}
]
}
]
};
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment