Introduce a "pinned" tile shape

All components which don't understand this shape will fall through to their normal states, as they would for no explicit tile shape.

src/components/views/audio_messages/RecordingPlayback.tsx

@@ -54,7 +54,9 @@ export default class RecordingPlayback extends React.PureComponent<IProps, IStat
     }
 
     private get isWaveformable(): boolean {
-        return this.props.tileShape !== TileShape.Notif && this.props.tileShape !== TileShape.FileGrid;
+        return this.props.tileShape !== TileShape.Notif
+            && this.props.tileShape !== TileShape.FileGrid
+            && this.props.tileShape !== TileShape.Pinned;
     }
 
     private onPlaybackUpdate = (ev: PlaybackState) => {

src/components/views/rooms/EventTile.tsx

@@ -194,6 +194,7 @@ export enum TileShape {
     FileGrid = "file_grid",
     Reply = "reply",
     ReplyPreview = "reply_preview",
+    Pinned = "pinned",
 }
 
 interface IProps {

src/components/views/rooms/PinnedEventTile.tsx

@@ -29,6 +29,7 @@ import { replaceableComponent } from "../../../utils/replaceableComponent";
 import MatrixClientContext from "../../../contexts/MatrixClientContext";
 import { getUserNameColorClass } from "../../../utils/FormattingUtils";
 import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
+import { TileShape } from "./EventTile";
 
 interface IProps {
     room: Room;
@@ -87,6 +88,7 @@ export default class PinnedEventTile extends React.Component<IProps> {
                     className="mx_PinnedEventTile_body"
                     maxImageHeight={150}
                     onHeightChanged={() => {}} // we need to give this, apparently
+                    tileShape={TileShape.Pinned}
                 />
             </div>