diff --git a/src/plugins/navigation/components/NavigationInfoBox.js b/src/plugins/navigation/components/NavigationInfoBox.js
index 4e1001ceb..e739c8ac4 100644
--- a/src/plugins/navigation/components/NavigationInfoBox.js
+++ b/src/plugins/navigation/components/NavigationInfoBox.js
@@ -13,6 +13,7 @@ import {IconButton, FavoriteButton} from './';
 type Props = {|
   isBookmarked: boolean,
   uri: ?string,
+  className: ?string,
   onNavigate: (query: string) => void,
   onFavorite: (query: string) => void,
 |};
@@ -53,40 +54,50 @@ const NavigationInfoBoxContainer = styled('div')({
 });
 
 export default (props: Props) => {
-  const {uri, isBookmarked} = props;
-  if (uri == null) {
+  const {uri, isBookmarked, className} = props;
+  if (uri == null && className == null) {
     return (
       <NavigationInfoBoxContainer>
         <div className="nav-info-text">View has no URI information</div>
       </NavigationInfoBoxContainer>
     );
   } else {
-    const parameters = parseURIParameters(uri);
+    const parameters = uri != null ? parseURIParameters(uri) : null;
     return (
       <NavigationInfoBoxContainer>
-        <div className="icon-container">
-          <FavoriteButton
-            highlighted={isBookmarked}
-            size={16}
-            onClick={() => props.onFavorite(uri)}
-          />
-          <IconButton
-            icon="eye"
-            size={16}
-            onClick={() => props.onNavigate(uri)}
-          />
-        </div>
-        <div className="nav-info-text bold">uri:</div>
-        <div className="nav-info-text selectable">{uri}</div>
-        {parameters.size > 0 ? (
+        {uri != null ? (
           <>
-            <div className="nav-info-text bold">parameters:</div>
-            {Array.from(parameters, ([key, value]) => (
-              <div key={key} className="nav-info-text selectable">
-                {key}
-                {value ? `: ${value}` : ''}
-              </div>
-            ))}
+            <div className="icon-container">
+              <FavoriteButton
+                highlighted={isBookmarked}
+                size={16}
+                onClick={() => props.onFavorite(uri)}
+              />
+              <IconButton
+                icon="eye"
+                size={16}
+                onClick={() => props.onNavigate(uri)}
+              />
+            </div>
+            <div className="nav-info-text bold">uri:</div>
+            <div className="nav-info-text selectable">{uri}</div>
+            {parameters != null && parameters.size > 0 ? (
+              <>
+                <div className="nav-info-text bold">parameters:</div>
+                {Array.from(parameters, ([key, value]) => (
+                  <div key={key} className="nav-info-text selectable">
+                    {key}
+                    {value ? `: ${value}` : ''}
+                  </div>
+                ))}
+              </>
+            ) : null}
+          </>
+        ) : null}
+        {className != null ? (
+          <>
+            <div className="nav-info-text bold">Class Name:</div>
+            <div className="nav-info-text selectable">{className}</div>
           </>
         ) : null}
       </NavigationInfoBoxContainer>
diff --git a/src/plugins/navigation/components/Timeline.js b/src/plugins/navigation/components/Timeline.js
index 8db6fa54d..3191f6bd8 100644
--- a/src/plugins/navigation/components/Timeline.js
+++ b/src/plugins/navigation/components/Timeline.js
@@ -56,7 +56,7 @@ export default (props: Props) => {
       {events.map((event: NavigationEvent, idx) => {
         return (
           <NavigationEventContainer>
-            {event.uri != null ? (
+            {event.uri != null || event.className != null ? (
               <ScreenshotContainer>
                 {event.screenshot != null ? (
                   <img src={event.screenshot} />
@@ -72,6 +72,7 @@ export default (props: Props) => {
               isBookmarked={
                 event.uri != null ? bookmarks.has(event.uri) : false
               }
+              className={event.className}
               uri={event.uri}
               onNavigate={onNavigate}
               onFavorite={onFavorite}
diff --git a/src/plugins/navigation/flow-types.js b/src/plugins/navigation/flow-types.js
index 2a0816915..47f8418d3 100644
--- a/src/plugins/navigation/flow-types.js
+++ b/src/plugins/navigation/flow-types.js
@@ -27,6 +27,7 @@ export type PersistedState = {|
 export type NavigationEvent = {|
   date: ?Date,
   uri: ?URI,
+  className: ?string,
   screenshot: ?string,
 |};
 
diff --git a/src/plugins/navigation/index.js b/src/plugins/navigation/index.js
index 7fcb8e8bd..2ac75620f 100644
--- a/src/plugins/navigation/index.js
+++ b/src/plugins/navigation/index.js
@@ -75,14 +75,17 @@ export default class extends FlipperPlugin<State, {}, PersistedState> {
       let {persistedState} = this.props;
       const {setPersistedState} = this.props;
       const navigationEvent: NavigationEvent = {
-        uri: payload.uri === undefined ? null : payload.uri,
+        uri: payload.uri === undefined ? null : decodeURIComponent(payload.uri),
         date: payload.date || new Date(),
+        className: payload.class === undefined ? null : payload.class,
         screenshot: null,
       };
       setPersistedState({
         ...persistedState,
         currentURI:
-          payload.uri == null ? persistedState.currentURI : payload.uri,
+          payload.uri == null
+            ? persistedState.currentURI
+            : decodeURIComponent(payload.uri),
         navigationEvents: [navigationEvent, ...persistedState.navigationEvents],
       });
       // Wait for view to render and then take a screenshot