From 360080ecff802ff35557f18a2e06b3df7a5dd5d9 Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Mon, 14 Jun 2021 03:14:25 -0400
Subject: [PATCH] relative dates

---
 vocodes/src/common/ApiConfig.ts                            | 4 ++++
 .../v2/moderation_ip_ban_list/ModerationIpBanListFc.tsx    | 7 ++++++-
 vocodes/src/v2/profile/Profile_TtsModelListFc.tsx          | 2 +-
 3 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/vocodes/src/common/ApiConfig.ts b/vocodes/src/common/ApiConfig.ts
index 83f9c8081f..d99067e05f 100644
--- a/vocodes/src/common/ApiConfig.ts
+++ b/vocodes/src/common/ApiConfig.ts
@@ -206,6 +206,10 @@ class ApiConfig {
     return `${this.getScheme()}://${this.getNewApiHost()}/moderation/ip_bans/add`;
   }
 
+  getModerationIpBan(ipAddress: string): string {
+    return `${this.getScheme()}://${this.getNewApiHost()}/moderation/ip_bans/${ipAddress}`;
+  }
+
   deleteModerationIpBan(ipAddress: string): string {
     return `${this.getScheme()}://${this.getNewApiHost()}/moderation/ip_bans/${ipAddress}/delete`;
   }
diff --git a/vocodes/src/v2/moderation_ip_ban_list/ModerationIpBanListFc.tsx b/vocodes/src/v2/moderation_ip_ban_list/ModerationIpBanListFc.tsx
index 67a376739f..f10271636c 100644
--- a/vocodes/src/v2/moderation_ip_ban_list/ModerationIpBanListFc.tsx
+++ b/vocodes/src/v2/moderation_ip_ban_list/ModerationIpBanListFc.tsx
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
 import { Link, useHistory } from 'react-router-dom';
 import { ApiConfig } from '../../common/ApiConfig';
 import { SessionWrapper } from '../../session/SessionWrapper';
+import { formatDistance } from 'date-fns';
 
 interface Props {
   sessionWrapper: SessionWrapper,
@@ -103,11 +104,15 @@ function ModerationIpBanListFc(props: Props) {
     return <h1>Unauthorized</h1>;
   }
 
+  const now = new Date();
   let rows : Array<JSX.Element> = [];
 
   ipBanList.forEach(ban => {
     const modUserLink = `/profile/${ban.mod_username}`;
 
+    const createTime = new Date(ban.created_at);
+    const relativeCreateTime = formatDistance(createTime, now, { addSuffix: true });
+
     rows.push(
       <tr key={ban.ip_address}>
         <td>{ban.ip_address}</td>
@@ -115,7 +120,7 @@ function ModerationIpBanListFc(props: Props) {
           <Link to={modUserLink}>{ban.mod_username}</Link>
         </td>
         <td>{ban.mod_notes}</td>
-        <td>{ban.created_at}</td>
+        <td>{relativeCreateTime}</td>
       </tr>
     )
   });
diff --git a/vocodes/src/v2/profile/Profile_TtsModelListFc.tsx b/vocodes/src/v2/profile/Profile_TtsModelListFc.tsx
index 25814871b2..437dc4eddb 100644
--- a/vocodes/src/v2/profile/Profile_TtsModelListFc.tsx
+++ b/vocodes/src/v2/profile/Profile_TtsModelListFc.tsx
@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { ApiConfig } from '../../common/ApiConfig';
-import { Link } from "react-router-dom";
+import { Link } from 'react-router-dom';
 import { formatDistance } from 'date-fns';
 
 interface TtsModelListResponsePayload {