diff --git a/web-app/admin/src/app/app.module.ts b/web-app/admin/src/app/app.module.ts
index eed34773c..5a0fac3eb 100644
--- a/web-app/admin/src/app/app.module.ts
+++ b/web-app/admin/src/app/app.module.ts
@@ -58,8 +58,6 @@ import { ExportDialogComponent } from "./export/export-dialog.component";
 
 import { MapClipComponent } from './map/clip/clip.component';
 import { GeometryModule } from './geometry/geometry.module';
-import { ObservationDeleteComponent } from './observation/observation-delete/observation-delete.component';
-import { ObservationListItemComponent } from './observation/observation-list/observation-list-item.component';
 import { MomentModule } from './moment/moment.module';
 import { BootstrapComponent } from './bootstrap/bootstrap.component';
 import { AttachmentComponent } from './observation/attachment/attachment.component';
@@ -67,7 +65,6 @@ import { FilenamePipe } from './filename/filename.pipe';
 import { AttachUploadComponent } from './observation/attachment/attachment-upload/attachment-upload.component';
 import { UserAvatarComponent } from './user/user-avatar/user-avatar.component';
 import { TokenInterceptorService } from './http/token-interceptor.service';
-import { ObservationListComponent } from './observation/observation-list/observation-list.component';
 import { FeedListComponent } from './feed/feed-list/feed-list.component';
 
 import {
@@ -155,9 +152,7 @@ import { AdminMapComponent } from './admin/admin-map/admin-map.component';
     FeedItemComponent,
     FeedListComponent,
     FeedPanelTabComponent,
-    ObservationListItemComponent,
     ObservationEditComponent,
-    ObservationDeleteComponent,
     ObservationEditAttachmentComponent,
     ObservationEditFormComponent,
     ObservationEditFormPickerComponent,
@@ -173,7 +168,6 @@ import { AdminMapComponent } from './admin/admin-map/admin-map.component';
     ObservationEditGeometryMapComponent,
     ObservationEditGeometryFormComponent,
     ObservationEditDateComponent,
-    ObservationListComponent,
     MapClipComponent,
     BootstrapComponent,
     AttachmentComponent,
diff --git a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.html b/web-app/admin/src/app/observation/observation-delete/observation-delete.component.html
deleted file mode 100644
index dcf5cb5cb..000000000
--- a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.html
+++ /dev/null
@@ -1,13 +0,0 @@
-<div mat-dialog-title>Delete Observation</div>
-<div mat-dialog-content>
-  <p>Are you sure you would like to delete the following observation?</p>
-
-  <div class="observation">
-    <observation-list-item [observation]="observation" [form]="event.forms[0]" [event]="event"></observation-list-item>
-    <div class="delete-mask"></div>
-  </div>
-</div>
-<div mat-dialog-actions>
-  <button mat-button (click)="close()">Cancel</button>
-  <button mat-flat-button color="warn" (click)="delete()">Delete</button>
-</div>
\ No newline at end of file
diff --git a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.scss b/web-app/admin/src/app/observation/observation-delete/observation-delete.component.scss
deleted file mode 100644
index 06b3e8471..000000000
--- a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-@use '@angular/material' as mat;
-@import "variables.scss";
-
-.mat-dialog-title {
-  color: mat.get-color-from-palette($app-primary);
-}
-
-.observation {
-  position: relative;
-  margin: 16px 0;
-}
-
-.delete-mask {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  left: 0;
-  background-color: rgba(0, 0, 0, 0.05);
-}
-
-:host ::ng-deep.mat-dialog-actions {
-  display: flex;
-  justify-content: flex-end;
-}
\ No newline at end of file
diff --git a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.spec.ts b/web-app/admin/src/app/observation/observation-delete/observation-delete.component.spec.ts
deleted file mode 100644
index 05913ecd5..000000000
--- a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.spec.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { MatDialogModule, MatDialogRef } from '@angular/material/dialog';
-
-import { ObservationDeleteComponent } from './observation-delete.component';
-
-/* TODO tests MUST contain at least 1 test
-describe('ObservationDeleteComponent', () => {
-  let component: ObservationDeleteComponent;
-  let fixture: ComponentFixture<ObservationDeleteComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [MatDialogModule],
-      declarations: [ObservationDeleteComponent],
-      providers: [{ provide: MatDialogRef, useValue: {} }]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ObservationDeleteComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  // it('should create', () => {
-  //   expect(component).toBeTruthy();
-  // });
-});
-*/
diff --git a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.ts b/web-app/admin/src/app/observation/observation-delete/observation-delete.component.ts
deleted file mode 100644
index 741bda155..000000000
--- a/web-app/admin/src/app/observation/observation-delete/observation-delete.component.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import { Component, Inject } from '@angular/core'
-import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
-import { EventService } from '../../../app/upgrade/ajs-upgraded-providers'
-
-export interface Observation {
-  id: string;
-  eventId: number;
-}
-
-@Component({
-  selector: 'observation-delete',
-  templateUrl: './observation-delete.component.html',
-  styleUrls: ['./observation-delete.component.scss']
-})
-export class ObservationDeleteComponent {
-  event: any
-
-  constructor(
-    public dialogRef: MatDialogRef<ObservationDeleteComponent>,
-    @Inject(EventService) private eventService: any,
-    @Inject(MAT_DIALOG_DATA) public observation: Observation) { 
-      this.event = eventService.getEventById(observation.eventId);
-  }
-
-  close(): void {
-    this.dialogRef.close('cancel');
-  }
-
-  delete(): void {
-    this.eventService.archiveObservation(this.observation).then(() => {
-      this.dialogRef.close('delete');
-    })
-  }
-
-}
\ No newline at end of file
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.html b/web-app/admin/src/app/observation/observation-list/observation-list-item.component.html
deleted file mode 100644
index 41769bc89..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.html
+++ /dev/null
@@ -1,109 +0,0 @@
-<mat-card matRipple [matRippleTrigger]="ripple">
-  <div class="item" (click)="viewObservation()" (mousedown)="onRipple()">
-    <div *ngIf="observation?.important" class="item-important">
-      <mat-icon class="item-important--icon">flag</mat-icon>
-      <div>
-        <div>
-          <span class="item-important--overline">Flagged By {{observation?.important?.user?.displayName}}</span>
-        </div>
-        <div class="item-important--description">
-          {{observation?.important?.description}}
-        </div>
-      </div>
-    </div>
-
-    <div class="item-header">
-      <div class="item-header-content">
-        <div class="item-overline">
-          <div>
-            <span>{{observation?.user?.displayName}}</span>
-            <span>·</span>
-            <span>{{observation?.properties?.timestamp | moment}}</span>
-          </div>
-        </div>
-
-        <div *ngIf="primaryFeedField.value">
-          <div class="item-header-text">
-            <span [ngSwitch]="primaryFeedField.field?.type">
-              <span *ngSwitchCase="'geometry'">
-                {{primaryFeedField?.value | geometry:5}}
-              </span>
-              <span *ngSwitchDefault>
-                {{primaryFeedField?.value}}
-              </span>
-            </span>
-          </div>
-        </div>
-
-        <div *ngIf="secondaryFeedField.value">
-          <div class="item-subhead">
-            <span [ngSwitch]="secondaryFeedField.field?.type">
-              <span *ngSwitchCase="'geometry'">
-                {{secondaryFeedField?.value | geometry:5}}
-              </span>
-              <span *ngSwitchDefault>
-                {{secondaryFeedField?.value}}
-              </span>
-            </span>
-          </div>
-        </div>
-      </div>
-
-      <div class="item-thumbnail">
-        <img [src]="observation?.style?.iconUrl" />
-      </div>
-    </div>
-
-    <div *ngIf="attachments?.length && attachments[0]?.url" class="item-media" matCardImage>
-      <observation-attachment [attachment]="attachments[0]" [label]="attachments.length > 1 ? '1 of ' + attachments.length : false"></observation-attachment>
-    </div>
-  </div>
-
-  <mat-card-footer>
-    <div *ngIf="importantEditor.open" class="important" @important>
-      <mat-form-field appearance="outline" class="important__text">
-        <mat-label>Important Description</mat-label>
-        <textarea matInput [(ngModel)]="importantEditor.description"></textarea>
-      </mat-form-field>
-      <div class="important__actions">
-        <button mat-button color="primary"
-          (click)="clearImportant()">{{observation?.important ? 'Remove' : 'Cancel'}}</button>
-        <button mat-flat-button color="primary" (click)="markAsImportant()"
-          class="important__actions--confirm">{{observation?.important ? 'Update' : 'Flag As Important'}}</button>
-      </div>
-    </div>
-
-    <div class="actions">
-      <div class="action-buttons">
-        <button mat-button color="primary" (click)="onObservationLocationClick()" class="actions__location-button">
-          <mat-icon class="actions__location-icon">my_location</mat-icon> {{observation?.geometry | geometry:5}}
-        </button>
-      </div>
-
-      <div class="actions-icons">
-        <div *ngIf="canEditImportant">
-          <button mat-icon-button (click)="onFlagAsImportant()" class="actions--inactive"
-            [ngClass]="{'actions__important--active': observation.important}" matTooltip="Flag As Important"
-            matTooltipPosition="above">
-            <mat-icon>{{observation.important ? 'flag' : 'outlined_flag'}}</mat-icon>
-          </button>
-        </div>
-
-        <div class="actions__favorite">
-          <button mat-icon-button (click)="toggleFavorite()" class="actions--inactive"
-            [ngClass]="{'actions__favorite--active': isUserFavorite}" matTooltip="Add To Favorites"
-            matTooltipPosition="above">
-            <mat-icon>{{isUserFavorite ? 'favorite' : 'favorite_border'}}</mat-icon>
-          </button>
-          <span *ngIf="favorites" class="actions__favorite-label">{{favorites}}</span>
-        </div>
-
-        <a mat-icon-button [href]="downloadUrl()" class="actions--inactive" matTooltip="Download" matTooltipPosition="above">
-          <mat-icon>save_alt</mat-icon>
-        </a>
-      </div>
-    </div>
-  </mat-card-footer>
-
-  <div #ripple></div>
-</mat-card>
\ No newline at end of file
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.scss b/web-app/admin/src/app/observation/observation-list/observation-list-item.component.scss
deleted file mode 100644
index e42198426..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.scss
+++ /dev/null
@@ -1,195 +0,0 @@
-.item {
-  cursor: pointer;
-}
-
-.item-header {
-  display: flex;
-  flex-direction: row;
-  padding-bottom: 16px;
-}
-
-.item-header-text {
-  font-size: 24px;
-  color: rgba(30, 136, 229, 0.87);
-  font-weight: 500;
-  margin-top: 16px;
-  margin-bottom: 2px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.item-header-content {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  min-width: 0;
-}
-
-.item-overline {
-  color: rgba(0, 0, 0, 0.6);
-  font-family: Roboto, sans-serif;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  font-size: 11px;
-  font-weight: 500;
-  letter-spacing: .16667em;
-  text-decoration: none;
-  text-transform: uppercase;
-}
-
-.item-thumbnail {
-  width: 72px;
-  margin-bottom: auto;
-  text-align: center;
-}
-
-.item-thumbnail img {
-  max-width: 40px;
-}
-
-.item-subhead {
-  margin-top: 4px;
-  color: rgba(0, 0, 0, 0.6);
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-}
-
-.item-media {
-  height: 194px;
-  position: relative;
-  box-sizing: border-box;
-  background-repeat: no-repeat;
-  background-position: center;
-  background-size: cover;
-}
-
-.item-media img {
-  height: 194px;
-}
-
-.item-media-double img {
-  height: 194px;
-  width: 194px;
-}
-
-.item-important {
-  margin: -16px -16px 16px -16px;
-  padding: 8px 0;
-  display: flex;
-  background: #FF9103;
-}
-
-.item-important--icon {
-  margin: 0 16px;
-  align-self: center;
-  font-size: 32px;
-  color: rgba(0, 0, 0, .87);
-}
-
-.item-important--overline {
-  color: rgba(0, 0, 0, .6);
-  font-family: Roboto, sans-serif;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  font-size: 11px;
-  font-weight: 500;
-  letter-spacing: .16667em;
-  text-decoration: none;
-  text-transform: uppercase;
-}
-
-.item-important--description {
-  margin-top: 8px;
-  color: rgba(0, 0, 0, .87);
-}
-
-.important {
-  padding: 16px;
-}
-
-.important__text {
-  width: 100%;
-}
-
-.important__actions {
-  display: flex;
-  justify-content: flex-end;
-}
-
-.important__actions--confirm {
-  margin-left: 8px;
-}
-
-.actions {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  box-sizing: border-box;
-  min-height: 52px;
-  padding: 8px;
-}
-
-.actions-buttons {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  box-sizing: border-box;
-}
-
-.actions-icons {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  box-sizing: border-box;
-  color: rgba(0, 0, 0, 0.6);
-  flex-grow: 1;
-  justify-content: flex-end;
-}
-
-.actions-icons > * + * {
-  margin-left: 8px;
-}
-
-.actions__location-button {
-  padding: 4px;
-}
-
-.actions__location-icon {
-  font-size: 18px;
-  height: 18px;
-  width: 18px;
-  margin-right: 4px;
-  margin-top: -2px;
-}
-
-.actions--inactive {
-  color: rgba(0, 0, 0, .6);
-}
-
-.actions--inactive:focus {
-  outline: none;
-}
-
-.actions__important--active {
-  color: #FF9105;
-}
-
-.actions__favorite {
-  display: flex;
-  align-items: center;
-}
-
-.actions__favorite:hover {
-  color: #7ED321;
-}
-
-.actions__favorite--active {
-  color: #7ED321;
-}
-
-.actions__favorite-label {
-  font-size: 12px;
-  margin-left: -4px;
-}
\ No newline at end of file
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.spec.ts b/web-app/admin/src/app/observation/observation-list/observation-list-item.component.spec.ts
deleted file mode 100644
index e67f6007e..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.spec.ts
+++ /dev/null
@@ -1,169 +0,0 @@
-import { Component, ViewChild } from '@angular/core';
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { GeometryPipe } from '../../../app/geometry/geometry.pipe';
-import { MomentPipe } from '../../../app/moment/moment.pipe';
-import { EventService, LocalStorageService, MapService, UserService } from '../../../app/upgrade/ajs-upgraded-providers';
-
-import { ObservationListItemComponent } from './observation-list-item.component';
-
-class MockMapService {}
-
-class MockUserService {
-  myself = {
-    id: 1,
-    role: {
-      permissions: []
-    }
-  }
-
-  hasPermission(): boolean {
-    return true
-  }
-}
-
-class MockEventService {
-  getFormsForEvent(): any {
-    return [{
-      id: 1,
-      name: "Test",
-      description: "Mock Form",
-      fields: [{
-        name: "field1",
-        id: 1,
-        required: false,
-        type: "attachment",
-        title: "Media",
-        allowedAttachmentTypes: [
-          "image",
-          "video",
-          "audio"
-        ],
-        choices: []
-      }],
-      userFields: [],
-      archived: false,
-      default: false
-    }]
-  }
-  createForm(): any {
-    return {
-      id: 1,
-      remoteId: "mockRemoteFormId",
-      fields: [{
-        name: 'field1'
-      }]
-    }
-  }
-}
-
-class MockLocalStorageService {
-  getToken(): string {
-    return 'mockToken'
-  }
-  getTimeFormat(): string {
-    return 'absolute'
-  }
-  getTimeZoneView(): string {
-    return 'local'
-  }
-  getCoordinateSystemView(): string {
-    return 'wgs84'
-  }
-}
-
-@Component({
-  selector: `host-component`,
-  template: `<observation-list-item [observation]="observation" [event]="event"></observation-list-item>`
-})
-class TestHostComponent {
-  event: any = {
-    acl: {}
-  }
-
-  observation: any
-
-  @ViewChild(ObservationListItemComponent) observationListItem: ObservationListItemComponent;
-}
-
-describe('ObservationListItemComponent', () => {
-  let component: ObservationListItemComponent;
-  let hostComponent: TestHostComponent;
-  let fixture: ComponentFixture<TestHostComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [ObservationListItemComponent, MomentPipe, GeometryPipe, TestHostComponent ],
-      imports: [ NoopAnimationsModule ],
-      providers: [{
-        provide: MapService, useClass: MockMapService
-      },{
-        provide: UserService, useClass: MockUserService
-      },{
-        provide: EventService, useClass: MockEventService
-      },{
-        provide: LocalStorageService, useClass: MockLocalStorageService
-      }]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(TestHostComponent);
-    hostComponent = fixture.componentInstance;
-    fixture.detectChanges();
-    component = hostComponent.observationListItem;
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('should include attachments', () => {
-    hostComponent.observation = {
-      style: {},
-      favoriteUserIds: [],
-      properties: {
-        forms: [{
-          id: "mockRemoteFormId",
-          field2: "",
-          field1: "None",
-          field0: "Protest",
-          formId: 1
-        }],
-        timestamp: "2022-04-01T21:44:28.848Z"
-      },
-      attachments: [{
-        observationFormId: "mockRemoteFormId",
-        fieldName: "field1",
-        name: "attachment.png",
-        contentType: "image/png"
-      }]
-    }
-
-    fixture.detectChanges()
-
-    expect(component.attachments.length).toBe(1)
-  });
-
-  it('should filter attachments', () => {
-    hostComponent.observation = {
-      style: {},
-      favoriteUserIds: [],
-      properties: {
-        forms: [],
-        timestamp: "2022-04-01T21:44:28.848Z"
-      },
-      attachments: [{
-        observationFormId: "mockRemoteFormId",
-        fieldName: "field1",
-        name: "attachment.png",
-        contentType: "image/png"
-      }]
-    }
-
-    fixture.detectChanges()
-
-    expect(component.attachments.length).toBe(0)
-  });
-});
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.ts b/web-app/admin/src/app/observation/observation-list/observation-list-item.component.ts
deleted file mode 100644
index e0e12a9bc..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list-item.component.ts
+++ /dev/null
@@ -1,197 +0,0 @@
-import { Component, Inject, Input, OnChanges, SimpleChanges, ViewChild } from '@angular/core'
-import { EventService, LocalStorageService, MapService, UserService } from '../../../app/upgrade/ajs-upgraded-providers'
-import * as moment from 'moment'
-import { MatRipple } from '@angular/material/core';
-import { animate, style, transition, trigger } from '@angular/animations'
-import { FeedPanelService } from '../../../app/feed-panel/feed-panel.service'
-
-@Component({
-  selector: 'observation-list-item',
-  templateUrl: './observation-list-item.component.html',
-  styleUrls: ['./observation-list-item.component.scss'],
-  animations: [
-    trigger('important', [
-      transition(':enter', [
-        style({ height: 0, opacity: 0 }),
-        animate('250ms', style({ height: '*', opacity: 1 })),
-      ]),
-      transition(':leave', [
-        animate('250ms', style({ height: 0, opacity: 0 }))
-      ])
-    ])
-  ]
-})
-export class ObservationListItemComponent implements OnChanges {
-  @Input() event: any
-  @Input() form: any
-  @Input() observation: any
-
-  @ViewChild(MatRipple) ripple: MatRipple
-
-  edit = false
-  canEdit = false
-  canEditImportant = false
- 
-  favorites = 0
-  isUserFavorite = false
-
-  importantEditor: {
-    open: boolean,
-    description?: string
-  } = { open: false}
-
-  // TODO: define some types for these
-  observationForm: any
-  primaryFeedField: any = {}
-  secondaryFeedField: any = {}
-
-  attachments = []
-
-  constructor(
-    @Inject(MapService) private mapService: any,
-    @Inject(UserService) private userService: any,
-    @Inject(EventService) private eventService: any,
-    @Inject(LocalStorageService) private localStorageService: any,
-    private feedPanelService: FeedPanelService) {
-
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes.event?.currentValue || changes.form?.currentValue || changes.observation?.currentValue) {
-      this.updateItem()
-    }
-
-    if (changes.observation?.currentValue) {
-      this.updateFavorites()
-      this.importantEditor.description = this.observation.important ? this.observation.important.description : null
-    }
-  }
-
-  toggleFavorite(): void {
-    if (this.isUserFavorite) {
-      this.eventService.removeObservationFavorite(this.observation).then(observation => {
-        this.observation.favoriteUserIds = observation.favoriteUserIds
-        this.isUserFavorite = false
-        this.updateFavorites()
-      })
-    } else {
-      this.eventService.addObservationFavorite(this.observation).then(observation => {
-        this.observation.favoriteUserIds = observation.favoriteUserIds
-        this.isUserFavorite = true
-        this.updateFavorites()
-      })
-    }
-  }
-
-  onFlagAsImportant(): void {
-    this.importantEditor.open = true
-  }
-
-  markAsImportant(): void {
-    this.eventService.markObservationAsImportant(this.observation, { description: this.importantEditor.description }).then(() => {
-      this.importantEditor.open = false
-    })
-  }
-
-  clearImportant(): void {
-    this.eventService.clearObservationAsImportant(this.observation).then(() => {
-      this.importantEditor.open = false
-      delete this.importantEditor.description
-    })
-  }
-
-  downloadUrl(): string {
-    return `/api/events/${this.observation?.eventId}/observations/${this.observation?.id}.zip?access_token=${this.localStorageService.getToken()}`
-  }
-
-  onRipple(): void {
-    this.ripple.launch({
-      centered: true
-    })
-  }
-
-  viewObservation(): void {
-    this.onObservationLocationClick()
-    this.feedPanelService.viewObservation(this.observation)
-  }
-
-  onObservationLocationClick(): void {
-    this.mapService.zoomToFeatureInLayer(this.observation, 'observations')
-  }
-
-  updateItem(): void {
-    if (!this.observation || !this.event) return
-
-    this.isUserFavorite = this.observation.favoriteUserIds && this.observation.favoriteUserIds.includes(this.userService.myself.id)
-    this.canEdit = this.userService.hasPermission('UPDATE_OBSERVATION_EVENT') || this.userService.hasPermission('UPDATE_OBSERVATION_ALL')
-
-    const myAccess = this.event.acl[this.userService.myself.id] || {}
-    const aclPermissions = myAccess.permissions || []
-    this.canEditImportant = this.userService.myself.role.permissions.includes('UPDATE_EVENT') || aclPermissions.includes('update')
-
-    const formMap = this.eventService.getFormsForEvent(this.event).reduce((map, form) => {
-      map[form.id] = form
-      return map
-    }, {})
-
-    this.observationForm = {
-      geometryField: {
-        title: 'Location',
-        type: 'geometry',
-        value: this.observation.geometry
-      },
-      timestampField: {
-        title: '',
-        type: 'date',
-        value: moment(this.observation.properties.timestamp).toDate()
-      },
-      forms: []
-    }
-
-    this.observation.properties.forms.forEach(propertyForm => {
-      const observationForm = this.eventService.createForm(propertyForm, formMap[propertyForm.formId])
-      this.observationForm.forms.push(observationForm)
-    })
-
-    this.primaryFeedField = {}
-    this.secondaryFeedField = {}
-
-    if (this.observation.properties.forms.length > 0) {
-      const firstForm = this.observation.properties.forms[0]
-      const observationForm = this.observationForm.forms.find(observationForm => {
-        return observationForm.id === firstForm.formId
-      })
-
-      if (observationForm.primaryFeedField && firstForm[observationForm.primaryFeedField]) {
-        const field = observationForm.fields.find(field => field.name === observationForm.primaryFeedField)
-        this.primaryFeedField = {
-          field: field,
-          value: firstForm[observationForm.primaryFeedField]
-        }
-      }
-
-      if (observationForm.secondaryFeedField && firstForm[observationForm.secondaryFeedField]) {
-        const field = observationForm.fields.find(field => field.name === observationForm.secondaryFeedField)
-        this.secondaryFeedField = {
-          field: field,
-          value: firstForm[observationForm.secondaryFeedField]
-        }
-      }
-    }
-
-    this.isUserFavorite = this.observation.favoriteUserIds.includes(this.userService.myself.id)
-
-    this.attachments = this.observation.attachments.filter(attachment => {
-      return this.observationForm.forms.find(observationForm => {
-        return observationForm.fields.find(field => {
-          return attachment.observationFormId === observationForm.remoteId && attachment.fieldName === field.name
-        })
-      }) != null
-    })
-
-  }
-
-  updateFavorites(): void {
-    this.favorites = this.observation.favoriteUserIds.length
-  }
-}
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list.component.html b/web-app/admin/src/app/observation/observation-list/observation-list.component.html
deleted file mode 100644
index 31a130534..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list.component.html
+++ /dev/null
@@ -1,93 +0,0 @@
-<div class="observation-feed">
-  <mat-toolbar class="observation-feed-toolbar">
-    <span>Observations</span>
-  </mat-toolbar>
-
-  <div class="actions">
-    <mat-chip-list selectable="true">
-      <mat-chip color="primary" [selected]="filter === 'all'" (click)="filterChanged('all')">All</mat-chip>
-      <mat-chip color="primary" [selected]="filter === 'favorite'" (click)="filterChanged('favorite')">Favorites</mat-chip>
-      <mat-chip color="primary" [selected]="filter === 'important'" (click)="filterChanged('important')">Important</mat-chip>
-      <mat-chip color="primary" [selected]="filter === 'attachments'" (click)="filterChanged('attachments')">Attachments</mat-chip>
-    </mat-chip-list>
-  </div>
-
-  <div class="feed-pages">
-    <mat-form-field class="feed-pages__select" appearance="outline">
-      <mat-label>Observation Page</mat-label>
-      <mat-select [(ngModel)]="currentObservationPage">
-        <mat-option *ngFor="let observationPage of observationPages; index as i; trackBy: trackByPageId" [value]="i">
-          {{observationPage[0].properties.timestamp | moment: 'fromNow'}}
-        </mat-option>
-      </mat-select>
-    </mat-form-field>
-  </div>
-
-  <div class="page-container">
-    <div *ngIf="loaded; else mask">
-      <ng-container *ngFor="let observation of observationPages[currentObservationPage]; trackBy: trackByObservationId">
-        <div class="feed-observation">
-          <observation-list-item [observation]="observation" [event]="event" [form]=[event.form]></observation-list-item>
-        </div>
-      </ng-container>
-    </div>
-  </div>
-</div>
-
-<ng-template #mask>
-  <div *ngFor="let i of [].constructor(20); trackBy: trackByPageId">
-    <mat-card class="feed-observation loading">
-      <div class="item-header">
-        <div class="item-header-content">
-          <div class="item-overline">
-            <div>
-              <span>Display Name</span>
-              <span>·</span>
-              <span>JUL 11 2012 10:00 AM</span>
-            </div>
-          </div>
-
-          <div class="item-header-text">
-            Primary Value
-          </div>
-
-          <div class="item-subhead">
-            Secondary Value
-          </div>
-        </div>
-
-        <div>
-          <mat-icon class="item-thumbnail">place</mat-icon>
-        </div>
-      </div>
-      <mat-card-footer>
-        <div class="actions">
-          <div class="action-buttons">
-            <button mat-button disabled class="actions__location-button">
-              <mat-icon class="actions__location-icon">my_location</mat-icon> <span
-                class="actions__location-text">0.000000, 0.000000</span>
-            </button>
-          </div>
-
-          <div class="actions-icons">
-            <div>
-              <button mat-icon-button disabled>
-                <mat-icon>flag</mat-icon>
-              </button>
-            </div>
-
-            <div class="actions__favorite">
-              <button mat-icon-button disabled>
-                <mat-icon>favorite</mat-icon>
-              </button>
-            </div>
-
-            <button mat-icon-button disabled>
-              <mat-icon>save_alt</mat-icon>
-            </button>
-          </div>
-        </div>
-      </mat-card-footer>
-    </mat-card>
-  </div>
-</ng-template>
\ No newline at end of file
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list.component.scss b/web-app/admin/src/app/observation/observation-list/observation-list.component.scss
deleted file mode 100644
index bf145ae65..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list.component.scss
+++ /dev/null
@@ -1,172 +0,0 @@
-@use '@angular/material' as mat;
-@import "variables.scss";
-
-.observation-feed {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  background: white;
-}
-
-.observation-feed-toolbar {
-  color: mat.get-color-from-palette($app-primary);
-  background-color: white;
-}
-
-.actions {
-  padding: 8px;
-}
-
-.feed-pages {
-  margin: 0 8px 8px;
-}
-
-.feed-pages__select {
-  width: 100%;
-}
-
-:host ::ng-deep.mat-form-field-wrapper {
-  padding-bottom: unset;
-}
-
-:host ::ng-deep.mat-card-image { 
-  margin-bottom: 0;
-}
-
-.page-container {
-  background: #E1E2E1;
-  padding: 8px 0;
-  flex: 1 1 auto;
-  overflow-y: auto;
-}
-
-.feed-observation {
-  margin: 0 8px 8px;
-}
-
-.item-card {
-  margin: 0 8px 8px;
-}
-
-.item-header {
-  display: flex;
-  flex-direction: row;
-  padding-bottom: 16px;
-}
-
-.item-header-text {
-  font-size: 24px;
-  font-weight: 500;
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  margin-top: 16px;
-  margin-bottom: 2px;
-}
-
-.item-header-content {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  min-width: 0;
-  margin-right: 16px;
-}
-
-.item-overline {
-  font-family: Roboto, sans-serif;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  font-size: 11px;
-  font-weight: 500;
-  letter-spacing: .16667em;
-  text-decoration: none;
-  text-transform: uppercase;
-}
-
-.item-thumbnail {
-  width: 72px;
-  height: 72px;
-  font-size: 72px;
-  text-align: center;
-  color: rgba(0, 0, 0, 0.20);
-}
-
-.item-header-text,
-.item-overline,
-.item-subhead,
-.item-time {
-  color: #E1E2E1;
-  background-color: #E1E2E1;
-  margin-bottom: 8px;
-}
-
-.actions {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  box-sizing: border-box;
-  min-height: 52px;
-  padding: 8px;
-}
-
-.actions-buttons {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  box-sizing: border-box;
-}
-
-.actions-icons {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  box-sizing: border-box;
-  color: rgba(0, 0, 0, 0.2);
-  flex-grow: 1;
-  justify-content: flex-end;
-}
-
-.actions-icons > * + * {
-  margin-left: 8px;
-}
-
-.actions__location-button {
-  padding: 4px;
-}
-
-.actions__location-icon {
-  font-size: 18px;
-  height: 18px;
-  width: 18px;
-  margin-right: 4px;
-  margin-top: -2px;
-}
-
-.actions__location-text {
-  color: #E1E2E1;
-  background-color: #E1E2E1;
-}
-
-.loading {
-  position: relative;
-  overflow: hidden;
-}
-
-.loading::after {
-  display: block;
-  content: '';
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  transform: translateX(-100%);
-  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent);
-  animation: loading 1.5s infinite;
-}
-
-@keyframes loading {
-  100% {
-    transform: translateX(100%);
-  }
-}
\ No newline at end of file
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list.component.spec.ts b/web-app/admin/src/app/observation/observation-list/observation-list.component.spec.ts
deleted file mode 100644
index a5f10e5cc..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list.component.spec.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-
-import { ObservationListComponent } from './observation-list.component';
-
-/* TODO test MUST contain at least 1 test
-describe('ObservationListComponent', () => {
-  let component: ObservationListComponent;
-  let fixture: ComponentFixture<ObservationListComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [ObservationListComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ObservationListComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  // it('should create', () => {
-  //   expect(component).toBeTruthy();
-  // });
-});
-*/
diff --git a/web-app/admin/src/app/observation/observation-list/observation-list.component.ts b/web-app/admin/src/app/observation/observation-list/observation-list.component.ts
deleted file mode 100644
index 7f2310a7b..000000000
--- a/web-app/admin/src/app/observation/observation-list/observation-list.component.ts
+++ /dev/null
@@ -1,103 +0,0 @@
-import { Component, Inject, OnDestroy, OnInit } from '@angular/core';
-import { EventService, FilterService } from '../../../app/upgrade/ajs-upgraded-providers';
-import * as moment from 'moment';
-
-@Component({
-  selector: 'observation-list',
-  templateUrl: './observation-list.component.html',
-  styleUrls: ['./observation-list.component.scss']
-})
-export class ObservationListComponent implements OnInit, OnDestroy {
-  loaded = false
-
-  event: any
-
-  observationsById = {}
-
-  currentObservationPage = 0
-  observationPages = []
-  observationsPerPage = 50
-
-  filter = 'all'
-
-  filterChangedListener: any
-
-  constructor(
-    @Inject(EventService) private eventService: any,
-    @Inject(FilterService) private filterService: any) {
-  }
-
-  ngOnInit(): void {
-    this.event = this.filterService.getEvent()
-    this.eventService.addObservationsChangedListener(this)
-    this.filterService.addListener(this)
-  }
-
-  ngOnDestroy(): void {
-    this.filterService.removeListener(this)
-    this.eventService.removeObservationsChangedListener(this)
-  }
-
-  trackByPageId(index: number, page: any): any {
-    return index
-  }
-
-  trackByObservationId(index: number, observation: any): any {
-    return observation.id
-  }
-
-  onFilterChanged(): void {
-    this.currentObservationPage = 0
-  }
-
-  filterChanged(filter): void {
-    this.filter = filter;
-    this.filterService.setFilter({ actionFilter: filter });
-  }
-
-  onObservationsChanged(changed): void {
-    this.loaded = true
-
-    this.event = this.filterService.getEvent()
-
-    const { added = [], updated = [], removed = [] } = changed
-    added.forEach(observation => {
-      this.observationsById[observation.id] = observation
-    })
-
-    updated.forEach(observation => {
-      this.observationsById[observation.id] = observation
-    })
-
-    removed.forEach(observation => {
-      delete this.observationsById[observation.id]
-    })
-
-    this.calculateObservationPages(Object.values(this.observationsById))
-  }
-
-  calculateObservationPages(observations: any[]): void {
-    if (!observations) return;
-
-    // Sort the observations
-    observations.sort((a, b) => {
-      return moment(b.properties.timestamp).valueOf() - moment(a.properties.timestamp).valueOf()
-    })
-
-    // Slice into pages
-    const pages = []
-    for (let i = 0, j = observations.length; i < j; i += this.observationsPerPage) {
-      pages.push(observations.slice(i, i + this.observationsPerPage))
-    }
-
-    this.observationPages = pages
-
-    // If a new page showed up that wasn't there before, switch to it
-    if (this.currentObservationPage === -1 && pages.length) {
-      this.currentObservationPage = 0
-    }
-
-    // ensure the page that they were on did not go away
-    this.currentObservationPage = Math.min(this.currentObservationPage, pages.length - 1)
-  }
-}
diff --git a/web-app/admin/src/ng1/app.js b/web-app/admin/src/ng1/app.js
index bbc692998..f00d1a037 100644
--- a/web-app/admin/src/ng1/app.js
+++ b/web-app/admin/src/ng1/app.js
@@ -13,8 +13,6 @@ import { ExportService } from '../app/export/export.service'
 import { FeedPanelService } from '../app/feed-panel/feed-panel.service'
 import { PluginService } from '../app/plugin/plugin.service'
 
-import { ObservationListItemComponent } from '../app/observation/observation-list/observation-list-item.component';
-
 import { UserAvatarComponent } from '../app/user/user-avatar/user-avatar.component';
 import { UserReadService } from '@ngageoint/mage.web-core-lib/user';
 
@@ -58,7 +56,6 @@ app
 
 // Downgraded Angular components
 app
-  .directive('observationListItem', downgradeComponent({ component: ObservationListItemComponent }))
   .directive('userAvatar', downgradeComponent({ component: UserAvatarComponent }))
   .directive('feeds', downgradeComponent({ component: AdminFeedsComponent }))
   .directive('adminFeed', downgradeComponent({ component: AdminFeedComponent }))