From 2943b9103409136281b3062903d51a6ab70009e4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= <git@mkljczk.pl>
Date: Mon, 11 Apr 2022 21:58:48 +0200
Subject: [PATCH] Typescript, convert some components to functional
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
---
 app/soapbox/actions/importer/index.js         | Bin 3827 -> 3828 bytes
 app/soapbox/actions/notifications.js          | Bin 10574 -> 10575 bytes
 app/soapbox/api.ts                            |   2 +-
 app/soapbox/{compare_id.js => compare_id.ts}  | Bin 228 -> 244 bytes
 app/soapbox/components/domain.js              | Bin 1198 -> 0 bytes
 app/soapbox/components/domain.tsx             |  51 ++++++++++++++
 app/soapbox/components/dropdown_menu.tsx      |   2 +-
 app/soapbox/components/status_content.js      | Bin 9050 -> 9051 bytes
 app/soapbox/containers/domain_container.js    | Bin 1428 -> 0 bytes
 .../account_timeline/components/moved_note.js | Bin 1498 -> 0 bytes
 .../components/moved_note.tsx                 |  34 +++++++++
 app/soapbox/features/audio/index.js           | Bin 15934 -> 15935 bytes
 app/soapbox/features/birthdays/account.js     | Bin 2476 -> 0 bytes
 app/soapbox/features/birthdays/account.tsx    |  64 +++++++++++++++++
 .../{date_picker.js => date_picker.ts}        | Bin
 app/soapbox/features/blocks/index.js          | Bin 2104 -> 0 bytes
 app/soapbox/features/blocks/index.tsx         |  58 +++++++++++++++
 app/soapbox/features/bookmarks/index.js       | Bin 2648 -> 0 bytes
 app/soapbox/features/bookmarks/index.tsx      |  56 +++++++++++++++
 .../features/chats/components/chat_list.js    | Bin 2824 -> 2816 bytes
 app/soapbox/features/domain_blocks/index.js   | Bin 2269 -> 0 bytes
 app/soapbox/features/domain_blocks/index.tsx  |  60 ++++++++++++++++
 .../features/emoji/emoji_compressed.js        | Bin 3431 -> 3432 bytes
 app/soapbox/features/mutes/index.js           | Bin 2089 -> 0 bytes
 app/soapbox/features/mutes/index.tsx          |  58 +++++++++++++++
 .../status/components/quoted_status.tsx       |   3 +-
 .../ui/components/profile_info_panel.js       | Bin 8657 -> 8658 bytes
 app/soapbox/features/video/index.js           | Bin 19780 -> 19783 bytes
 app/soapbox/reducers/auth.js                  | Bin 10388 -> 10389 bytes
 app/soapbox/reducers/conversations.js         | Bin 2846 -> 2847 bytes
 app/soapbox/stream.js                         | Bin 2532 -> 2533 bytes
 app/soapbox/utils/auth.js                     | Bin 1512 -> 0 bytes
 app/soapbox/utils/auth.ts                     |  66 ++++++++++++++++++
 app/soapbox/utils/{base64.js => base64.ts}    | Bin 247 -> 257 bytes
 app/soapbox/utils/greentext.js                | Bin 726 -> 727 bytes
 app/soapbox/utils/instance.js                 | Bin 220 -> 0 bytes
 ..._aspect_ratio.js => media_aspect_ratio.ts} | Bin 455 -> 485 bytes
 app/soapbox/utils/{phone.js => phone.ts}      | Bin
 app/soapbox/utils/{status.js => status.ts}    | Bin 677 -> 796 bytes
 app/soapbox/utils/timelines.js                | Bin 405 -> 0 bytes
 app/soapbox/utils/timelines.ts                |  15 ++++
 package.json                                  |   3 +-
 yarn.lock                                     |  14 +++-
 43 files changed, 480 insertions(+), 6 deletions(-)
 rename app/soapbox/{compare_id.js => compare_id.ts} (74%)
 delete mode 100644 app/soapbox/components/domain.js
 create mode 100644 app/soapbox/components/domain.tsx
 delete mode 100644 app/soapbox/containers/domain_container.js
 delete mode 100644 app/soapbox/features/account_timeline/components/moved_note.js
 create mode 100644 app/soapbox/features/account_timeline/components/moved_note.tsx
 delete mode 100644 app/soapbox/features/birthdays/account.js
 create mode 100644 app/soapbox/features/birthdays/account.tsx
 rename app/soapbox/features/birthdays/{date_picker.js => date_picker.ts} (100%)
 delete mode 100644 app/soapbox/features/blocks/index.js
 create mode 100644 app/soapbox/features/blocks/index.tsx
 delete mode 100644 app/soapbox/features/bookmarks/index.js
 create mode 100644 app/soapbox/features/bookmarks/index.tsx
 delete mode 100644 app/soapbox/features/domain_blocks/index.js
 create mode 100644 app/soapbox/features/domain_blocks/index.tsx
 delete mode 100644 app/soapbox/features/mutes/index.js
 create mode 100644 app/soapbox/features/mutes/index.tsx
 delete mode 100644 app/soapbox/utils/auth.js
 create mode 100644 app/soapbox/utils/auth.ts
 rename app/soapbox/utils/{base64.js => base64.ts} (82%)
 delete mode 100644 app/soapbox/utils/instance.js
 rename app/soapbox/utils/{media_aspect_ratio.js => media_aspect_ratio.ts} (70%)
 rename app/soapbox/utils/{phone.js => phone.ts} (100%)
 rename app/soapbox/utils/{status.js => status.ts} (67%)
 delete mode 100644 app/soapbox/utils/timelines.js
 create mode 100644 app/soapbox/utils/timelines.ts

diff --git a/app/soapbox/actions/importer/index.js b/app/soapbox/actions/importer/index.js
index ee3af3ac3fdd252320ce72d369562e61297ddf25..9ad58e11419d2890dab09d8f3183c376d953d4bd 100644
GIT binary patch
delta 14
Vcmew?`$cv`4Hu)r<{GYY762|%1uXyo

delta 12
Tcmew&`&o8F4cF#cu5uOtCgBAQ

diff --git a/app/soapbox/actions/notifications.js b/app/soapbox/actions/notifications.js
index a4331bf8c144968d647e646607acd7d44ca0e545..ce7e5eca0112ff4309637e5ed95c5619c64aac0a 100644
GIT binary patch
delta 14
WcmX>XbUtXqMj=Lp%^QX0iU9yJ?*;z=

delta 12
UcmX>fbS`MaMxo7{gyxC?04l@<-v9sr

diff --git a/app/soapbox/api.ts b/app/soapbox/api.ts
index bfa07b71ac..6c81042bb0 100644
--- a/app/soapbox/api.ts
+++ b/app/soapbox/api.ts
@@ -31,7 +31,7 @@ const getToken = (state: RootState, authType: string) => {
 const maybeParseJSON = (data: string) => {
   try {
     return JSON.parse(data);
-  } catch(Exception) {
+  } catch (Exception) {
     return data;
   }
 };
diff --git a/app/soapbox/compare_id.js b/app/soapbox/compare_id.ts
similarity index 74%
rename from app/soapbox/compare_id.js
rename to app/soapbox/compare_id.ts
index f8c15e3275968a8a714ebe036ee7745fc8698e53..e92d13ef56d8d06f47a33bf0a2c4212ce236ec5f 100644
GIT binary patch
delta 31
gcmaFD_=RzTiKvxAaY<2TUb>D#W{MGvGtqK20J3unRsaA1

delta 15
Wcmeyu_=ItS39F7mW{S~7&(#1d&;@h=

diff --git a/app/soapbox/components/domain.js b/app/soapbox/components/domain.js
deleted file mode 100644
index 026497a14c299aab736b4ad271093d5d73066e51..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1198
zcmZ`&O>f&U488kT@MZ^yoqJXX-MUK-8;W8*8;Z;%T5ZXb<gA0?|32!&wUf3v7!mpS
z^&TnOPH78|T6Mqvb!gzIRSRiH@7y{=`Xvzo^Ms7s=-2N5?Ao_&Z`q;2$6n)uBD_R-
zh0VnT$veX2d;-l$2B`5UB>q5S*a^)Vg#3-%?xk&DTo%p+nJ94TY|oYa)?2G&L=_uB
zrt08r4oEL!p^cfLyeX9p2|zCojp8rgRm+6j!T_S)LdrN-y|hL2R<(DhYnOrbjg8$B
z@>!lmjW7hnn8LVD#uXLESI=<_fctr@gg49>_!?>ezFL&Eflufh66(@eW(5Z)P!OyH
z*E~QdyPc&hjMYM(*50e+^YwUdiWkRT@<Ny={L>4Kb-+7@m$}rzNpS-kX*hs0lXZiE
zwpfG+&Q?(FVr%v+OyN2<#Z4dC!W9M}!T?5>R}&YgDNmR$NJvZK1#rvZ*P?_ug>T0N
z+Fnb@{NMn0wYY#M`X_6#OhbZn7u}x$s_L(1U59#sB&_L}e4nj~dyz{jaTVY~tXA^0
zn-=446Af<-5N6}@?%deZ@8h<sxYXvh$l?a*G{ptMXkHFFsG6ns{yw!o3=_X@-E-BU
zEX?JUu12uJHdqdh+Ty5m%ck|trqh}3AjrL@D+zSMNa0F8G=jgBgO}uky%=FL)9$7w
PX=cOKbMcr~Vod%6bP0>s

diff --git a/app/soapbox/components/domain.tsx b/app/soapbox/components/domain.tsx
new file mode 100644
index 0000000000..005848c89b
--- /dev/null
+++ b/app/soapbox/components/domain.tsx
@@ -0,0 +1,51 @@
+import React from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+import { useDispatch } from 'react-redux';
+
+import { unblockDomain } from 'soapbox/actions/domain_blocks';
+
+import IconButton from './icon_button';
+
+const messages = defineMessages({
+  blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Hide entire domain' },
+  unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unhide {domain}' },
+});
+
+interface IDomain {
+  domain: string,
+}
+
+const Domain: React.FC<IDomain> = ({ domain }) => {
+  const dispatch = useDispatch();
+  const intl = useIntl();
+
+  // const onBlockDomain = () => {
+  //   dispatch(openModal('CONFIRM', {
+  //     icon: require('@tabler/icons/icons/ban.svg'),
+  //     heading: <FormattedMessage id='confirmations.domain_block.heading' defaultMessage='Block {domain}' values={{ domain }} />,
+  //     message: <FormattedMessage id='confirmations.domain_block.message' defaultMessage='Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.' values={{ domain: <strong>{domain}</strong> }} />,
+  //     confirm: intl.formatMessage(messages.blockDomainConfirm),
+  //     onConfirm: () => dispatch(blockDomain(domain)),
+  //   }));
+  // }
+
+  const handleDomainUnblock = () => {
+    dispatch(unblockDomain(domain));
+  };
+
+  return (
+    <div className='domain'>
+      <div className='domain__wrapper'>
+        <span className='domain__domain-name'>
+          <strong>{domain}</strong>
+        </span>
+
+        <div className='domain__buttons'>
+          <IconButton active src={require('@tabler/icons/icons/lock-open.svg')} title={intl.formatMessage(messages.unblockDomain, { domain })} onClick={handleDomainUnblock} />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Domain;
diff --git a/app/soapbox/components/dropdown_menu.tsx b/app/soapbox/components/dropdown_menu.tsx
index 8114ca7dc4..01a60948d7 100644
--- a/app/soapbox/components/dropdown_menu.tsx
+++ b/app/soapbox/components/dropdown_menu.tsx
@@ -278,7 +278,7 @@ class Dropdown extends React.PureComponent<IDropdown, IDropdownState> {
       onShiftClick(e);
     } else if (this.state.id === openDropdownId) {
       this.handleClose();
-    } else if(onOpen) {
+    } else if (onOpen) {
       const { top } = e.currentTarget.getBoundingClientRect();
       const placement: DropdownPlacement = top * 2 < innerHeight ? 'bottom' : 'top';
 
diff --git a/app/soapbox/components/status_content.js b/app/soapbox/components/status_content.js
index 2bd5c0712161bc5e201cd92c0e598fd95f755f96..663480a75e39066d787dfcf088a290feecc24ee8 100644
GIT binary patch
delta 14
VcmccRcH3>kOD;x*%`dqMB>*)s1~mWx

delta 12
TcmccZcFS$UORmkYxC$izET#q(

diff --git a/app/soapbox/containers/domain_container.js b/app/soapbox/containers/domain_container.js
deleted file mode 100644
index a1d705eaffce3d3db403bbc6ab5892c644953bb8..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1428
zcmbVMO_Q52487-9=!Ti0<euGZKa$yL4rx2v_S|tmB<_MuZL=T4@ZT#NlQ>D+LvtWt
z>q$@2lSI=hZQ%iVVWHBhfkeCa<Yp$us~$?Mgv2cx!}n-15b`G$b|Y<_!M)NAw-(EA
z4MXhZjUc1gRiUIL?1h!avU?%3Q^;MdipRBTxR4oiGWtA1^L$P`g_34odcz;y%EaMR
zi*l<<UjGTzxQobq3>WB=_d-ztBuYC4a11E{W1$JPfaOJTSU&@Z*sheUgl-nlgD4k}
z5Zrxp&pVHK=iw^JoJ-!-HdK^QA4Q2kM1)2dF$oOWY)DUp_#<w4`_*!b-_#eaT0`7e
z3d=iilmhL)Sg_u^0?=qXEulHLyO|A9pmr@x%WZLp;*{Yib9qwBVepZCHI)2tY9<@$
zr=AqRgk#4>v1Il6)BWaQOLcI>-A@qv1#$b;Q2|);&hlN2dhU)*c<#8&&C@<fvw%4u
zFNNGM;Py(PqFnx~4*{86v|*X}G@u_d7!r8mb%$oz(|~yW!7#x5ZXysQ@*e~O@|wVV
zYX7V1s1m%cU$gKJrVHoKTw1Vd)F0TxQ8N?gx3Hn+DiUzP4I1E3;WJpS_ec{w;tVJa
zO=sOT`88cti9(S0fXfnEjTLHF|NOcDl&i5?$^G3F@OB;!&TA8-zVKSfE5Aa5+F8in
z<kwSlY_5{4X|6_zA9WOgCaDF~kkYh(8yk8m`90n#lj)@@&lb;QG`aC3gD-x4hKY?f
ZBcmMMren?ZWM*!_E~Y4DYcC?l@;Cg)>_`9r

diff --git a/app/soapbox/features/account_timeline/components/moved_note.js b/app/soapbox/features/account_timeline/components/moved_note.js
deleted file mode 100644
index fb2f000e89dd43ad7c7e9cde4711ee1bbcd962f6..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1498
zcma)6!EW0y487+oco^UWnC*KS2OCxlEzovDS71k1v6)1eZFv&yr4an@qb#SkyR9pb
zgB-p`Qty$HWvw*9J&KHAuT=?wcIV(?A${n&EE^KL0>5fiKRnfFrnpd^!(q*Fa`C@$
z8;ze7C#<lV)tT}c6J}@7n8d<orAtAC`7IhF4hY@6g^G$P{7$qtvik7?rBy?y!(5e&
zeZE|#sv(zAqTZ=f{M><wB}XUVkF6k~zqF_e@iefaDE7YzP4u`_dEnUDr8G4&??j2O
zuyc<}D~7q^c<LR>aW9&JAS;A1aLdW_J4Fb1BCK))qfIlZ?P397NRZ6H8RQL2!1CYF
zcd?#O&w!{DbtKI_{%oYi{Cy85^+ssNT?1%t3-xj}lwv6jf$dAa2U6@#0(6una&4K5
zzJv!23OJpvs4N&~Ax)2bT=(?ofV2#zI`zR|1-`PYO^vQ#*(U|q<g)d`xtvKLvP?A<
zrD^G83@g?#*bdk?p_%C?aYB0|(alu&ON+Wj9c(w({0T;9iPc{0Ww1v<N1jxNG%;V3
z`av}DPD|Wp!eC_DL$K=pbEP!x=NI<!g!y-w(-GqBh7-2qUAgH$mP_W(3Prs@DX9R4
z`5QJc39OsX4vxY=4`NH#0kooM&?MG^3$J0b%jI@sNUQ1qxu_1vYiNq6Z%Efwh5G8@
z_9n3}4Db3r9TPft9-Z;ckKgA_CzaU8_`^Fp4pc<S&k37NEY{;pt{h3og1vXE(U>$H
zS_oa+ubTQ#rr&zDbpA{XvzAy=?$wgK6^V5Zt-s|<H!de{#Ed$VVYv5MnTe?@w@BS$
H(Jg)h{t5m*

diff --git a/app/soapbox/features/account_timeline/components/moved_note.tsx b/app/soapbox/features/account_timeline/components/moved_note.tsx
new file mode 100644
index 0000000000..6e901252d9
--- /dev/null
+++ b/app/soapbox/features/account_timeline/components/moved_note.tsx
@@ -0,0 +1,34 @@
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+import { NavLink } from 'react-router-dom';
+
+import AvatarOverlay from 'soapbox/components/avatar_overlay';
+import DisplayName from 'soapbox/components/display_name';
+import Icon from 'soapbox/components/icon';
+
+import type { Account as AccountEntity } from 'soapbox/types/entities';
+
+interface IMovedNote {
+  from: AccountEntity,
+  to: AccountEntity,
+}
+
+const MovedNote: React.FC<IMovedNote> = ({ from, to }) => {
+  const displayNameHtml = { __html: from.display_name_html };
+
+  return (
+    <div className='account__moved-note'>
+      <div className='account__moved-note__message'>
+        <div className='account__moved-note__icon-wrapper'><Icon src={require('feather-icons/dist/icons/briefcase.svg')} className='account__moved-note__icon' fixedWidth /></div>
+        <FormattedMessage id='account.moved_to' defaultMessage='{name} has moved to:' values={{ name: <bdi><strong dangerouslySetInnerHTML={displayNameHtml} /></bdi> }} />
+      </div>
+
+      <NavLink to={`/@${to.acct}`} className='detailed-status__display-name'>
+        <div className='detailed-status__display-avatar'><AvatarOverlay account={to} friend={from} /></div>
+        <DisplayName account={to} />
+      </NavLink>
+    </div>
+  );
+};
+
+export default MovedNote;
diff --git a/app/soapbox/features/audio/index.js b/app/soapbox/features/audio/index.js
index 7553f238868d247882f6b7160549a84414c54182..b8ef5892cbaacb269d7c7eb5e5d9b39cf243007e 100644
GIT binary patch
delta 14
Vcmdm2v%hA;J1Itm&F`cFlmR#+27Lek

delta 12
TcmdmAv#(~uJE_g@r2>=zF9rr(

diff --git a/app/soapbox/features/birthdays/account.js b/app/soapbox/features/birthdays/account.js
deleted file mode 100644
index b29d7958919f7aa70dee37b80fa887bab8f2872b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2476
zcmaJ@O>f&U487-9aKKPIK;j$*?9etvyA>FE=um9Er;4pK+HA>_<gT6J|31=^EXP^q
zgHxH0<m0C*s#<9a4_eiaZ#6ft)2f1`#`DtBhvZ@=9OfHmx%F~Qe@D?>RW+7vOFp&J
z<CY?bmt=QhHtIH-e^%&Aa(UoqtdE#w9zc;m3kBZ^$?v%_?3tSd2>FBO_D<Rox-sdc
zz)xevTuF(@2}<*#c|}+V{^o^QroADfSiM!RtAU7Fv0fhS-U?Hf?CmS7_-UoWfi@CR
zQS}ZPoz@X3jo1gSD^?2m^Rz-8AW^G@iv8qYxV_19)nKwihC*P5mzWZzsroZ?Xe?Ad
zv#_3|I&EhFTcPc~U~lKpf+)@*Va{?E1j&NbSW{YGBE)=BT0&be%ew@+#jKl0Z^-YS
z)!!`&9~E_#LC5JF)>lCO9H-|P!Fm!>O11*7I<{oU@&eg<qIU&!gY}^2W#~D2O1<Ww
z=NtiOZX1dRz0%|5i~iVM;19m=?O_v27c-Lb*M1m%qTm{%q}EKST9a(dXV<aAXL-qt
zfg4{<{%W}_44jy(mS|8EA_tmBH}`ALe2D8jE``ikE#z}1%s2k45jYzzEE=UTOl@iA
zj$q#8`G`<(n`xda-J5gi@w|KrLg8IfSy6E8tsN^3Cjw4m7{Xgo+*3DWmpHs@lA*+l
zP!p;(*3|BW$tVG)FARX#K{|vFXJ_!vpMpUc>0~=@^ZkuWc~rx0pz3!-&y`yiT%V>y
zDLl<467X#!o3iw5U36i-Fdk1f!(L63@ICQ_D7JUu<2-cXk-441ePS&yKKX%0yF@W_
zf?FJ#G+3eO=|?`1O~tjyamFhp?H)(l?D1B?^BZRxj{$%)=Gpsr(mq=NmxXwNzKdyN
zuEY9BuDtvtVzc?JS&chx1VwP%i^oPc8^3p#{oVyDY{}Q{LHh7ulX(Yw&3EheX?6Yn
zpYo>;topA!20(3bBFqV+L!JL<xl3m`WZ=@@Qa+R+rVfnwgCTzS*um=Ra)rr0@-e=!
zj`dep)XecYvT?Z@Qa(0K0Us#-s~n-Bk^`hK%c%SO&5?$yXt-Rk6Ax4Y`_gjU6w_{Y
zYb%7&&1p=-Gp3C>?{8tF^L4A;&P$W){$CuuqAS?=_m-8Vl9_pVrgp(J1#|S<9uXKj
RoaFG}I6CwLjJu?p{ROB@CCvZ;

diff --git a/app/soapbox/features/birthdays/account.tsx b/app/soapbox/features/birthdays/account.tsx
new file mode 100644
index 0000000000..e72499b3d7
--- /dev/null
+++ b/app/soapbox/features/birthdays/account.tsx
@@ -0,0 +1,64 @@
+import React from 'react';
+import { useEffect } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+
+import Avatar from 'soapbox/components/avatar';
+import DisplayName from 'soapbox/components/display_name';
+import Icon from 'soapbox/components/icon';
+import Permalink from 'soapbox/components/permalink';
+import { useAppSelector } from 'soapbox/hooks';
+import { makeGetAccount } from 'soapbox/selectors';
+
+const messages = defineMessages({
+  birthday: { id: 'account.birthday', defaultMessage: 'Born {date}' },
+});
+
+const getAccount = makeGetAccount();
+
+interface IAccount {
+  accountId: string,
+  fetchAccount: (id: string) => void,
+}
+
+const Account: React.FC<IAccount> = ({ accountId, fetchAccount }) => {
+  const intl = useIntl();
+  const account = useAppSelector((state) => getAccount(state, accountId));
+
+  useEffect(() => {
+    if (accountId && !account) {
+      fetchAccount(accountId);
+    }
+  }, [accountId]);
+
+  if (!account) return null;
+
+  const birthday = account.get('birthday');
+  if (!birthday) return null;
+
+  const formattedBirthday = intl.formatDate(birthday, { day: 'numeric', month: 'short', year: 'numeric' });
+
+  return (
+    <div className='account'>
+      <div className='account__wrapper'>
+        <Permalink className='account__display-name' title={account.get('acct')} href={`/@${account.get('acct')}`} to={`/@${account.get('acct')}`}>
+          <div className='account__display-name'>
+            <div className='account__avatar-wrapper'><Avatar account={account} size={36} /></div>
+            <DisplayName account={account} />
+
+          </div>
+        </Permalink>
+        <div
+          className='account__birthday'
+          title={intl.formatMessage(messages.birthday, {
+            date: formattedBirthday,
+          })}
+        >
+          <Icon src={require('@tabler/icons/icons/ballon.svg')} />
+          {formattedBirthday}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Account;
diff --git a/app/soapbox/features/birthdays/date_picker.js b/app/soapbox/features/birthdays/date_picker.ts
similarity index 100%
rename from app/soapbox/features/birthdays/date_picker.js
rename to app/soapbox/features/birthdays/date_picker.ts
diff --git a/app/soapbox/features/blocks/index.js b/app/soapbox/features/blocks/index.js
deleted file mode 100644
index 7bf3ca43ec3632fee010afc4c293c921b8bf53de..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2104
zcmah}U5ndB6n*!vxSJQrAWMPtX=^P>Hw2buOUdS?loH0$^?Dj<Mx7azHA4SAcfK^T
zlTu@_r8)QO%sH3$gH#44Xz?IN(ICulRI-PxlP%My?B@;lkl&RYKA#8F;e4Ryov|+x
z<`c5UgmY#8r=y3y9}PQnc%8@Lc03;MY~HK1DRxwNFR34a;-bzvo-n&6f>Hx^#3L8@
zh+4B})CF+yH#X)$n67{iQuWLjY{T(FLuijc>r{;tf?}^w3fu98V3D#3?qxUjqJXD?
zQ-E6VTC(9FU#g`~U5)%A@`$E6{nE+iD|L!50~4)(T5^<SMPDMBOQEZSgQgyz8YR2V
z68@3v$dwOS71aysOGmI2{;p|A4(478!-zB$E;S|yZ#9*7xGzMA2ihU%flBs)XsEB4
z&!-K*30cd<^DRk_x3`crj;S(?QP>bRb|zd00o?T1!l+T{4CZ1pZ&NKcJQ-&2v$XQk
zR8reVsPDj43vE8M`qrP6&qz0)|C!lzZg!m&kS*miZm`$cU)#d=%JidDcndc-F75vY
z3w$vy*0o5tXFV1sg113Dd4JjTcJnqVa?^B7Yj8trx_^VB)$kuim^Rd;?Tj~I?c;4)
zgXI}uV2brL_hP(K9<1<7u0P>FBPZ3`Apu&h2S%z}Lyxo*z5}k=OfAL2rBp3a(kC=N
z??PYd;2>q^4>>t&UGRs!&2-TKi*DcZ_R*>{--Z#*iR;o%uFE(?zA{k0C8Yq&Hpz*M
zM4ph0QYaD#U5j6QIb|ccc+P&5aBaevv4A(PUl*j|F3Q=ck#?w6CV-+#L$!42Z9#f>
z8z+%iM1hgDYe=PC4gh|H{3fB}%r?Clm4KWo`On_3o4e%&z&>uCD!tuTmpDgGpvSUo
z&5J!P;kXNH*nhVld0S@=MAo-EE;={LJjB+o{*WWh_b-affU_5Qn2EFZF`Utqub{dM
zvtEr91_Ih+*wvFIt~|O;9n$B0STbeUC);^7=j9GuvEtX>uXwJb<5!1LM0M1YyNpZ8
z%qwV6c0GkZ>$5e3^|XFkqnyouV?EXxnXkd!dG}McR7kS`Oi2PIZH}C`B-aIL1+ag2
ky|lm5gcEOPTCx7Oy7R8{dfBE<_SGd>G4rKXqK)RwH@a}JO#lD@

diff --git a/app/soapbox/features/blocks/index.tsx b/app/soapbox/features/blocks/index.tsx
new file mode 100644
index 0000000000..cdc3b0a984
--- /dev/null
+++ b/app/soapbox/features/blocks/index.tsx
@@ -0,0 +1,58 @@
+import { debounce } from 'lodash';
+import React from 'react';
+import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
+import { useDispatch } from 'react-redux';
+
+import { fetchBlocks, expandBlocks } from 'soapbox/actions/blocks';
+import ScrollableList from 'soapbox/components/scrollable_list';
+import { Column, Spinner } from 'soapbox/components/ui';
+import AccountContainer from 'soapbox/containers/account_container';
+import { useAppSelector } from 'soapbox/hooks';
+
+const messages = defineMessages({
+  heading: { id: 'column.blocks', defaultMessage: 'Blocked users' },
+});
+
+const handleLoadMore = debounce((dispatch) => {
+  dispatch(expandBlocks());
+}, 300, { leading: true });
+
+const Blocks: React.FC = () => {
+  const dispatch = useDispatch();
+  const intl = useIntl();
+
+  const accountIds = useAppSelector((state) => state.user_lists.getIn(['blocks', 'items']));
+  const hasMore = useAppSelector((state) => !!state.user_lists.getIn(['blocks', 'next']));
+
+  React.useEffect(() => {
+    dispatch(fetchBlocks());
+  }, []);
+
+  if (!accountIds) {
+    return (
+      <Column>
+        <Spinner />
+      </Column>
+    );
+  }
+
+  const emptyMessage = <FormattedMessage id='empty_column.blocks' defaultMessage="You haven't blocked any users yet." />;
+
+  return (
+    <Column label={intl.formatMessage(messages.heading)}>
+      <ScrollableList
+        scrollKey='blocks'
+        onLoadMore={() => handleLoadMore(dispatch)}
+        hasMore={hasMore}
+        emptyMessage={emptyMessage}
+        className='space-y-4'
+      >
+        {accountIds.map((id: string) =>
+          <AccountContainer key={id} id={id} />,
+        )}
+      </ScrollableList>
+    </Column>
+  );
+};
+
+export default Blocks;
\ No newline at end of file
diff --git a/app/soapbox/features/bookmarks/index.js b/app/soapbox/features/bookmarks/index.js
deleted file mode 100644
index d2b7ea613126cd4c0c7cb7e1e672fed797c2869a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2648
zcmb7FZEM^{5dMC@VjK$6fvgMkn`4>Kn1X3sitSQL2+p2%&bPI+t7=z{jky2b**9tL
z&W059LDIZEJM%oVqU}^~U<8h9HOLxa2b*5CkTr@kz0E!>gm?L)SKZx9hdS6h`aU)G
z$Lw>1tTw^k+xOXY)wY9S>jn?=IKNX7&8If+LE1TX=<$;xJQC$zoiv_&PV4A21F%Qj
z2#MFIHG4o^fRO)SZLXwg3iws^Ei(prFi&j=@W?4mRVyhe_Q0!0K0K3KY}xIw{+&IE
z2WEtlp)FdmZmphI6GFYx!}?xMercIcsu@~2Re2?L5J|leHfZYYFG@YOtbas)YnU0d
zJu5zUO!8yPl)Eff^w7u%s$Q)_ie$Dv*Jq()<9$SW4p;5IAr}jZdPKf$Xg5>`{m;h*
zz!n)7^5KjKDEJv<wL5S*moID-8yXYlLO$^jI)h!Y*e&N$tg|5TPFap=s;KQJR2Sfi
z*{?xgaed|u<pa|6^Dmh<IN&-fAWO?<!eFbjugikq3jJ9Hz%KO<W{6SQ*8)sGpv$#o
z`damP1}7)~BbUTy<G{Fc(^Rc`LyO>Jpk?0fcVfBtICFhbH%x1ox=7S8D7l6=R5mW?
z;1;2%!D`d*fC}vR0JzW{BhH<{r0a4+d!!Wl2LBxdNy0XcGHlh*@IO0F6S=K>)ij48
z!EYYY3@DZ@RnL)9-l91wAV{KVO0~A?K63L6yCSm9fVJs~guZ@DToYb*sS8n}@eb46
z=J?r|5aigrBc_6v=p{3Z_?a&)IejO+Txd&$j*>DfFk7L^&a(M~>tc^)=;h>-zoGYh
zNvZ(Y*?N;eF9pA*6>q4hujrDy3>Hp4hiqw8G-#=A8S0elFNZt@JYy>(=KQTS69E<Q
z^ZWM&slAE9w|aox(jxU`Z*bG2-X3%(9Q;klJy96@>1eT;mK4P++@pVyX9ac0ZrLkd
zKr;M-;5dQOJrVW$>PUR4PSAzG3G~THOy{O;`)}7Ewsfh*yQPBjqx(kiDsxWvK0euj
zQQslFdiS>)fGe39!uW*1<O@tI3tmVY@Yfb4ypS8?9O$;BLm2ojn#T6xI}9Cd-X6<$
zu(}8^LxXciGk|k10a{l~lESII<|3HLxPP&Q6<>|E+vUdHqycLlY`P4aez~KPNg_7|
zd#OzSz}BoE{f?-{6W`fgVxLA=jnnI%-L043@TD5R#l9fF_r9o4e;VV6cHh#tFz{*&
zFR5+f0G%?@A+;+R<x-7~r287$cMTNZ^9=t|$K#br2R>S(X++AhYD~XUueFf;PF<>c
nXlbm};)M389~V!8quuvaMjWUyn}#sW@O<To;%6FH$Zqi;(6)Pm

diff --git a/app/soapbox/features/bookmarks/index.tsx b/app/soapbox/features/bookmarks/index.tsx
new file mode 100644
index 0000000000..90aae0c1f5
--- /dev/null
+++ b/app/soapbox/features/bookmarks/index.tsx
@@ -0,0 +1,56 @@
+import { debounce } from 'lodash';
+import React from 'react';
+import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
+import { useDispatch } from 'react-redux';
+
+import SubNavigation from 'soapbox/components/sub_navigation';
+import { Column } from 'soapbox/components/ui';
+import { useAppSelector } from 'soapbox/hooks';
+
+import { fetchBookmarkedStatuses, expandBookmarkedStatuses } from '../../actions/bookmarks';
+import StatusList from '../../components/status_list';
+
+const messages = defineMessages({
+  heading: { id: 'column.bookmarks', defaultMessage: 'Bookmarks' },
+});
+
+const handleLoadMore = debounce((dispatch) => {
+  dispatch(expandBookmarkedStatuses());
+}, 300, { leading: true });
+
+const Bookmarks: React.FC = () => {
+  const dispatch = useDispatch();
+  const intl = useIntl();
+
+  const statusIds = useAppSelector((state) => state.status_lists.getIn(['bookmarks', 'items']));
+  const isLoading = useAppSelector((state) => state.status_lists.getIn(['bookmarks', 'isLoading'], true));
+  const hasMore = useAppSelector((state) => !!state.status_lists.getIn(['bookmarks', 'next']));
+
+  React.useEffect(() => {
+    dispatch(fetchBookmarkedStatuses());
+  }, []);
+
+  const handleRefresh = () => {
+    return dispatch(fetchBookmarkedStatuses());
+  };
+
+  const emptyMessage = <FormattedMessage id='empty_column.bookmarks' defaultMessage="You don't have any bookmarks yet. When you add one, it will show up here." />;
+
+  return (
+    <Column transparent>
+      <SubNavigation message={intl.formatMessage(messages.heading)} />
+      <StatusList
+        statusIds={statusIds}
+        scrollKey={'bookmarked_statuses'}
+        hasMore={hasMore}
+        isLoading={isLoading}
+        onLoadMore={() => handleLoadMore(dispatch)}
+        onRefresh={handleRefresh}
+        emptyMessage={emptyMessage}
+        divideType='space'
+      />
+    </Column>
+  );
+};
+
+export default Bookmarks;
diff --git a/app/soapbox/features/chats/components/chat_list.js b/app/soapbox/features/chats/components/chat_list.js
index b312199133233626da8cbd8aa024c5e4374e53f1..ffb0c172095260d9e62293078855740e6ffa9bfc 100644
GIT binary patch
delta 42
vcmeAWYY^M8fMxPA7OlyjSi}UAGZIUR6>RMkzziKO&B@bQ^fzm;K41j^J|PYw

delta 68
zcmZn=>k!+pfMxP87PZL>ShVyN6r$5pOM>%@N>WptGZITYQ;K7CxD<dO8OSSEu(g9Q
PKw_HKT${yNU$O!K7GxDs

diff --git a/app/soapbox/features/domain_blocks/index.js b/app/soapbox/features/domain_blocks/index.js
deleted file mode 100644
index 3ab08456405c1ddf2dfbe6dab7e499543eda2a70..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2269
zcma)7U2Ehv6n&pxar0yk%-9Qkn~uY>38hOLD4X=Dl%TQiWYo1KSCS#Y_`mn+%d#ga
zY?y#8o%?;yG4Fb*42;m=Ne-e$nBc5r2U#l{rZ3sg8}1>0DA_-~^{B&rPw#tU4-)1Z
zvf6}uWuMd4*RC53JGFT2$Km!oUhl2nE4RsZP<SUPAAw>OXK7EEeH}q50bAmk3w%JW
z*$e6&aPbe;=BqI64t|lUW5!?;uIDy{^a!+cRZAhr_6nu28D0q%TQ<UD&k3kzoR+LV
z$=7nuPnQE<S)9?-mwVYUF21y~{!V$~YtKZpJe&O$MM*zuG?zk`jWc^bIlGkZW36P{
z+TQ=pb!?lrT;!o=)N@O)WbOmsNnt1_s>QEIv=66qaO#Z5B?ou19XgTh2EMGncDJ?%
zWJ>9EVLnh@4J;ow02gEp7cU3eSl%2U^VY?>@}0G0Lu<k?3HK{+8WiAhI)iCP&IaLH
z<qMo$vbrWFm?GRhdz<V7r+<nIZxBY0n4H&Xn<`=bqhSW0q}_Q<1!?;V)h)PMLNW(`
zT)ZIdV*Xd=kKGV7Ma{xE>4_WcboTew=6+%NK`K1J&5iT=1Lgu>jk9(+(pFjKhfcxg
zu+n+A&U(A~oOrUSTc$Pm#iYG7C>jm_L(g$TY1-U)4VKhiJSwnb1n8M!oj$-U2ZcOY
zIu=}i!+!@(T(V^XG+g(LII)DDNvYle=Z++oCn?+D#ZiOerDS7Dg;WhvxJNV|%ZcpE
zXdfmv(U<{d{@nBC!EQ~y4fUA|*M%)x7qNo;9k=r>Z41C;U0sOd#8An|k)kD`$#_N1
z$tSIhZ`((1-|Iv4yMv!TecBOM+DIFt29kKYqX3GghicB)(~o%N1Tie<E-o5LP6a8t
za{$24klzGotlT;_gA$Na4F7lZ5^y^o034$<mg)3Zu5qq8p*^<ORvxgUuR|2+3XboD
zn>SVFK+hj)LtOaaqRO5wG<;z6FC-A37cv2FXo?KV+feOQU7;%Alv$N^Tnu_&b5*yP
z0m&`4)o6QJoZYu21kAgjZ$*%@?X+mXTB;ZA^6LB>zEx2lf-EdBQpD}4MmMSTN=*xB
z;7T=yhvnU}!_~NaOQ@7GMETPNDM#*if%bI~jD~&h=yw;t4e*@`iLx0)IlY&+o`-&S
TwkhhdT=ypiS?^7x)U^2z=#}sU

diff --git a/app/soapbox/features/domain_blocks/index.tsx b/app/soapbox/features/domain_blocks/index.tsx
new file mode 100644
index 0000000000..712a6671f8
--- /dev/null
+++ b/app/soapbox/features/domain_blocks/index.tsx
@@ -0,0 +1,60 @@
+import { debounce } from 'lodash';
+import React from 'react';
+import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
+import { useDispatch } from 'react-redux';
+
+import { fetchDomainBlocks, expandDomainBlocks } from 'soapbox/actions/domain_blocks';
+import Domain from 'soapbox/components/domain';
+import ScrollableList from 'soapbox/components/scrollable_list';
+import { Spinner } from 'soapbox/components/ui';
+import { useAppSelector } from 'soapbox/hooks';
+
+import Column from '../ui/components/column';
+
+const messages = defineMessages({
+  heading: { id: 'column.domain_blocks', defaultMessage: 'Hidden domains' },
+  unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unhide {domain}' },
+});
+
+const handleLoadMore = debounce((dispatch) => {
+  dispatch(expandDomainBlocks());
+}, 300, { leading: true });
+
+const DomainBlocks: React.FC = () => {
+  const dispatch = useDispatch();
+  const intl = useIntl();
+
+  const domains = useAppSelector((state) => state.domain_lists.getIn(['blocks', 'items'])) as string[];
+  const hasMore = useAppSelector((state) => !!state.domain_lists.getIn(['blocks', 'next']));
+
+  React.useEffect(() => {
+    dispatch(fetchDomainBlocks());
+  }, []);
+
+  if (!domains) {
+    return (
+      <Column>
+        <Spinner />
+      </Column>
+    );
+  }
+
+  const emptyMessage = <FormattedMessage id='empty_column.domain_blocks' defaultMessage='There are no hidden domains yet.' />;
+
+  return (
+    <Column icon='minus-circle' label={intl.formatMessage(messages.heading)}>
+      <ScrollableList
+        scrollKey='domain_blocks'
+        onLoadMore={() => handleLoadMore(dispatch)}
+        hasMore={hasMore}
+        emptyMessage={emptyMessage}
+      >
+        {domains.map((domain) =>
+          <Domain key={domain} domain={domain} />,
+        )}
+      </ScrollableList>
+    </Column>
+  );
+};
+
+export default DomainBlocks;
diff --git a/app/soapbox/features/emoji/emoji_compressed.js b/app/soapbox/features/emoji/emoji_compressed.js
index c95bccf08fd21e82b034b2e7e5d1fcedfe2b67bd..542bb7febc91840fa38fef8c8db2a1b0d044aec3 100644
GIT binary patch
delta 14
WcmaDZ^+IaHOeRK!%`=(KaRC4>rv;V(

delta 12
UcmaDM^;~MhOs37Vn9gwl04GQVb^rhX

diff --git a/app/soapbox/features/mutes/index.js b/app/soapbox/features/mutes/index.js
deleted file mode 100644
index 69664c72f28f8bbd66f583a27b7b7911cd0a2eec..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2089
zcmah}U5ndB6n*!vxSJQrAWMPvX=5!3TLMeFrDXFGN(p1>dOeLaqt1-V8lnH5J6{^v
zNr*An(ww;;=bm$UKS*U@f))>Q6b-@*M<sj6I@vOP%HC|ahy11F@bNsL4(9_s?~Hws
zFdvXLCY&q#KOH^v{b<;s!|ON>x8w16XX9RlO?O9y_mb)nC@%7>?-OR%L{KWgws_<M
zA5m-ejJg0W{>8>T2-6ktUaFoMgKaooXb9yIXdSANLeSkSl)`p=Ay}krf_vGGy(r*m
z;B-MPcrDp*kT2Czr>;hRar20#IX#ZX7K$$e6Rmq#B9vuCU!s^xp)2BcJ%^`8$*!|(
z|G{-6%HLRJ)C=l!N3hi2yQU#6n0qM<BgRyiXbceEYRc|#pNS0*v>ng`rR)RCP+!rW
zPaA*}vX+bIThbkGZy{?OO{MRmus7J)nJ@}Ex2?A@YE(Ldx!BCxl!y&ah8g@Qt*|uZ
z)AkYSJ8-E&jSsE9^(W;s(#-R}GaJq|uCoHNm^<SJd!7BWEo_}kKT3tSaC76L{_L*6
z7vrwF0%>g4TcI0x8$^@$mnCmEZ<7)?O~<qb+pwm&8x*aEALxJDP>HrK-hg$DcV`Wj
zVSs@t)>G4q-%5F~dM~;Dfd7r0#A;gvXt^F3iERx%(kl1{xUi8z9;EDilr_((-dI&B
zRg0AI35|zyGSoWZcWawz$^eUEf8*_=)n&d7Et(V8rR`jov57qSCf|}u0A?HGME)T&
zNJbG9iGzmX*IiD*NGhJP@5NhrF9s~&m)EZg(ry=JY}81L(~1&6(a2COHF`Uc&fS^`
z6c&)^B1hMdGP@W6{0R9?0>zGPcrz*iIc4&nz27l+%L{;gTsKvEyRR;Bj+?-a<=C1Q
zd)mBl0oJhpW-0Qv&K!s=Zx>r|Y?OGoTEF@vN22_H6d7#-=Upbw-oJ20Q@(=gE;M@8
zPv{0{d0|&imbLQec5?`x_hGY?VTo+#Rg;&CZ$*jUb-&}e4o+X4NfCunPi_#GYMEEi
zFu!^Vf7WMf_UdW<v_?69|H*o+GqPQSyYueXY{`&X0hrSGOIjH@Z%L^O(hh(B?s`#w
hp#~@3&a_tjZ*}MW=C!g-mF%lau43d%okR!Co3DgHt8)MV

diff --git a/app/soapbox/features/mutes/index.tsx b/app/soapbox/features/mutes/index.tsx
new file mode 100644
index 0000000000..8e27c06d20
--- /dev/null
+++ b/app/soapbox/features/mutes/index.tsx
@@ -0,0 +1,58 @@
+import { debounce } from 'lodash';
+import React from 'react';
+import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
+import { useDispatch } from 'react-redux';
+
+import { fetchMutes, expandMutes } from 'soapbox/actions/mutes';
+import ScrollableList from 'soapbox/components/scrollable_list';
+import { Column, Spinner } from 'soapbox/components/ui';
+import AccountContainer from 'soapbox/containers/account_container';
+import { useAppSelector } from 'soapbox/hooks';
+
+const messages = defineMessages({
+  heading: { id: 'column.mutes', defaultMessage: 'Muted users' },
+});
+
+const handleLoadMore = debounce((dispatch) => {
+  dispatch(expandMutes());
+}, 300, { leading: true });
+
+const Mutes: React.FC = () => {
+  const dispatch = useDispatch();
+  const intl = useIntl();
+
+  const accountIds = useAppSelector((state) => state.user_lists.getIn(['mutes', 'items']));
+  const hasMore = useAppSelector((state) => !!state.user_lists.getIn(['mutes', 'next']));
+
+  React.useEffect(() => {
+    dispatch(fetchMutes());
+  }, []);
+
+  if (!accountIds) {
+    return (
+      <Column>
+        <Spinner />
+      </Column>
+    );
+  }
+
+  const emptyMessage = <FormattedMessage id='empty_column.mutes' defaultMessage="You haven't muted any users yet." />;
+
+  return (
+    <Column label={intl.formatMessage(messages.heading)}>
+      <ScrollableList
+        scrollKey='mutes'
+        onLoadMore={() => handleLoadMore(dispatch)}
+        hasMore={hasMore}
+        emptyMessage={emptyMessage}
+        className='space-y-4'
+      >
+        {accountIds.map(id =>
+          <AccountContainer key={id} id={id} />,
+        )}
+      </ScrollableList>
+    </Column>
+  );
+};
+
+export default Mutes;
diff --git a/app/soapbox/features/status/components/quoted_status.tsx b/app/soapbox/features/status/components/quoted_status.tsx
index 25c8e850ed..0b715a86f9 100644
--- a/app/soapbox/features/status/components/quoted_status.tsx
+++ b/app/soapbox/features/status/components/quoted_status.tsx
@@ -8,7 +8,8 @@ import { withRouter } from 'react-router-dom';
 import AttachmentThumbs from 'soapbox/components/attachment_thumbs';
 import { Stack, Text } from 'soapbox/components/ui';
 import AccountContainer from 'soapbox/containers/account_container';
-import { Account as AccountEntity, Status as StatusEntity } from 'soapbox/types/entities';
+
+import type { Account as AccountEntity, Status as StatusEntity } from 'soapbox/types/entities';
 
 const messages = defineMessages({
   cancel: { id: 'reply_indicator.cancel', defaultMessage: 'Cancel' },
diff --git a/app/soapbox/features/ui/components/profile_info_panel.js b/app/soapbox/features/ui/components/profile_info_panel.js
index 57dfcf48e5206f5b38caaed756aa193b15c93b1e..e4547e270534069b6be18c7d224331d69393f367 100644
GIT binary patch
delta 14
WcmccUe93vkEoMfA&9|7p%K`v200w*j

delta 12
UcmccQe9?KsE#}R)nZL^d04vc3TmS$7

diff --git a/app/soapbox/features/video/index.js b/app/soapbox/features/video/index.js
index 708d871494c4359fc246a5721e9849a03de782cd..869fcdfce7872e3b9a2c0d2ead2e2fe7c0f4cbb1 100644
GIT binary patch
delta 38
tcmX>yi}Cm@#tqsMj0%&rCG>%0l!QLJf<}dcje^1C1PSrY%OvKR007?Z3kU!J

delta 22
ecmX>;i}A=T#tqsMlXWEYC&x(WZ|;%UZ2|ye{|Gk#

diff --git a/app/soapbox/reducers/auth.js b/app/soapbox/reducers/auth.js
index 9bd3f6f334da8eb83754bc15ac586ebd842b8a89..26d3c87949ae3eaaaa2d2f695460ddb3f854a1f2 100644
GIT binary patch
delta 14
VcmbOdI5luXA}gc9=0sLwWdJ9Q1abfX

delta 12
TcmbOlI3;jHBJ1WPR%2xVAqWIg

diff --git a/app/soapbox/reducers/conversations.js b/app/soapbox/reducers/conversations.js
index 29ea929f359bbef9745d5e79863a15177106a71f..f15408e0cfa6532d2a6f0b3ae3a4f093621b076c 100644
GIT binary patch
delta 14
VcmbOyHeYPRTsB69&2!lrSpX)T1i1hJ

delta 12
TcmbO)HcxEBT(-^g*cw>?AYufW

diff --git a/app/soapbox/stream.js b/app/soapbox/stream.js
index fb047436764bc6df7d579315710f117655f50c17..5d201e31443554656e347719d2eb8fc4a27ec345 100644
GIT binary patch
delta 13
UcmaDN{8V^D6epv?<S5QA03`JUqyPW_

delta 11
ScmaDV{6u&|6zAk<&Mp8RP6UJi

diff --git a/app/soapbox/utils/auth.js b/app/soapbox/utils/auth.js
deleted file mode 100644
index 0d0c6c321a5daf64d9452af633ee0df1a4f3b3c1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1512
zcmcIkO>Y`85WVv&rk8j@i2Q(vN>r7qRXJ2`$t8*+XLkTAyI#v5X;H#|@7QYtyG!8I
z3ybID&70>Li&{0>!W%4wvA_-Fb?q#Ft}qz(u+~itOe8D28;$U9$SE30DX+W|WnRJ@
z1pRylyHnV#!(l!LW~>%+!{Fw|n?8AybXC<cI9cLaNGu27!mNHS3EJt(W5106tlot$
zfW$vQ?u?w{JMsW%v`$M3ap(<uD7Y=QF+4igyfUqKwD0$#xHkBO8@y08!kiYLHCk+h
z{IDdWzKG4R-UjWm*=(@P<)SDWCoT1AEVr1tZ8fgx+}dZ9lCc_D=s0o-8Qzo2?1AwX
z$*?KZ_(*YsHib!536|1+omPyP@mjOw&c?^m=P)U5q15l@1!dyud+1Sfc1yGvS1Npp
z0*!gHK8bmz-N_=zl|h{_vw$^)*k4|byCOyV%8yFF?opCMHqoHL31tt1bDpgu5?;+?
z0pCKO`#@!{NC-*|1oSTFD;ImJKx)6nkK`wDy<TA#uhwcuCEf?kQ;`24MCTF69>Q{6
z7N<rMMU;dy4bgO_@8ftzi(O`MnyxTExw=a-{TJ%(ES%#W-k`|*b~1r)Xu)m~?iWAu
zub|v>B?@@K-3%tTg8{zhN|fJmmqs%6b$)ZZ>+$Myp9q;mh4=T~ObdE^xh&8xlB$qi
PY3~2FNiD0G8(x5a^$X+E

diff --git a/app/soapbox/utils/auth.ts b/app/soapbox/utils/auth.ts
new file mode 100644
index 0000000000..1a5b1b38e7
--- /dev/null
+++ b/app/soapbox/utils/auth.ts
@@ -0,0 +1,66 @@
+import { List as ImmutableList } from 'immutable';
+
+import type { RootState } from 'soapbox/store';
+
+export const validId = (id: any) => typeof id === 'string' && id !== 'null' && id !== 'undefined';
+
+export const isURL = (url: string) => {
+  try {
+    new URL(url);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+export const parseBaseURL = (url: any) => {
+  try {
+    return new URL(url).origin;
+  } catch {
+    return '';
+  }
+};
+
+export const getLoggedInAccount = (state: RootState) => {
+  const me = state.me;
+  return state.accounts.get(me);
+};
+
+export const isLoggedIn = (getState: () => RootState) => {
+  return validId(getState().me);
+};
+
+export const getAppToken = (state: RootState) => state.auth.getIn(['app', 'access_token']);
+
+export const getUserToken = (state: RootState, accountId?: string | false | null) => {
+  const accountUrl = state.accounts.getIn([accountId, 'url']);
+  return state.auth.getIn(['users', accountUrl, 'access_token']);
+};
+
+export const getAccessToken = (state: RootState) => {
+  const me = state.me;
+  return getUserToken(state, me);
+};
+
+export const getAuthUserId = (state: RootState) => {
+  const me = state.auth.get('me');
+
+  return ImmutableList([
+    state.auth.getIn(['users', me, 'id']),
+    me,
+  ]).find(validId);
+};
+
+export const getAuthUserUrl = (state: RootState) => {
+  const me = state.auth.get('me');
+
+  return ImmutableList([
+    state.auth.getIn(['users', me, 'url']),
+    me,
+  ]).find(isURL);
+};
+
+/** Get the VAPID public key. */
+export const getVapidKey = (state: RootState) => {
+  return state.auth.getIn(['app', 'vapid_key']) || state.instance.getIn(['pleroma', 'vapid_public_key']);
+};
diff --git a/app/soapbox/utils/base64.js b/app/soapbox/utils/base64.ts
similarity index 82%
rename from app/soapbox/utils/base64.js
rename to app/soapbox/utils/base64.ts
index 8226e2c54ec04cba25d120cc9f4b163124e953d8..c512a659423045b3cc028bec1088453b2b30e92d 100644
GIT binary patch
delta 26
hcmey)*vK?NOh6+ku{hPt#7d#Kq$o2lU2~$$Z2)r@2>}2A

delta 16
XcmZo<`p!5(j4dg#IMvK#qS|c$E^r0E

diff --git a/app/soapbox/utils/greentext.js b/app/soapbox/utils/greentext.js
index 543bc2f23f80d693f635e230e34209430d72427f..f60ee7c3c6a590bcd1db051b7de56a3d0e109ce5 100644
GIT binary patch
delta 13
Ucmcb{dYyH{8YV`C$!nOj03}!iq5uE@

delta 11
Scmcc4dX06%8m7r>nX~{Niv)rI

diff --git a/app/soapbox/utils/instance.js b/app/soapbox/utils/instance.js
deleted file mode 100644
index af9d69665dc14dfd0a376a995dfe721684869bed..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 220
zcmYeTD9A4=QAp0uD=tw;Pc8At2hz3*nLuu0UUI5}t(`(Omx4k`Q6-pGP$)_*DJ{xV
z$V)9(2o3VlfGN}i>eWy$Ey`5a)YQuW8e$F9RjZJkSdyFp)rl|z!<2-Kl9GaAD}8;H
dYAgoUCLoMNHxyx1X-*EvPM`vi&0MwCTmXRSL!|%!

diff --git a/app/soapbox/utils/media_aspect_ratio.js b/app/soapbox/utils/media_aspect_ratio.ts
similarity index 70%
rename from app/soapbox/utils/media_aspect_ratio.js
rename to app/soapbox/utils/media_aspect_ratio.ts
index 18e6fdc57236f10b7784b921ae4aedd925a5b960..8821d9debecd4a3cd862884df344576f2d8caafe 100644
GIT binary patch
delta 64
rcmX@k{FHgZR344QA}fWw(%hufBF)K#jCvD~T40Dx)@5`;7YqXc(!CX9

delta 32
hcmaFLe4Kg0RHnqDi3`)fq~T;2Mtd+zZ}MJ74FJ?&3_<_^

diff --git a/app/soapbox/utils/phone.js b/app/soapbox/utils/phone.ts
similarity index 100%
rename from app/soapbox/utils/phone.js
rename to app/soapbox/utils/phone.ts
diff --git a/app/soapbox/utils/status.js b/app/soapbox/utils/status.ts
similarity index 67%
rename from app/soapbox/utils/status.js
rename to app/soapbox/utils/status.ts
index acd69dc5e1987ea7bb0985c8d3b2054b346fc92d..7f2bfe42f6eb0c7247af7b8835b6f0b242597568 100644
GIT binary patch
delta 157
zcmZ3=I)`n7nNwzNL4Hw*LP=#oszS9wa7kiGX|Y0LF_h(+SCUy$sZgtsR+OKspkADx
vSdf%op$}4Bte*;!%uJnVs41pV4Ay9cqD^ySf)67OsmYrd=i`zJXYvC8<sLct

delta 42
mcmbQkwv=^(*~D5Ew&Ie+lG5Uh+kF_J%*m2W^I^<$Onv}TT@UsE

diff --git a/app/soapbox/utils/timelines.js b/app/soapbox/utils/timelines.js
deleted file mode 100644
index d15a4fa88fed85c782820102195d2e2181fcb6e9..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 405
zcmZXPy>5dr6oq%5;&zFRgz^AI?pP^9rjAvG4BSww{z3M2QWWv-wSh)O9ew<LK0eBf
z&J*0>EJu(5PR2x%t;T$w;o_YErhY?K7X^MVM(1oG2%j$M{#9v04+3}~NikH=IUS9C
zLn38|P=a`YdjTolq+3Yz-!7i70X(+a4bQN?a~zO3TQgR|lMrB|*42iNdfJo9HXc*j
zkZV-`&*+uMj`qq`1=T98XiB(91#G2QE}6@;H-Czvw|VO=9D_5+`BmzO6@20J*!JM|
e+w+E#<?n3K+2VYxRTrrP!r=hRYxPz**ToM+YJ`pe

diff --git a/app/soapbox/utils/timelines.ts b/app/soapbox/utils/timelines.ts
new file mode 100644
index 0000000000..03ba960442
--- /dev/null
+++ b/app/soapbox/utils/timelines.ts
@@ -0,0 +1,15 @@
+import { Map as ImmutableMap } from 'immutable';
+
+import type { Status as StatusEntity } from 'soapbox/types/entities';
+
+export const shouldFilter = (status: StatusEntity, columnSettings: any) => {
+  const shows = ImmutableMap({
+    reblog: status.reblog !== null,
+    reply: status.in_reply_to_id !== null,
+    direct: status.visibility === 'direct',
+  });
+
+  return shows.some((value, key) => {
+    return columnSettings.getIn(['shows', key]) === false && value;
+  });
+};
diff --git a/package.json b/package.json
index c14cd88ae4..4caec0c8dd 100644
--- a/package.json
+++ b/package.json
@@ -75,6 +75,7 @@
     "@types/jest": "^27.4.1",
     "@types/lodash": "^4.14.180",
     "@types/qrcode.react": "^1.0.2",
+    "@types/react-datepicker": "^4.4.0",
     "@types/react-helmet": "^6.1.5",
     "@types/react-motion": "^0.0.32",
     "@types/react-router-dom": "^5.3.3",
@@ -145,7 +146,7 @@
     "qrcode.react": "^1.0.0",
     "react": "^16.13.1",
     "react-color": "^2.18.1",
-    "react-datepicker": "^4.6.0",
+    "react-datepicker": "^4.7.0",
     "react-dom": "^16.13.1",
     "react-helmet": "^6.0.0",
     "react-hotkeys": "^1.1.4",
diff --git a/yarn.lock b/yarn.lock
index d86daa8694..9ed45677b1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2171,6 +2171,16 @@
   dependencies:
     "@types/react" "*"
 
+"@types/react-datepicker@^4.4.0":
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/@types/react-datepicker/-/react-datepicker-4.4.0.tgz#0072e18536ad305fd57786f9b6f9e499eed2b475"
+  integrity sha512-wzmevaO51rLFwSZd5HSqBU0aAvZlRRkj6QhHqj0jfRDSKnN3y5IKXyhgxPS8R0LOWOtjdpirI1DBryjnIp/7gA==
+  dependencies:
+    "@popperjs/core" "^2.9.2"
+    "@types/react" "*"
+    date-fns "^2.0.1"
+    react-popper "^2.2.5"
+
 "@types/react-dom@*":
   version "17.0.14"
   resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.14.tgz#c8f917156b652ddf807711f5becbd2ab018dea9f"
@@ -4006,7 +4016,7 @@ data-urls@^2.0.0:
     whatwg-mimetype "^2.3.0"
     whatwg-url "^8.0.0"
 
-date-fns@^2.24.0:
+date-fns@^2.0.1, date-fns@^2.24.0:
   version "2.28.0"
   resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.28.0.tgz#9570d656f5fc13143e50c975a3b6bbeb46cd08b2"
   integrity sha512-8d35hViGYx/QH0icHYCeLmsLmMUheMmTyV9Fcm6gvNwdw31yXXH+O85sOBJ+OLnLQMKZowvpKb6FgMIQjcpvQw==
@@ -8662,7 +8672,7 @@ react-color@^2.18.1:
     reactcss "^1.2.0"
     tinycolor2 "^1.4.1"
 
-react-datepicker@^4.6.0:
+react-datepicker@^4.7.0:
   version "4.7.0"
   resolved "https://registry.yarnpkg.com/react-datepicker/-/react-datepicker-4.7.0.tgz#75e03b0a6718b97b84287933307faf2ed5f03cf4"
   integrity sha512-FS8KgbwqpxmJBv/bUdA42MYqYZa+fEYcpc746DZiHvVE2nhjrW/dg7c5B5fIUuI8gZET6FOzuDgezNcj568Czw==