inex
/
index.community
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update all dependencies

This commit is contained in:
Tao Bojlén 2020-05-19 13:45:27 +00:00
parent 9b9dec818a
commit e532173322
45 changed files with 1625 additions and 2005 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.vscode/extensions.json vendored
View File

@ -1,7 +1,6 @@
{
"recommendations": [
"jakebecker.elixir-ls",
"ms-vscode.vscode-typescript-tslint-plugin",
"kevinmcgowan.typescriptimport",
"msjsdiag.debugger-for-chrome"
]

120
backend/mix.lock
View File

@ -1,66 +1,66 @@
%{
"appsignal": {:hex, :appsignal, "1.10.13", "d5df34ac7dc2d937510716f2089cc5f1d45b3f10f38225d19c35f31810b9266d", [:make, :mix], [{:decorator, "~> 1.2.3", [hex: :decorator, repo: "hexpm", optional: false]}, {:hackney, "~> 1.6", [hex: :hackney, repo: "hexpm", optional: false]}, {:phoenix, ">= 1.2.0", [hex: :phoenix, repo: "hexpm", optional: true]}, {:plug, ">= 1.1.0", [hex: :plug, repo: "hexpm", optional: true]}, {:poison, ">= 1.3.0", [hex: :poison, repo: "hexpm", optional: false]}], "hexpm"},
"appsignal": {:hex, :appsignal, "1.10.1", "582238fd95cef54d1440ce9b2ef47c243e7d176200156164b2d924c29c7cef24", [:make, :mix], [{:decorator, "~> 1.2.3", [hex: :decorator, repo: "hexpm", optional: false]}, {:hackney, "~> 1.6", [hex: :hackney, repo: "hexpm", optional: false]}, {:phoenix, ">= 1.2.0", [hex: :phoenix, repo: "hexpm", optional: true]}, {:plug, ">= 1.1.0", [hex: :plug, repo: "hexpm", optional: true]}, {:poison, ">= 1.3.0", [hex: :poison, repo: "hexpm", optional: false]}], "hexpm", "686bf26b678d958a366215923de605492f99ca6ad7715a89a4abaf9caf6ea45d"},
"artificery": {:hex, :artificery, "0.4.2", "3ded6e29e13113af52811c72f414d1e88f711410cac1b619ab3a2666bbd7efd4", [:mix], [], "hexpm"},
"base64url": {:hex, :base64url, "0.0.1", "36a90125f5948e3afd7be97662a1504b934dd5dac78451ca6e9abf85a10286be", [:rebar], [], "hexpm"},
"bunt": {:hex, :bunt, "0.2.0", "951c6e801e8b1d2cbe58ebbd3e616a869061ddadcc4863d0a2182541acae9a38", [:mix], [], "hexpm"},
"certifi": {:hex, :certifi, "2.5.1", "867ce347f7c7d78563450a18a6a28a8090331e77fa02380b4a21962a65d36ee5", [:rebar3], [{:parse_trans, "~>3.3", [hex: :parse_trans, repo: "hexpm", optional: false]}], "hexpm"},
"combine": {:hex, :combine, "0.10.0", "eff8224eeb56498a2af13011d142c5e7997a80c8f5b97c499f84c841032e429f", [:mix], [], "hexpm"},
"connection": {:hex, :connection, "1.0.4", "a1cae72211f0eef17705aaededacac3eb30e6625b04a6117c1b2db6ace7d5976", [:mix], [], "hexpm"},
"corsica": {:hex, :corsica, "1.1.3", "5f1de40bc9285753aa03afbdd10c364dac79b2ddbf2ba9c5c9c47b397ec06f40", [:mix], [{:plug, "~> 1.0", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm"},
"cowboy": {:hex, :cowboy, "2.7.0", "91ed100138a764355f43316b1d23d7ff6bdb0de4ea618cb5d8677c93a7a2f115", [:rebar3], [{:cowlib, "~> 2.8.0", [hex: :cowlib, repo: "hexpm", optional: false]}, {:ranch, "~> 1.7.1", [hex: :ranch, repo: "hexpm", optional: false]}], "hexpm"},
"cowlib": {:hex, :cowlib, "2.8.0", "fd0ff1787db84ac415b8211573e9a30a3ebe71b5cbff7f720089972b2319c8a4", [:rebar3], [], "hexpm"},
"credo": {:hex, :credo, "1.3.2", "08d456dcf3c24da162d02953fb07267e444469d8dad3a2ae47794938ea467b3a", [:mix], [{:bunt, "~> 0.2.0", [hex: :bunt, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}], "hexpm"},
"crontab": {:hex, :crontab, "1.1.10", "dc9bb1f4299138d47bce38341f5dcbee0aa6c205e864fba7bc847f3b5cb48241", [:mix], [{:ecto, "~> 1.0 or ~> 2.0 or ~> 3.0", [hex: :ecto, repo: "hexpm", optional: true]}], "hexpm"},
"db_connection": {:hex, :db_connection, "2.2.1", "caee17725495f5129cb7faebde001dc4406796f12a62b8949f4ac69315080566", [:mix], [{:connection, "~> 1.0.2", [hex: :connection, repo: "hexpm", optional: false]}], "hexpm"},
"decimal": {:hex, :decimal, "1.8.1", "a4ef3f5f3428bdbc0d35374029ffcf4ede8533536fa79896dd450168d9acdf3c", [:mix], [], "hexpm"},
"decorator": {:hex, :decorator, "1.2.4", "31dfff6143d37f0b68d0bffb3b9f18ace14fea54d4f1b5e4f86ead6f00d9ff6e", [:mix], [], "hexpm"},
"bunt": {:hex, :bunt, "0.2.0", "951c6e801e8b1d2cbe58ebbd3e616a869061ddadcc4863d0a2182541acae9a38", [:mix], [], "hexpm", "7af5c7e09fe1d40f76c8e4f9dd2be7cebd83909f31fee7cd0e9eadc567da8353"},
"certifi": {:hex, :certifi, "2.5.1", "867ce347f7c7d78563450a18a6a28a8090331e77fa02380b4a21962a65d36ee5", [:rebar3], [{:parse_trans, "~>3.3", [hex: :parse_trans, repo: "hexpm", optional: false]}], "hexpm", "805abd97539caf89ec6d4732c91e62ba9da0cda51ac462380bbd28ee697a8c42"},
"combine": {:hex, :combine, "0.10.0", "eff8224eeb56498a2af13011d142c5e7997a80c8f5b97c499f84c841032e429f", [:mix], [], "hexpm", "1b1dbc1790073076580d0d1d64e42eae2366583e7aecd455d1215b0d16f2451b"},
"connection": {:hex, :connection, "1.0.4", "a1cae72211f0eef17705aaededacac3eb30e6625b04a6117c1b2db6ace7d5976", [:mix], [], "hexpm", "4a0850c9be22a43af9920a71ab17c051f5f7d45c209e40269a1938832510e4d9"},
"corsica": {:hex, :corsica, "1.1.3", "5f1de40bc9285753aa03afbdd10c364dac79b2ddbf2ba9c5c9c47b397ec06f40", [:mix], [{:plug, "~> 1.0", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm", "8156b3a14a114a346262871333a931a1766b2597b56bf994fcfcb65443a348ad"},
"cowboy": {:hex, :cowboy, "2.7.0", "91ed100138a764355f43316b1d23d7ff6bdb0de4ea618cb5d8677c93a7a2f115", [:rebar3], [{:cowlib, "~> 2.8.0", [hex: :cowlib, repo: "hexpm", optional: false]}, {:ranch, "~> 1.7.1", [hex: :ranch, repo: "hexpm", optional: false]}], "hexpm", "04fd8c6a39edc6aaa9c26123009200fc61f92a3a94f3178c527b70b767c6e605"},
"cowlib": {:hex, :cowlib, "2.8.0", "fd0ff1787db84ac415b8211573e9a30a3ebe71b5cbff7f720089972b2319c8a4", [:rebar3], [], "hexpm", "79f954a7021b302186a950a32869dbc185523d99d3e44ce430cd1f3289f41ed4"},
"credo": {:hex, :credo, "1.4.0", "92339d4cbadd1e88b5ee43d427b639b68a11071b6f73854e33638e30a0ea11f5", [:mix], [{:bunt, "~> 0.2.0", [hex: :bunt, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}], "hexpm", "1fd3b70dce216574ce3c18bdf510b57e7c4c85c2ec9cad4bff854abaf7e58658"},
"crontab": {:hex, :crontab, "1.1.10", "dc9bb1f4299138d47bce38341f5dcbee0aa6c205e864fba7bc847f3b5cb48241", [:mix], [{:ecto, "~> 1.0 or ~> 2.0 or ~> 3.0", [hex: :ecto, repo: "hexpm", optional: true]}], "hexpm", "1347d889d1a0eda997990876b4894359e34bfbbd688acbb0ba28a2795ca40685"},
"db_connection": {:hex, :db_connection, "2.2.2", "3bbca41b199e1598245b716248964926303b5d4609ff065125ce98bcd368939e", [:mix], [{:connection, "~> 1.0.2", [hex: :connection, repo: "hexpm", optional: false]}], "hexpm", "642af240d8a8affb93b4ba5a6fcd2bbcbdc327e1a524b825d383711536f8070c"},
"decimal": {:hex, :decimal, "1.8.1", "a4ef3f5f3428bdbc0d35374029ffcf4ede8533536fa79896dd450168d9acdf3c", [:mix], [], "hexpm", "3cb154b00225ac687f6cbd4acc4b7960027c757a5152b369923ead9ddbca7aec"},
"decorator": {:hex, :decorator, "1.2.4", "31dfff6143d37f0b68d0bffb3b9f18ace14fea54d4f1b5e4f86ead6f00d9ff6e", [:mix], [], "hexpm", "6c393a3aada02d0eaa6bde725e1816d2b122d7d0fb06c6dd8ebd92d33826396b"},
"distillery": {:hex, :distillery, "2.1.1", "f9332afc2eec8a1a2b86f22429e068ef35f84a93ea1718265e740d90dd367814", [:mix], [{:artificery, "~> 0.2", [hex: :artificery, repo: "hexpm", optional: false]}], "hexpm"},
"ecto": {:hex, :ecto, "3.4.2", "6890af71025769bd27ef62b1ed1925cfe23f7f0460bcb3041da4b705215ff23e", [:mix], [{:decimal, "~> 1.6 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm"},
"ecto_sql": {:hex, :ecto_sql, "3.4.2", "3d842665a81ba2137b62aa70151afe81dae44824cd09b2076a255937ab4e2dc9", [:mix], [{:db_connection, "~> 2.2", [hex: :db_connection, repo: "hexpm", optional: false]}, {:ecto, "~> 3.4.0", [hex: :ecto, repo: "hexpm", optional: false]}, {:myxql, "~> 0.3.0 or ~> 0.4.0", [hex: :myxql, repo: "hexpm", optional: true]}, {:postgrex, "~> 0.15.0", [hex: :postgrex, repo: "hexpm", optional: true]}, {:tds, "~> 2.1.0", [hex: :tds, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm"},
"elasticsearch": {:hex, :elasticsearch, "1.0.0", "626d3fb8e7554d9c93eb18817ae2a3d22c2a4191cc903c4644b1334469b15374", [:mix], [{:httpoison, ">= 0.0.0", [hex: :httpoison, repo: "hexpm", optional: false]}, {:poison, ">= 0.0.0", [hex: :poison, repo: "hexpm", optional: true]}, {:sigaws, "~> 0.7", [hex: :sigaws, repo: "hexpm", optional: true]}, {:vex, "~> 0.6.0", [hex: :vex, repo: "hexpm", optional: false]}], "hexpm"},
"ex_twilio": {:hex, :ex_twilio, "0.7.0", "d7ce624ef4661311ae28c3e3aa060ecb66a9f4843184d7400c29072f7d3f5a4a", [:mix], [{:httpoison, ">= 0.9.0", [hex: :httpoison, repo: "hexpm", optional: false]}, {:inflex, "~> 1.0", [hex: :inflex, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:joken, "~> 2.0", [hex: :joken, repo: "hexpm", optional: false]}, {:poison, "~> 3.0", [hex: :poison, repo: "hexpm", optional: false]}], "hexpm"},
"gen_stage": {:hex, :gen_stage, "1.0.0", "51c8ae56ff54f9a2a604ca583798c210ad245f415115453b773b621c49776df5", [:mix], [], "hexpm"},
"gen_state_machine": {:hex, :gen_state_machine, "2.1.0", "a38b0e53fad812d29ec149f0d354da5d1bc0d7222c3711f3a0bd5aa608b42992", [:mix], [], "hexpm"},
"gettext": {:hex, :gettext, "0.17.4", "f13088e1ec10ce01665cf25f5ff779e7df3f2dc71b37084976cf89d1aa124d5c", [:mix], [], "hexpm"},
"gollum": {:hex, :gollum, "0.3.3", "25ebb47700b9236bc4e5382bf91b72e4cdaf9bae3556172eff27e770735a198f", [:mix], [{:httpoison, "~> 1.5.1", [hex: :httpoison, repo: "hexpm", optional: false]}], "hexpm"},
"hackney": {:hex, :hackney, "1.15.2", "07e33c794f8f8964ee86cebec1a8ed88db5070e52e904b8f12209773c1036085", [:rebar3], [{:certifi, "2.5.1", [hex: :certifi, repo: "hexpm", optional: false]}, {:idna, "6.0.0", [hex: :idna, repo: "hexpm", optional: false]}, {:metrics, "1.0.1", [hex: :metrics, repo: "hexpm", optional: false]}, {:mimerl, "~>1.1", [hex: :mimerl, repo: "hexpm", optional: false]}, {:ssl_verify_fun, "1.1.5", [hex: :ssl_verify_fun, repo: "hexpm", optional: false]}], "hexpm"},
"honeydew": {:hex, :honeydew, "1.4.5", "03818730602274ef0119652d664b92ddf733256e857d29899ce6841e01345bd1", [:mix], [{:ecto, "~> 3.0", [hex: :ecto, repo: "hexpm", optional: true]}], "hexpm"},
"httpoison": {:hex, :httpoison, "1.5.1", "0f55b5b673b03c5c327dac7015a67cb571b99b631acc0bc1b0b98dcd6b9f2104", [:mix], [{:hackney, "~> 1.8", [hex: :hackney, repo: "hexpm", optional: false]}], "hexpm"},
"hunter": {:hex, :hunter, "0.5.1", "374dc4a800e2c340659657f8875e466075c7ea532e0d7a7787665f272b410150", [:mix], [{:httpoison, "~> 1.5", [hex: :httpoison, repo: "hexpm", optional: false]}, {:poison, "~> 4.0", [hex: :poison, repo: "hexpm", optional: false]}], "hexpm"},
"idna": {:hex, :idna, "5.1.2", "e21cb58a09f0228a9e0b95eaa1217f1bcfc31a1aaa6e1fdf2f53a33f7dbd9494", [:rebar3], [{:unicode_util_compat, "0.3.1", [hex: :unicode_util_compat, repo: "hexpm", optional: false]}], "hexpm"},
"inflex": {:hex, :inflex, "1.10.0", "8366a7696e70e1813aca102e61274addf85d99f4a072b2f9c7984054ea1b9d29", [:mix], [], "hexpm"},
"jason": {:hex, :jason, "1.2.0", "10043418c42d2493d0ee212d3fddd25d7ffe484380afad769a0a38795938e448", [:mix], [{:decimal, "~> 1.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm"},
"joken": {:hex, :joken, "2.2.0", "2daa1b12be05184aff7b5ace1d43ca1f81345962285fff3f88db74927c954d3a", [:mix], [{:jose, "~> 1.9", [hex: :jose, repo: "hexpm", optional: false]}], "hexpm"},
"jose": {:hex, :jose, "1.10.1", "16d8e460dae7203c6d1efa3f277e25b5af8b659febfc2f2eb4bacf87f128b80a", [:mix, :rebar3], [], "hexpm"},
"libring": {:hex, :libring, "1.5.0", "44313eb6862f5c9168594a061e9d5f556a9819da7c6444706a9e2da533396d70", [:mix], [], "hexpm"},
"metrics": {:hex, :metrics, "1.0.1", "25f094dea2cda98213cecc3aeff09e940299d950904393b2a29d191c346a8486", [:rebar3], [], "hexpm"},
"mime": {:hex, :mime, "1.3.1", "30ce04ab3175b6ad0bdce0035cba77bba68b813d523d1aac73d9781b4d193cf8", [:mix], [], "hexpm"},
"mimerl": {:hex, :mimerl, "1.2.0", "67e2d3f571088d5cfd3e550c383094b47159f3eee8ffa08e64106cdf5e981be3", [:rebar3], [], "hexpm"},
"nebulex": {:hex, :nebulex, "1.1.1", "4117e18e614ecbd078e19558b7b9c58f11d666c4dca584b9382b02913f13ad8a", [:mix], [{:shards, "~> 0.6", [hex: :shards, repo: "hexpm", optional: false]}], "hexpm"},
"ecto": {:hex, :ecto, "3.4.4", "a2c881e80dc756d648197ae0d936216c0308370332c5e77a2325a10293eef845", [:mix], [{:decimal, "~> 1.6 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "cc4bd3ad62abc3b21fb629f0f7a3dab23a192fca837d257dd08449fba7373561"},
"ecto_sql": {:hex, :ecto_sql, "3.4.3", "c552aa8a7ccff2b64024f835503b3155d8e73452c180298527fbdbcd6e79710b", [:mix], [{:db_connection, "~> 2.2", [hex: :db_connection, repo: "hexpm", optional: false]}, {:ecto, "~> 3.4.3", [hex: :ecto, repo: "hexpm", optional: false]}, {:myxql, "~> 0.3.0 or ~> 0.4.0", [hex: :myxql, repo: "hexpm", optional: true]}, {:postgrex, "~> 0.15.0", [hex: :postgrex, repo: "hexpm", optional: true]}, {:tds, "~> 2.1.0", [hex: :tds, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "ec9e59d6fa3f8cfda9963ada371e9e6659167c2338a997bd7ea23b10b245842b"},
"elasticsearch": {:hex, :elasticsearch, "1.0.0", "626d3fb8e7554d9c93eb18817ae2a3d22c2a4191cc903c4644b1334469b15374", [:mix], [{:httpoison, ">= 0.0.0", [hex: :httpoison, repo: "hexpm", optional: false]}, {:poison, ">= 0.0.0", [hex: :poison, repo: "hexpm", optional: true]}, {:sigaws, "~> 0.7", [hex: :sigaws, repo: "hexpm", optional: true]}, {:vex, "~> 0.6.0", [hex: :vex, repo: "hexpm", optional: false]}], "hexpm", "9fa0b717ad57a54c28451b3eb10c5121211c29a7b33615d2bcc7e2f3c9418b2e"},
"ex_twilio": {:hex, :ex_twilio, "0.7.0", "d7ce624ef4661311ae28c3e3aa060ecb66a9f4843184d7400c29072f7d3f5a4a", [:mix], [{:httpoison, ">= 0.9.0", [hex: :httpoison, repo: "hexpm", optional: false]}, {:inflex, "~> 1.0", [hex: :inflex, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:joken, "~> 2.0", [hex: :joken, repo: "hexpm", optional: false]}, {:poison, "~> 3.0", [hex: :poison, repo: "hexpm", optional: false]}], "hexpm", "6be84f1508ed47d443d18cdc4ea0561f8ad4095b69791dd9be5f2fe14b1dafc5"},
"gen_stage": {:hex, :gen_stage, "1.0.0", "51c8ae56ff54f9a2a604ca583798c210ad245f415115453b773b621c49776df5", [:mix], [], "hexpm", "1d9fc978db5305ac54e6f5fec7adf80cd893b1000cf78271564c516aa2af7706"},
"gen_state_machine": {:hex, :gen_state_machine, "2.1.0", "a38b0e53fad812d29ec149f0d354da5d1bc0d7222c3711f3a0bd5aa608b42992", [:mix], [], "hexpm", "ae367038808db25cee2f2c4b8d0531522ea587c4995eb6f96ee73410a60fa06b"},
"gettext": {:hex, :gettext, "0.18.0", "406d6b9e0e3278162c2ae1de0a60270452c553536772167e2d701f028116f870", [:mix], [], "hexpm", "c3f850be6367ebe1a08616c2158affe4a23231c70391050bf359d5f92f66a571"},
"gollum": {:hex, :gollum, "0.3.3", "25ebb47700b9236bc4e5382bf91b72e4cdaf9bae3556172eff27e770735a198f", [:mix], [{:httpoison, "~> 1.5.1", [hex: :httpoison, repo: "hexpm", optional: false]}], "hexpm", "39268eeaf4f0adb6fdebe4f8c36b10a277881ab2eee3419c9b6727759e2f5a5d"},
"hackney": {:hex, :hackney, "1.15.2", "07e33c794f8f8964ee86cebec1a8ed88db5070e52e904b8f12209773c1036085", [:rebar3], [{:certifi, "2.5.1", [hex: :certifi, repo: "hexpm", optional: false]}, {:idna, "6.0.0", [hex: :idna, repo: "hexpm", optional: false]}, {:metrics, "1.0.1", [hex: :metrics, repo: "hexpm", optional: false]}, {:mimerl, "~>1.1", [hex: :mimerl, repo: "hexpm", optional: false]}, {:ssl_verify_fun, "1.1.5", [hex: :ssl_verify_fun, repo: "hexpm", optional: false]}], "hexpm", "e0100f8ef7d1124222c11ad362c857d3df7cb5f4204054f9f0f4a728666591fc"},
"honeydew": {:hex, :honeydew, "1.4.5", "03818730602274ef0119652d664b92ddf733256e857d29899ce6841e01345bd1", [:mix], [{:ecto, "~> 3.0", [hex: :ecto, repo: "hexpm", optional: true]}], "hexpm", "62633858ce7e82f67689b4d2b4024bd87fa00dc6a11a227614b816d868a1529d"},
"httpoison": {:hex, :httpoison, "1.5.1", "0f55b5b673b03c5c327dac7015a67cb571b99b631acc0bc1b0b98dcd6b9f2104", [:mix], [{:hackney, "~> 1.8", [hex: :hackney, repo: "hexpm", optional: false]}], "hexpm", "191a3b6329c917de4e7ca68431919a59bf19e60694b313a69bc1f56a4cb160bf"},
"hunter": {:hex, :hunter, "0.5.1", "374dc4a800e2c340659657f8875e466075c7ea532e0d7a7787665f272b410150", [:mix], [{:httpoison, "~> 1.5", [hex: :httpoison, repo: "hexpm", optional: false]}, {:poison, "~> 4.0", [hex: :poison, repo: "hexpm", optional: false]}], "hexpm", "209b2cca7e4d51d5ff7ee4a0ab6cdc4c6ad23ddd61c9e12ceeee6f7ffbeae9c8"},
"idna": {:hex, :idna, "5.1.2", "e21cb58a09f0228a9e0b95eaa1217f1bcfc31a1aaa6e1fdf2f53a33f7dbd9494", [:rebar3], [{:unicode_util_compat, "0.3.1", [hex: :unicode_util_compat, repo: "hexpm", optional: false]}], "hexpm", "8fddb3aec4692c71647d67de72536254bce9069851754e370a99f2aae69fbdf4"},
"inflex": {:hex, :inflex, "1.10.0", "8366a7696e70e1813aca102e61274addf85d99f4a072b2f9c7984054ea1b9d29", [:mix], [], "hexpm", "7b5ccb9b720c26516f5962dc4565fc26f083ca107b0f6c167048506a125d2df3"},
"jason": {:hex, :jason, "1.2.1", "12b22825e22f468c02eb3e4b9985f3d0cb8dc40b9bd704730efa11abd2708c44", [:mix], [{:decimal, "~> 1.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm", "b659b8571deedf60f79c5a608e15414085fa141344e2716fbd6988a084b5f993"},
"joken": {:hex, :joken, "2.2.0", "2daa1b12be05184aff7b5ace1d43ca1f81345962285fff3f88db74927c954d3a", [:mix], [{:jose, "~> 1.9", [hex: :jose, repo: "hexpm", optional: false]}], "hexpm", "b4f92e30388206f869dd25d1af628a1d99d7586e5cf0672f64d4df84c4d2f5e9"},
"jose": {:hex, :jose, "1.10.1", "16d8e460dae7203c6d1efa3f277e25b5af8b659febfc2f2eb4bacf87f128b80a", [:mix, :rebar3], [], "hexpm", "3c7ddc8a9394b92891db7c2771da94bf819834a1a4c92e30857b7d582e2f8257"},
"libring": {:hex, :libring, "1.5.0", "44313eb6862f5c9168594a061e9d5f556a9819da7c6444706a9e2da533396d70", [:mix], [], "hexpm", "04e843d4fdcff49a62d8e03778d17c6cb2a03fe2d14020d3825a1761b55bd6cc"},
"metrics": {:hex, :metrics, "1.0.1", "25f094dea2cda98213cecc3aeff09e940299d950904393b2a29d191c346a8486", [:rebar3], [], "hexpm", "69b09adddc4f74a40716ae54d140f93beb0fb8978d8636eaded0c31b6f099f16"},
"mime": {:hex, :mime, "1.3.1", "30ce04ab3175b6ad0bdce0035cba77bba68b813d523d1aac73d9781b4d193cf8", [:mix], [], "hexpm", "6cbe761d6a0ca5a31a0931bf4c63204bceb64538e664a8ecf784a9a6f3b875f1"},
"mimerl": {:hex, :mimerl, "1.2.0", "67e2d3f571088d5cfd3e550c383094b47159f3eee8ffa08e64106cdf5e981be3", [:rebar3], [], "hexpm", "f278585650aa581986264638ebf698f8bb19df297f66ad91b18910dfc6e19323"},
"nebulex": {:hex, :nebulex, "1.1.1", "4117e18e614ecbd078e19558b7b9c58f11d666c4dca584b9382b02913f13ad8a", [:mix], [{:shards, "~> 0.6", [hex: :shards, repo: "hexpm", optional: false]}], "hexpm", "cf3a04f9bfb8fcb8f070ab049c3fab54dd31c72d13430360a1c908c3cacb9196"},
"paginator": {:hex, :paginator, "0.6.0", "bc2c01abdd98281ff39b6a7439cf540091122a7927bdaabc167c61d4508f9cbb", [:mix], [{:ecto, "~> 3.0", [hex: :ecto, repo: "hexpm", optional: false]}, {:ecto_sql, "~> 3.0", [hex: :ecto_sql, repo: "hexpm", optional: false]}, {:postgrex, "~> 0.13", [hex: :postgrex, repo: "hexpm", optional: true]}], "hexpm"},
"parse_trans": {:hex, :parse_trans, "3.3.0", "09765507a3c7590a784615cfd421d101aec25098d50b89d7aa1d66646bc571c1", [:rebar3], [], "hexpm"},
"phoenix": {:hex, :phoenix, "1.4.16", "2cbbe0c81e6601567c44cc380c33aa42a1372ac1426e3de3d93ac448a7ec4308", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 1.1", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:plug, "~> 1.8.1 or ~> 1.9", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 1.0 or ~> 2.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm"},
"phoenix_ecto": {:hex, :phoenix_ecto, "4.1.0", "a044d0756d0464c5a541b4a0bf4bcaf89bffcaf92468862408290682c73ae50d", [:mix], [{:ecto, "~> 3.0", [hex: :ecto, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 2.9", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:plug, "~> 1.0", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm"},
"phoenix_pubsub": {:hex, :phoenix_pubsub, "1.1.2", "496c303bdf1b2e98a9d26e89af5bba3ab487ba3a3735f74bf1f4064d2a845a3e", [:mix], [], "hexpm"},
"plug": {:hex, :plug, "1.10.0", "6508295cbeb4c654860845fb95260737e4a8838d34d115ad76cd487584e2fc4d", [:mix], [{:mime, "~> 1.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.1.1 or ~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: true]}], "hexpm"},
"plug_cowboy": {:hex, :plug_cowboy, "2.1.3", "38999a3e85e39f0e6bdfdf820761abac61edde1632cfebbacc445cdcb6ae1333", [:mix], [{:cowboy, "~> 2.5", [hex: :cowboy, repo: "hexpm", optional: false]}, {:plug, "~> 1.7", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm"},
"plug_crypto": {:hex, :plug_crypto, "1.1.2", "bdd187572cc26dbd95b87136290425f2b580a116d3fb1f564216918c9730d227", [:mix], [], "hexpm"},
"poison": {:hex, :poison, "4.0.1", "bcb755a16fac91cad79bfe9fc3585bb07b9331e50cfe3420a24bcc2d735709ae", [:mix], [], "hexpm"},
"postgrex": {:hex, :postgrex, "0.15.3", "5806baa8a19a68c4d07c7a624ccdb9b57e89cbc573f1b98099e3741214746ae4", [:mix], [{:connection, "~> 1.0", [hex: :connection, repo: "hexpm", optional: false]}, {:db_connection, "~> 2.1", [hex: :db_connection, repo: "hexpm", optional: false]}, {:decimal, "~> 1.5", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}], "hexpm"},
"public_suffix": {:hex, :public_suffix, "0.6.0", "100cfe86f13f9f6f0cf67e743b1b83c78dd1223a2c422fa03ebf4adff514cbc3", [:mix], [{:idna, ">= 1.2.0 and < 6.0.0", [hex: :idna, repo: "hexpm", optional: false]}], "hexpm"},
"quantum": {:hex, :quantum, "2.4.0", "f2ad4b20988f848455d35ed0e884ba0c7629a27ee86cbec6a6e0fc214b6e69cf", [:mix], [{:calendar, "~> 0.17", [hex: :calendar, repo: "hexpm", optional: true]}, {:crontab, "~> 1.1", [hex: :crontab, repo: "hexpm", optional: false]}, {:gen_stage, "~> 0.12 or ~> 1.0", [hex: :gen_stage, repo: "hexpm", optional: false]}, {:swarm, "~> 3.3", [hex: :swarm, repo: "hexpm", optional: false]}, {:timex, "~> 3.1", [hex: :timex, repo: "hexpm", optional: true]}, {:tzdata, "~> 1.0", [hex: :tzdata, repo: "hexpm", optional: true]}], "hexpm"},
"ranch": {:hex, :ranch, "1.7.1", "6b1fab51b49196860b733a49c07604465a47bdb78aa10c1c16a3d199f7f8c881", [:rebar3], [], "hexpm"},
"recase": {:hex, :recase, "0.6.0", "1dd2dd2f4e06603b74977630e739f08b7fedbb9420cc14de353666c2fc8b99f4", [:mix], [], "hexpm"},
"scrivener": {:hex, :scrivener, "2.7.0", "fa94cdea21fad0649921d8066b1833d18d296217bfdf4a5389a2f45ee857b773", [:mix], [], "hexpm"},
"scrivener_ecto": {:hex, :scrivener_ecto, "2.3.0", "057f9dd3c77315f0a470263c3565353860d0294404aed611b3524c6df9044189", [:mix], [{:ecto, "~> 3.3", [hex: :ecto, repo: "hexpm", optional: false]}, {:scrivener, "~> 2.4", [hex: :scrivener, repo: "hexpm", optional: false]}], "hexpm"},
"shards": {:hex, :shards, "0.6.2", "e05d05537883220c3b8a8f9d40d5c8ba7ff6064c63ebb6b23046972f6863b2d1", [:make, :rebar3], [], "hexpm"},
"sobelow": {:hex, :sobelow, "0.10.1", "7ddd72eacd3cff0d8ebaaa7825a11718652d264a8c1b97fe802d09634c955db5", [:mix], [], "hexpm"},
"ssl_verify_fun": {:hex, :ssl_verify_fun, "1.1.5", "6eaf7ad16cb568bb01753dbbd7a95ff8b91c7979482b95f38443fe2c8852a79b", [:make, :mix, :rebar3], [], "hexpm"},
"swarm": {:hex, :swarm, "3.4.0", "64f8b30055d74640d2186c66354b33b999438692a91be275bb89cdc7e401f448", [:mix], [{:gen_state_machine, "~> 2.0", [hex: :gen_state_machine, repo: "hexpm", optional: false]}, {:libring, "~> 1.0", [hex: :libring, repo: "hexpm", optional: false]}], "hexpm"},
"swoosh": {:hex, :swoosh, "0.23.5", "bfd9404bbf5069b1be2ffd317923ce57e58b332e25dbca2a35dedd7820dfee5a", [:mix], [{:cowboy, "~> 1.0.1 or ~> 1.1 or ~> 2.4", [hex: :cowboy, repo: "hexpm", optional: true]}, {:gen_smtp, "~> 0.13", [hex: :gen_smtp, repo: "hexpm", optional: true]}, {:hackney, "~> 1.9", [hex: :hackney, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:mail, "~> 0.2", [hex: :mail, repo: "hexpm", optional: true]}, {:mime, "~> 1.1", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_cowboy, ">= 1.0.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}], "hexpm"},
"telemetry": {:hex, :telemetry, "0.4.1", "ae2718484892448a24470e6aa341bc847c3277bfb8d4e9289f7474d752c09c7f", [:rebar3], [], "hexpm"},
"timex": {:hex, :timex, "3.6.1", "efdf56d0e67a6b956cc57774353b0329c8ab7726766a11547e529357ffdc1d56", [:mix], [{:combine, "~> 0.10", [hex: :combine, repo: "hexpm", optional: false]}, {:gettext, "~> 0.10", [hex: :gettext, repo: "hexpm", optional: false]}, {:tzdata, "~> 0.1.8 or ~> 0.5 or ~> 1.0.0", [hex: :tzdata, repo: "hexpm", optional: false]}], "hexpm"},
"tzdata": {:hex, :tzdata, "1.0.3", "73470ad29dde46e350c60a66e6b360d3b99d2d18b74c4c349dbebbc27a09a3eb", [:mix], [{:hackney, "~> 1.0", [hex: :hackney, repo: "hexpm", optional: false]}], "hexpm"},
"unicode_util_compat": {:hex, :unicode_util_compat, "0.3.1", "a1f612a7b512638634a603c8f401892afbf99b8ce93a45041f8aaca99cadb85e", [:rebar3], [], "hexpm"},
"vex": {:hex, :vex, "0.6.0", "4e79b396b2ec18cd909eed0450b19108d9631842598d46552dc05031100b7a56", [:mix], [], "hexpm"},
"parse_trans": {:hex, :parse_trans, "3.3.0", "09765507a3c7590a784615cfd421d101aec25098d50b89d7aa1d66646bc571c1", [:rebar3], [], "hexpm", "17ef63abde837ad30680ea7f857dd9e7ced9476cdd7b0394432af4bfc241b960"},
"phoenix": {:hex, :phoenix, "1.4.17", "1b1bd4cff7cfc87c94deaa7d60dd8c22e04368ab95499483c50640ef3bd838d8", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 1.1", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:plug, "~> 1.8.1 or ~> 1.9", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 1.0 or ~> 2.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "3a8e5d7a3d76d452bb5fb86e8b7bd115f737e4f8efe202a463d4aeb4a5809611"},
"phoenix_ecto": {:hex, :phoenix_ecto, "4.1.0", "a044d0756d0464c5a541b4a0bf4bcaf89bffcaf92468862408290682c73ae50d", [:mix], [{:ecto, "~> 3.0", [hex: :ecto, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 2.9", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:plug, "~> 1.0", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm", "c5e666a341ff104d0399d8f0e4ff094559b2fde13a5985d4cb5023b2c2ac558b"},
"phoenix_pubsub": {:hex, :phoenix_pubsub, "1.1.2", "496c303bdf1b2e98a9d26e89af5bba3ab487ba3a3735f74bf1f4064d2a845a3e", [:mix], [], "hexpm", "1f13f9f0f3e769a667a6b6828d29dec37497a082d195cc52dbef401a9b69bf38"},
"plug": {:hex, :plug, "1.10.1", "c56a6d9da7042d581159bcbaef873ba9d87f15dce85420b0d287bca19f40f9bd", [:mix], [{:mime, "~> 1.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.1.1 or ~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: true]}], "hexpm", "b5cd52259817eb8a31f2454912ba1cff4990bca7811918878091cb2ab9e52cb8"},
"plug_cowboy": {:hex, :plug_cowboy, "2.2.1", "fcf58aa33227a4322a050e4783ee99c63c031a2e7f9a2eb7340d55505e17f30f", [:mix], [{:cowboy, "~> 2.7", [hex: :cowboy, repo: "hexpm", optional: false]}, {:plug, "~> 1.7", [hex: :plug, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "3b43de24460d87c0971887286e7a20d40462e48eb7235954681a20cee25ddeb6"},
"plug_crypto": {:hex, :plug_crypto, "1.1.2", "bdd187572cc26dbd95b87136290425f2b580a116d3fb1f564216918c9730d227", [:mix], [], "hexpm", "6b8b608f895b6ffcfad49c37c7883e8df98ae19c6a28113b02aa1e9c5b22d6b5"},
"poison": {:hex, :poison, "4.0.1", "bcb755a16fac91cad79bfe9fc3585bb07b9331e50cfe3420a24bcc2d735709ae", [:mix], [], "hexpm", "ba8836feea4b394bb718a161fc59a288fe0109b5006d6bdf97b6badfcf6f0f25"},
"postgrex": {:hex, :postgrex, "0.15.4", "5d691c25fc79070705a2ff0e35ce0822b86a0ee3c6fdb7a4fb354623955e1aed", [:mix], [{:connection, "~> 1.0", [hex: :connection, repo: "hexpm", optional: false]}, {:db_connection, "~> 2.1", [hex: :db_connection, repo: "hexpm", optional: false]}, {:decimal, "~> 1.5", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}], "hexpm", "306515b9d975fcb2478dc337a1d27dc3bf8af7cd71017c333fe9db3a3d211b0a"},
"public_suffix": {:hex, :public_suffix, "0.6.0", "100cfe86f13f9f6f0cf67e743b1b83c78dd1223a2c422fa03ebf4adff514cbc3", [:mix], [{:idna, ">= 1.2.0 and < 6.0.0", [hex: :idna, repo: "hexpm", optional: false]}], "hexpm", "663f29209e7930680cb1656cf144cc7484b37fe261f4417fec280d9a20363bfc"},
"quantum": {:hex, :quantum, "2.4.0", "f2ad4b20988f848455d35ed0e884ba0c7629a27ee86cbec6a6e0fc214b6e69cf", [:mix], [{:calendar, "~> 0.17", [hex: :calendar, repo: "hexpm", optional: true]}, {:crontab, "~> 1.1", [hex: :crontab, repo: "hexpm", optional: false]}, {:gen_stage, "~> 0.12 or ~> 1.0", [hex: :gen_stage, repo: "hexpm", optional: false]}, {:swarm, "~> 3.3", [hex: :swarm, repo: "hexpm", optional: false]}, {:timex, "~> 3.1", [hex: :timex, repo: "hexpm", optional: true]}, {:tzdata, "~> 1.0", [hex: :tzdata, repo: "hexpm", optional: true]}], "hexpm", "a125a9e65a5af740a1198f3b05c1a736fce3942f5e0dc2901e0f9be5745bea99"},
"ranch": {:hex, :ranch, "1.7.1", "6b1fab51b49196860b733a49c07604465a47bdb78aa10c1c16a3d199f7f8c881", [:rebar3], [], "hexpm", "451d8527787df716d99dc36162fca05934915db0b6141bbdac2ea8d3c7afc7d7"},
"recase": {:hex, :recase, "0.6.0", "1dd2dd2f4e06603b74977630e739f08b7fedbb9420cc14de353666c2fc8b99f4", [:mix], [], "hexpm", "8712e318420a228eb2e6366ada230148ed3a4316a798319edd5512f64d78c990"},
"scrivener": {:hex, :scrivener, "2.7.0", "fa94cdea21fad0649921d8066b1833d18d296217bfdf4a5389a2f45ee857b773", [:mix], [], "hexpm", "30da36a427f2519cf75993271fb7c5aad1759682a70f90d880a85c3d743d2c57"},
"scrivener_ecto": {:hex, :scrivener_ecto, "2.3.0", "057f9dd3c77315f0a470263c3565353860d0294404aed611b3524c6df9044189", [:mix], [{:ecto, "~> 3.3", [hex: :ecto, repo: "hexpm", optional: false]}, {:scrivener, "~> 2.4", [hex: :scrivener, repo: "hexpm", optional: false]}], "hexpm", "dfa43ca660651da63239e5d4acbfd9c57c5759bbf3a2bdc16cd70777c9bc7e0d"},
"shards": {:hex, :shards, "0.6.2", "e05d05537883220c3b8a8f9d40d5c8ba7ff6064c63ebb6b23046972f6863b2d1", [:make, :rebar3], [], "hexpm", "58afa3712f1f1256a2a15e39fa95b7cd758087aaa7a25beaf786daabd87890f0"},
"sobelow": {:hex, :sobelow, "0.10.2", "00e91208046d3b434f9f08779fe0ca7c6d6595b7fa33b289e792dffa6dde8081", [:mix], [], "hexpm", "e30fc994330cf6f485c1c4f2fb7c4b2d403557d0e101c6e5329fd17a58e55a7e"},
"ssl_verify_fun": {:hex, :ssl_verify_fun, "1.1.5", "6eaf7ad16cb568bb01753dbbd7a95ff8b91c7979482b95f38443fe2c8852a79b", [:make, :mix, :rebar3], [], "hexpm", "13104d7897e38ed7f044c4de953a6c28597d1c952075eb2e328bc6d6f2bfc496"},
"swarm": {:hex, :swarm, "3.4.0", "64f8b30055d74640d2186c66354b33b999438692a91be275bb89cdc7e401f448", [:mix], [{:gen_state_machine, "~> 2.0", [hex: :gen_state_machine, repo: "hexpm", optional: false]}, {:libring, "~> 1.0", [hex: :libring, repo: "hexpm", optional: false]}], "hexpm", "94884f84783fc1ba027aba8fe8a7dae4aad78c98e9f9c76667ec3471585c08c6"},
"swoosh": {:hex, :swoosh, "0.23.5", "bfd9404bbf5069b1be2ffd317923ce57e58b332e25dbca2a35dedd7820dfee5a", [:mix], [{:cowboy, "~> 1.0.1 or ~> 1.1 or ~> 2.4", [hex: :cowboy, repo: "hexpm", optional: true]}, {:gen_smtp, "~> 0.13", [hex: :gen_smtp, repo: "hexpm", optional: true]}, {:hackney, "~> 1.9", [hex: :hackney, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:mail, "~> 0.2", [hex: :mail, repo: "hexpm", optional: true]}, {:mime, "~> 1.1", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_cowboy, ">= 1.0.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}], "hexpm", "e3928e1d2889a308aaf3e42755809ac21cffd77cb58eef01cbfdab4ce2fd1e21"},
"telemetry": {:hex, :telemetry, "0.4.1", "ae2718484892448a24470e6aa341bc847c3277bfb8d4e9289f7474d752c09c7f", [:rebar3], [], "hexpm", "4738382e36a0a9a2b6e25d67c960e40e1a2c95560b9f936d8e29de8cd858480f"},
"timex": {:hex, :timex, "3.6.1", "efdf56d0e67a6b956cc57774353b0329c8ab7726766a11547e529357ffdc1d56", [:mix], [{:combine, "~> 0.10", [hex: :combine, repo: "hexpm", optional: false]}, {:gettext, "~> 0.10", [hex: :gettext, repo: "hexpm", optional: false]}, {:tzdata, "~> 0.1.8 or ~> 0.5 or ~> 1.0.0", [hex: :tzdata, repo: "hexpm", optional: false]}], "hexpm", "f354efb2400dd7a80fd9eb6c8419068c4f632da4ac47f3d8822d6e33f08bc852"},
"tzdata": {:hex, :tzdata, "1.0.3", "73470ad29dde46e350c60a66e6b360d3b99d2d18b74c4c349dbebbc27a09a3eb", [:mix], [{:hackney, "~> 1.0", [hex: :hackney, repo: "hexpm", optional: false]}], "hexpm", "a6e1ee7003c4d04ecbd21dd3ec690d4c6662db5d3bbdd7262d53cdf5e7c746c1"},
"unicode_util_compat": {:hex, :unicode_util_compat, "0.3.1", "a1f612a7b512638634a603c8f401892afbf99b8ce93a45041f8aaca99cadb85e", [:rebar3], [], "hexpm", "da1d9bef8a092cc7e1e51f1298037a5ddfb0f657fe862dfe7ba4c5807b551c29"},
"vex": {:hex, :vex, "0.6.0", "4e79b396b2ec18cd909eed0450b19108d9631842598d46552dc05031100b7a56", [:mix], [], "hexpm", "7e4d9b50dd72cf931b52aba3470513686007f2ad54832de37cdb659cc85ba73e"},
}

4
frontend/.eslintignore Normal file
View File

@ -0,0 +1,4 @@
node_modules
dist
build
coverage

24
frontend/.eslintrc.js Normal file
View File

@ -0,0 +1,24 @@
module.exports = {
root: true,
parser: "@typescript-eslint/parser",
parserOptions: {
tsconfigRootDir: __dirname,
project: ["./tsconfig.json"],
},
plugins: ["@typescript-eslint", "prettier"],
extends: [
"plugin:@typescript-eslint/recommended-requiring-type-checking",
"plugin:@typescript-eslint/eslint-recommended",
"plugin:@typescript-eslint/recommended",
"plugin:react/recommended",
"plugin:react-hooks/recommended",
"prettier/@typescript-eslint",
"prettier",
],
rules: {
"@typescript-eslint/no-explicit-any": 0,
"@typescript-eslint/explicit-function-return-type": 0,
"react/prop-types": 0,
"@typescript-eslint/no-non-null-assertion": 0
},
};

3
frontend/.prettierrc.js Normal file
View File

@ -0,0 +1,3 @@
module.exports = {
printWidth: 100
}

63
frontend/package.json
View File

@ -6,7 +6,7 @@
"start": "NODE_ENV=development react-scripts start",
"build": "react-scripts build",
"typecheck": "tsc --noemit",
"lint": "yarn typecheck && tslint -p tsconfig.json -c tslint.json \"src/**/*.{ts,tsx}\"",
"lint": "yarn typecheck && yarn eslint src/ --ext .js,.jsx,.ts,.tsx",
"lint:fix": "yarn lint --fix",
"pretty": "prettier --write \"src/**/*.{ts,tsx}\"",
"test": "yarn lint && react-scripts test --ci",
@ -20,62 +20,67 @@
"lint-staged": {
"src/**/*.{ts,tsx}": [
"yarn pretty",
"yarn lint:fix",
"git add"
"yarn lint:fix"
]
},
"prettier": {
"printWidth": 120
},
"dependencies": {
"@blueprintjs/core": "^3.19.1",
"@blueprintjs/icons": "^3.11.0",
"@blueprintjs/select": "^3.11.1",
"@blueprintjs/core": "^3.26.1",
"@blueprintjs/icons": "^3.16.0",
"@blueprintjs/select": "^3.12.3",
"classnames": "^2.2.6",
"connected-react-router": "^6.5.2",
"cross-fetch": "^3.0.4",
"cytoscape": "^3.11.0",
"cytoscape-popper": "^1.0.4",
"cytoscape": "^3.15.0",
"cytoscape-popper": "^1.0.7",
"inflection": "^1.12.0",
"lodash": "^4.17.15",
"moment": "^2.22.2",
"moment": "^2.25.3",
"normalize.css": "^8.0.0",
"numeral": "^2.0.6",
"react": "^16.10.2",
"react-dom": "^16.10.2",
"react-redux": "^7.1.1",
"react-router-dom": "^5.1.2",
"react-scripts": "^3.2.0",
"react-router-dom": "^5.2.0",
"react-scripts": "3.4.1",
"react-sigma": "^1.2.30",
"react-virtualized": "^9.21.1",
"redux": "^4.0.4",
"redux-thunk": "^2.3.0",
"sanitize-html": "^1.20.1",
"styled-components": "^4.4.0",
"styled-components": "^5.1.0",
"tippy.js": "^4.3.5"
},
"devDependencies": {
"@blueprintjs/tslint-config": "^1.9.0",
"@types/classnames": "^2.2.9",
"@types/cytoscape": "^3.8.3",
"@types/inflection": "^1.5.28",
"@types/jest": "^24.0.19",
"@types/lodash": "^4.14.144",
"@types/node": "^12.7.12",
"@types/numeral": "^0.0.26",
"@types/react": "^16.9.6",
"@types/react-dom": "^16.9.2",
"@types/react-redux": "^7.1.4",
"@types/react-router-dom": "^5.1.0",
"@types/sanitize-html": "^1.20.2",
"@types/styled-components": "4.1.19",
"husky": "^3.0.9",
"lint-staged": "^9.4.2",
"@types/jest": "^25.2.3",
"@types/lodash": "^4.14.151",
"@types/node": "^14.0.1",
"@types/numeral": "^0.0.28",
"@types/react": "^16.9.35",
"@types/react-dom": "^16.9.8",
"@types/react-redux": "^7.1.8",
"@types/react-router-dom": "^5.1.5",
"@types/sanitize-html": "^1.23.0",
"@types/styled-components": "5.1.0",
"@typescript-eslint/eslint-plugin": "^2.24.0",
"@typescript-eslint/parser": "^2.34.0",
"eslint-config-airbnb-typescript": "^7.2.1",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.3",
"eslint-plugin-react": "^7.20.0",
"eslint-plugin-react-hooks": "^4.0.2",
"husky": "^4.2.5",
"lint-staged": "^10.2.4",
"prettier": "^2.0.5",
"react-axe": "^3.3.0",
"tslint": "^5.20.0",
"tslint-config-security": "^1.16.0",
"tslint-eslint-rules": "^5.4.0",
"typescript": "^3.6.4"
"typescript": "^3.9.2"
},
"browserslist": [
">0.2%",

16
frontend/src/AppRouter.tsx
View File

@ -4,26 +4,26 @@ import { Classes } from "@blueprintjs/core";
import { ConnectedRouter } from "connected-react-router";
import { Route } from "react-router-dom";
import { Nav } from "./components/organisms/";
import { Nav } from "./components/organisms";
import {
AboutScreen,
AdminScreen,
GraphScreen,
LoginScreen,
TableScreen,
VerifyLoginScreen
} from "./components/screens/";
VerifyLoginScreen,
} from "./components/screens";
import { history } from "./index";
const AppRouter: React.FC = () => (
<ConnectedRouter history={history}>
<div className={`${Classes.DARK} App`}>
<Nav />
<Route path="/instances" exact={true} component={TableScreen} />
<Route path="/about" exact={true} component={AboutScreen} />
<Route path="/admin/login" exact={true} component={LoginScreen} />
<Route path="/admin/verify" exact={true} component={VerifyLoginScreen} />
<Route path="/admin" exact={true} component={AdminScreen} />
<Route path="/instances" exact component={TableScreen} />
<Route path="/about" exact component={AboutScreen} />
<Route path="/admin/login" exact component={LoginScreen} />
<Route path="/admin/verify" exact component={VerifyLoginScreen} />
<Route path="/admin" exact component={AdminScreen} />
{/* We always want the GraphScreen to be rendered (since un- and re-mounting it is expensive */}
<GraphScreen />
</div>

2
frontend/src/components/atoms/FloatingCard.tsx
View File

@ -11,7 +11,7 @@ const FloatingCardElement = styled(Card)`
z-index: 2;
`;
const FloatingCard: React.FC<ICardProps> = props => (
const FloatingCard: React.FC<ICardProps> = (props) => (
<FloatingCardRow>
<FloatingCardElement elevation={Elevation.ONE} {...props} />
</FloatingCardRow>

4
frontend/src/components/atoms/GraphHideEdgesButton.tsx
View File

@ -7,11 +7,11 @@ const StyledSwitch = styled(Switch)`
margin: 0;
`;
interface IGraphHideEdgesButtonProps {
interface GraphHideEdgesButtonProps {
isShowingEdges: boolean;
toggleEdges: () => void;
}
const GraphHideEdgesButton: React.FC<IGraphHideEdgesButtonProps> = ({ isShowingEdges, toggleEdges }) => (
const GraphHideEdgesButton: React.FC<GraphHideEdgesButtonProps> = ({ isShowingEdges, toggleEdges }) => (
<FloatingCard>
<StyledSwitch checked={isShowingEdges} label="Show connections" onChange={toggleEdges} tabIndex={-1} />
</FloatingCard>

95
frontend/src/components/atoms/GraphKey.tsx
View File

@ -6,9 +6,9 @@ import React from "react";
import styled from "styled-components";
import { FloatingCard, InstanceType } from ".";
import { QUANTITATIVE_COLOR_SCHEME } from "../../constants";
import { IColorScheme } from "../../types";
import { ColorScheme } from "../../types";
const ColorSchemeSelect = Select.ofType<IColorScheme>();
const ColorSchemeSelect = Select.ofType<ColorScheme>();
const StyledLi = styled.li`
margin-top: 2px;
@ -27,12 +27,12 @@ const ColorBarContainer = styled.div`
flex-direction: column;
margin-right: 10px;
`;
interface IColorBarProps {
interface ColorBarProps {
color: string;
}
const ColorBar = styled.div<IColorBarProps>`
const ColorBar = styled.div<ColorBarProps>`
width: 10px;
background-color: ${props => props.color};
background-color: ${(props) => props.color};
flex: 1;
`;
const TextContainer = styled.div`
@ -41,13 +41,46 @@ const TextContainer = styled.div`
justify-content: space-between;
`;
interface IGraphKeyProps {
current?: IColorScheme;
colorSchemes: IColorScheme[];
const renderItem: ItemRenderer<ColorScheme> = (colorScheme, { handleClick, modifiers }) => {
if (!modifiers.matchesPredicate) {
return null;
}
return <MenuItem active={modifiers.active} key={colorScheme.name} onClick={handleClick} text={colorScheme.name} />;
};
const renderQualitativeKey = (values: string[]) => (
<ul className={Classes.LIST_UNSTYLED}>
{values.map((v) => (
<StyledLi key={v}>
<InstanceType type={v} />
</StyledLi>
))}
</ul>
);
const renderQuantitativeKey = (range: number[]) => {
const [min, max] = range;
return (
<ColorKeyContainer>
<ColorBarContainer>
{QUANTITATIVE_COLOR_SCHEME.map((color) => (
<ColorBar color={color} key={color} />
))}
</ColorBarContainer>
<TextContainer>
<span className={Classes.TEXT_SMALL}>{numeral.default(min).format("0")}</span>
<span className={Classes.TEXT_SMALL}>{numeral.default(max).format("0")}</span>
</TextContainer>
</ColorKeyContainer>
);
};
interface GraphKeyProps {
current?: ColorScheme;
colorSchemes: ColorScheme[];
ranges?: { [key: string]: [number, number] };
onItemSelect: (colorScheme?: IColorScheme) => void;
onItemSelect: (colorScheme?: ColorScheme) => void;
}
const GraphKey: React.FC<IGraphKeyProps> = ({ current, colorSchemes, ranges, onItemSelect }) => {
const GraphKey: React.FC<GraphKeyProps> = ({ current, colorSchemes, ranges, onItemSelect }) => {
const unsetColorScheme = () => {
onItemSelect(undefined);
};
@ -76,13 +109,7 @@ const GraphKey: React.FC<IGraphKeyProps> = ({ current, colorSchemes, ranges, onI
rightIcon={IconNames.CARET_DOWN}
tabIndex={-1}
/>
<Button
icon={IconNames.SMALL_CROSS}
minimal={true}
onClick={unsetColorScheme}
disabled={!current}
tabIndex={-1}
/>
<Button icon={IconNames.SMALL_CROSS} minimal onClick={unsetColorScheme} disabled={!current} tabIndex={-1} />
</ColorSchemeSelect>
<br />
{!!current && !!key && (
@ -95,38 +122,4 @@ const GraphKey: React.FC<IGraphKeyProps> = ({ current, colorSchemes, ranges, onI
);
};
const renderItem: ItemRenderer<IColorScheme> = (colorScheme, { handleClick, modifiers }) => {
if (!modifiers.matchesPredicate) {
return null;
}
return <MenuItem active={modifiers.active} key={colorScheme.name} onClick={handleClick} text={colorScheme.name} />;
};
const renderQualitativeKey = (values: string[]) => (
<ul className={Classes.LIST_UNSTYLED}>
{values.map(v => (
<StyledLi key={v}>
<InstanceType type={v} />
</StyledLi>
))}
</ul>
);
const renderQuantitativeKey = (range: number[]) => {
const [min, max] = range;
return (
<ColorKeyContainer>
<ColorBarContainer>
{QUANTITATIVE_COLOR_SCHEME.map((color, idx) => (
<ColorBar color={color} key={color} />
))}
</ColorBarContainer>
<TextContainer>
<span className={Classes.TEXT_SMALL}>{numeral.default(min).format("0")}</span>
<span className={Classes.TEXT_SMALL}>{numeral.default(max).format("0")}</span>
</TextContainer>
</ColorKeyContainer>
);
};
export default GraphKey;

4
frontend/src/components/atoms/GraphResetButton.tsx
View File

@ -2,10 +2,10 @@ import { Button } from "@blueprintjs/core";
import * as React from "react";
import FloatingCard from "./FloatingCard";
interface IGraphResetButtonProps {
interface GraphResetButtonProps {
onClick: () => void;
}
const GraphResetButton: React.FC<IGraphResetButtonProps> = ({ onClick }) => (
const GraphResetButton: React.FC<GraphResetButtonProps> = ({ onClick }) => (
<FloatingCard>
<Button icon="compass" title="Reset graph view" onClick={onClick} tabIndex={-1} />
</FloatingCard>

6
frontend/src/components/atoms/InstanceType.tsx
View File

@ -5,7 +5,7 @@ import { QUALITATIVE_COLOR_SCHEME } from "../../constants";
import { typeColorScheme } from "../../types";
import { getTypeDisplayString } from "../../util";
interface IInstanceTypeProps {
interface InstanceTypeProps {
type: string;
colorAfterName?: boolean;
}
@ -13,9 +13,9 @@ interface IInstanceTypeProps {
* By default, renders the color followed by the name of the instance type.
* You can change this by passing `colorAfterName={true}`.
*/
const InstanceType: React.FC<IInstanceTypeProps> = ({ type, colorAfterName }) => {
const InstanceType: React.FC<InstanceTypeProps> = ({ type, colorAfterName }) => {
const idx = typeColorScheme.values.indexOf(type);
const name = " " + getTypeDisplayString(type);
const name = ` ${getTypeDisplayString(type)}`;
return (
<>
{!!colorAfterName && name}

10
frontend/src/components/atoms/Page.tsx
View File

@ -11,19 +11,19 @@ const Backdrop = styled.div`
z-index: 3;
`;
interface IContainerProps {
interface ContainerProps {
fullWidth?: boolean;
}
const Container = styled.div<IContainerProps>`
max-width: ${props => (props.fullWidth ? "100%" : "800px")};
const Container = styled.div<ContainerProps>`
max-width: ${(props) => (props.fullWidth ? "100%" : "800px")};
margin: auto;
padding: 2em;
`;
interface IPageProps {
interface PageProps {
fullWidth?: boolean;
}
const Page: React.FC<IPageProps> = ({ children, fullWidth }) => (
const Page: React.FC<PageProps> = ({ children, fullWidth }) => (
<Backdrop>
<Container fullWidth={fullWidth}>{children}</Container>
</Backdrop>

76
frontend/src/components/molecules/Cytoscape.tsx
View File

@ -10,9 +10,9 @@ import {
QUALITATIVE_COLOR_SCHEME,
QUANTITATIVE_COLOR_SCHEME,
SEARCH_RESULT_COLOR,
SELECTED_NODE_COLOR
SELECTED_NODE_COLOR,
} from "../../constants";
import { IColorScheme } from "../../types";
import { ColorScheme } from "../../types";
import { getBuckets, getTypeDisplayString } from "../../util";
const CytoscapeContainer = styled.div`
@ -21,8 +21,8 @@ const CytoscapeContainer = styled.div`
flex: 1;
`;
interface ICytoscapeProps {
colorScheme?: IColorScheme;
interface CytoscapeProps {
colorScheme?: ColorScheme;
currentNodeId: string | null;
elements: cytoscape.ElementsDefinition;
hoveringOver?: string;
@ -32,10 +32,11 @@ interface ICytoscapeProps {
navigateToInstancePath?: (domain: string) => void;
navigateToRoot?: () => void;
}
class Cytoscape extends React.PureComponent<ICytoscapeProps> {
class Cytoscape extends React.PureComponent<CytoscapeProps> {
private cy?: cytoscape.Core;
public componentDidMount() {
// eslint-disable-next-line react/no-find-dom-node
const container = ReactDOM.findDOMNode(this);
this.cy = cytoscape({
autoungrabify: true,
@ -44,16 +45,16 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
hideEdgesOnViewport: true,
hideLabelsOnViewport: true,
layout: {
name: "preset"
name: "preset",
},
maxZoom: 2,
minZoom: 0.01,
pixelRatio: 1.0,
selectionType: "single"
selectionType: "single",
});
// Setup node tooltip on hover
this.cy.nodes().forEach(n => {
this.cy.nodes().forEach((n) => {
const tooltipContent = `${n.data("id")} (${getTypeDisplayString(n.data("type"))})`;
const ref = (n as any).popperRef();
const t = tippy(ref, {
@ -61,12 +62,12 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
animation: "fade",
content: tooltipContent,
duration: 100,
trigger: "manual"
trigger: "manual",
});
n.on("mouseover", e => {
n.on("mouseover", () => {
(t as Instance).show();
});
n.on("mouseout", e => {
n.on("mouseout", () => {
(t as Instance).hide();
});
});
@ -78,25 +79,25 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
.style({
"curve-style": "haystack", // fast edges
"line-color": DEFAULT_NODE_COLOR,
width: "mapData(weight, 0, 0.5, 1, 20)"
width: "mapData(weight, 0, 0.5, 1, 20)",
})
.selector("node[label]")
.style({
color: DEFAULT_NODE_COLOR,
"font-size": "mapData(size, 1, 6, 10, 100)",
"min-zoomed-font-size": 16
"min-zoomed-font-size": 16,
})
.selector(".hidden") // used to hide nodes not in the neighborhood of the selected, or to hide edges
.style({
display: "none"
display: "none",
})
.selector(".thickEdge") // when a node is selected, make edges thicker so you can actually see them
.style({
width: 2
width: 2,
});
this.resetNodeColorScheme(style); // this function also called `update()`
this.cy.nodes().on("select", e => {
this.cy.nodes().on("select", (e) => {
const instanceId = e.target.data("id");
if (instanceId && instanceId !== this.props.currentNodeId) {
if (this.props.navigateToInstancePath) {
@ -110,21 +111,19 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
this.cy!.nodes().removeClass("hidden");
this.cy!.edges().removeClass("thickEdge");
// Then hide everything except neighborhood
this.cy!.nodes()
.diff(neighborhood)
.left.addClass("hidden");
this.cy!.nodes().diff(neighborhood).left.addClass("hidden");
neighborhood.connectedEdges().addClass("thickEdge");
});
});
this.cy.nodes().on("unselect", e => {
this.cy.nodes().on("unselect", () => {
this.cy!.batch(() => {
this.cy!.nodes().removeClass("hidden");
this.cy!.edges().removeClass("thickEdge");
});
});
this.cy.on("click", e => {
this.cy.on("click", (e) => {
// Clicking on the background should also deselect
const target = e.target;
const { target } = e;
if (!target || target === this.cy || target.isEdge()) {
if (this.props.navigateToRoot) {
// Go to the URL "/"
@ -136,7 +135,7 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
this.setNodeSelection();
}
public componentDidUpdate(prevProps: ICytoscapeProps) {
public componentDidUpdate(prevProps: CytoscapeProps) {
this.setNodeSelection(prevProps.currentNodeId);
if (prevProps.colorScheme !== this.props.colorScheme) {
this.updateColorScheme();
@ -174,12 +173,12 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
if (currentNodeId) {
this.cy.zoom({
level: 0.2,
position: this.cy.$id(currentNodeId).position()
position: this.cy.$id(currentNodeId).position(),
});
} else {
this.cy.zoom({
level: 0.2,
position: { x: 0, y: 0 }
position: { x: 0, y: 0 },
});
}
}
@ -221,7 +220,7 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
// quite good as it is, so...
height: "mapData(size, 1, 6, 20, 200)",
label: "data(id)",
width: "mapData(size, 1, 6, 20, 200)"
width: "mapData(size, 1, 6, 20, 200)",
});
this.setNodeSearchColorScheme(style);
@ -240,16 +239,16 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
"background-color": SEARCH_RESULT_COLOR,
"border-color": SEARCH_RESULT_COLOR,
"border-opacity": 0.7,
"border-width": 250
"border-width": 250,
})
.selector("node.hovered")
.style({
"border-color": HOVERED_NODE_COLOR,
"border-width": 1000
"border-width": 1000,
})
.selector("node:selected")
.style({
"background-color": SELECTED_NODE_COLOR
"background-color": SELECTED_NODE_COLOR,
})
.update();
};
@ -263,10 +262,11 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
if (!colorScheme) {
this.resetNodeColorScheme();
return;
} else if (colorScheme.type === "qualitative") {
}
if (colorScheme.type === "qualitative") {
colorScheme.values.forEach((v, idx) => {
style = style.selector(`node[${colorScheme.cytoscapeDataKey} = '${v}']`).style({
"background-color": QUALITATIVE_COLOR_SCHEME[idx]
"background-color": QUALITATIVE_COLOR_SCHEME[idx],
});
});
} else if (colorScheme.type === "quantitative") {
@ -284,7 +284,7 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
const max = idx === QUANTITATIVE_COLOR_SCHEME.length - 1 ? maxVal + 1 : buckets[idx + 1];
const selector = `node[${dataKey} >= ${min}][${dataKey} < ${max}]`;
style = style.selector(selector).style({
"background-color": color
"background-color": color,
});
});
}
@ -304,10 +304,10 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
}
const { hoveringOver } = this.props;
if (!!prevHoveredId) {
if (prevHoveredId) {
this.cy.$id(prevHoveredId).removeClass("hovered");
}
if (!!hoveringOver) {
if (hoveringOver) {
this.cy.$id(hoveringOver).addClass("hovered");
}
};
@ -322,7 +322,7 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
this.cy!.nodes().removeClass("searchResult");
if (!!searchResultIds && searchResultIds.length > 0) {
const currentResultSelector = searchResultIds.map(id => `node[id = "${id}"]`).join(", ");
const currentResultSelector = searchResultIds.map((id) => `node[id = "${id}"]`).join(", ");
this.cy!.$(currentResultSelector).addClass("searchResult");
}
});
@ -344,11 +344,11 @@ class Cytoscape extends React.PureComponent<ICytoscapeProps> {
/* Helper function to remove edges if source or target node is missing */
private cleanElements = (elements: cytoscape.ElementsDefinition): cytoscape.ElementsDefinition => {
const domains = new Set(elements.nodes.map(n => n.data.id));
const edges = elements.edges.filter(e => domains.has(e.data.source) && domains.has(e.data.target));
const domains = new Set(elements.nodes.map((n) => n.data.id));
const edges = elements.edges.filter((e) => domains.has(e.data.source) && domains.has(e.data.target));
return {
edges,
nodes: elements.nodes
nodes: elements.nodes,
};
};
}

6
frontend/src/components/molecules/ErrorState.tsx
View File

@ -2,11 +2,11 @@ import { NonIdealState } from "@blueprintjs/core";
import { IconNames } from "@blueprintjs/icons";
import * as React from "react";
interface IErrorStateProps {
interface ErrorStateProps {
description?: string;
}
const ErrorState: React.FC<IErrorStateProps> = ({ description }) => (
<NonIdealState icon={IconNames.ERROR} title={"Something went wrong."} description={description} />
const ErrorState: React.FC<ErrorStateProps> = ({ description }) => (
<NonIdealState icon={IconNames.ERROR} title="Something went wrong." description={description} />
);
export default ErrorState;

40
frontend/src/components/molecules/GraphTools.tsx
View File

@ -1,6 +1,6 @@
import React from "react";
import styled from "styled-components";
import { IColorScheme } from "../../types";
import { ColorScheme } from "../../types";
import { GraphHideEdgesButton, GraphKey, GraphResetButton } from "../atoms";
const GraphToolsContainer = styled.div`
@ -11,35 +11,33 @@ const GraphToolsContainer = styled.div`
flex-direction: column;
`;
interface IGraphToolsProps {
currentColorScheme?: IColorScheme;
colorSchemes: IColorScheme[];
interface GraphToolsProps {
currentColorScheme?: ColorScheme;
colorSchemes: ColorScheme[];
isShowingEdges: boolean;
ranges?: { [key: string]: [number, number] };
onColorSchemeSelect: (colorScheme?: IColorScheme) => void;
onColorSchemeSelect: (colorScheme?: ColorScheme) => void;
onResetButtonClick: () => void;
toggleEdges: () => void;
}
const GraphTools: React.FC<IGraphToolsProps> = ({
const GraphTools: React.FC<GraphToolsProps> = ({
currentColorScheme,
colorSchemes,
isShowingEdges,
ranges,
onColorSchemeSelect,
onResetButtonClick,
toggleEdges
}) => {
return (
<GraphToolsContainer>
<GraphResetButton onClick={onResetButtonClick} />
<GraphHideEdgesButton isShowingEdges={isShowingEdges} toggleEdges={toggleEdges} />
<GraphKey
current={currentColorScheme}
colorSchemes={colorSchemes}
onItemSelect={onColorSchemeSelect}
ranges={ranges}
/>
</GraphToolsContainer>
);
};
toggleEdges,
}) => (
<GraphToolsContainer>
<GraphResetButton onClick={onResetButtonClick} />
<GraphHideEdgesButton isShowingEdges={isShowingEdges} toggleEdges={toggleEdges} />
<GraphKey
current={currentColorScheme}
colorSchemes={colorSchemes}
onItemSelect={onColorSchemeSelect}
ranges={ranges}
/>
</GraphToolsContainer>
);
export default GraphTools;

12
frontend/src/components/molecules/SearchResult.tsx
View File

@ -4,7 +4,7 @@ import * as numeral from "numeral";
import React from "react";
import sanitize from "sanitize-html";
import styled from "styled-components";
import { ISearchResultInstance } from "../../redux/types";
import { SearchResultInstance } from "../../redux/types";
import { InstanceType } from "../atoms";
const StyledCard = styled(Card)`
@ -32,18 +32,18 @@ const StyledUserCount = styled.div`
const StyledDescription = styled.div`
margin-top: 10px;
`;
interface ISearchResultProps {
result: ISearchResultInstance;
interface SearchResultProps {
result: SearchResultInstance;
onClick: () => void;
onMouseEnter: () => void;
onMouseLeave: () => void;
}
const SearchResult: React.FC<ISearchResultProps> = ({ result, onClick, onMouseEnter, onMouseLeave }) => {
const SearchResult: React.FC<SearchResultProps> = ({ result, onClick, onMouseEnter, onMouseLeave }) => {
let shortenedDescription;
if (result.description) {
shortenedDescription = result.description && sanitize(result.description);
if (shortenedDescription.length > 100) {
shortenedDescription = shortenedDescription.substring(0, 100) + "...";
shortenedDescription = `${shortenedDescription.substring(0, 100)}...`;
}
}
@ -59,7 +59,7 @@ const SearchResult: React.FC<ISearchResultProps> = ({ result, onClick, onMouseEn
return (
<StyledCard
elevation={Elevation.ONE}
interactive={true}
interactive
key={result.name}
onClick={onClick}
onMouseEnter={onMouseEnter}

10
frontend/src/components/organisms/FederationTab.tsx
View File

@ -1,12 +1,12 @@
import { Classes, H3 } from "@blueprintjs/core";
import React from "react";
import { Link } from "react-router-dom";
import { IFederationRestrictions } from "../../redux/types";
import { FederationRestrictions } from "../../redux/types";
const maybeGetList = (domains?: string[]) =>
domains && (
<ul>
{domains.sort().map(domain => (
{domains.sort().map((domain) => (
<li key={domain}>
<Link to={`/instance/${domain}`} className={`${Classes.BUTTON} ${Classes.MINIMAL}`} role="button">
{domain}
@ -16,10 +16,10 @@ const maybeGetList = (domains?: string[]) =>
</ul>
);
interface IFederationTabProps {
restrictions?: IFederationRestrictions;
interface FederationTabProps {
restrictions?: FederationRestrictions;
}
const FederationTab: React.FC<IFederationTabProps> = ({ restrictions }) => {
const FederationTab: React.FC<FederationTabProps> = ({ restrictions }) => {
if (!restrictions) {
return null;
}

33
frontend/src/components/organisms/Graph.tsx
View File

@ -6,33 +6,33 @@ import { push } from "connected-react-router";
import { Dispatch } from "redux";
import styled from "styled-components";
import { fetchGraph } from "../../redux/actions";
import { IAppState, IGraphResponse } from "../../redux/types";
import { colorSchemes, IColorScheme } from "../../types";
import { AppState, GraphResponse } from "../../redux/types";
import { colorSchemes, ColorScheme } from "../../types";
import { domainMatchSelector } from "../../util";
import { Cytoscape, ErrorState, GraphTools } from "../molecules/";
import { Cytoscape, ErrorState, GraphTools } from "../molecules";
const GraphDiv = styled.div`
flex: 2;
`;
interface IGraphProps {
interface GraphProps {
currentInstanceName: string | null;
fetchGraph: () => void;
graphResponse?: IGraphResponse;
graphResponse?: GraphResponse;
graphLoadError: boolean;
hoveringOverResult?: string;
isLoadingGraph: boolean;
searchResultDomains: string[];
navigate: (path: string) => void;
}
interface IGraphState {
colorScheme?: IColorScheme;
interface GraphState {
colorScheme?: ColorScheme;
isShowingEdges: boolean;
}
class GraphImpl extends React.PureComponent<IGraphProps, IGraphState> {
class GraphImpl extends React.PureComponent<GraphProps, GraphState> {
private cytoscapeComponent: React.RefObject<Cytoscape>;
public constructor(props: IGraphProps) {
public constructor(props: GraphProps) {
super(props);
this.cytoscapeComponent = React.createRef();
this.state = { colorScheme: undefined, isShowingEdges: true };
@ -76,7 +76,7 @@ class GraphImpl extends React.PureComponent<IGraphProps, IGraphState> {
);
}
return <GraphDiv aria-hidden={true}>{content}</GraphDiv>;
return <GraphDiv aria-hidden>{content}</GraphDiv>;
}
private loadGraph = () => {
@ -95,7 +95,7 @@ class GraphImpl extends React.PureComponent<IGraphProps, IGraphState> {
this.setState({ isShowingEdges: !this.state.isShowingEdges });
};
private setColorScheme = (colorScheme?: IColorScheme) => {
private setColorScheme = (colorScheme?: ColorScheme) => {
this.setState({ colorScheme });
};
@ -107,7 +107,7 @@ class GraphImpl extends React.PureComponent<IGraphProps, IGraphState> {
this.props.navigate("/");
};
}
const mapStateToProps = (state: IAppState) => {
const mapStateToProps = (state: AppState) => {
const match = domainMatchSelector(state);
return {
currentInstanceName: match && match.params.domain,
@ -115,15 +115,12 @@ const mapStateToProps = (state: IAppState) => {
graphResponse: state.data.graphResponse,
hoveringOverResult: state.search.hoveringOverResult,
isLoadingGraph: state.data.isLoadingGraph,
searchResultDomains: state.search.results.map(r => r.name)
searchResultDomains: state.search.results.map((r) => r.name),
};
};
const mapDispatchToProps = (dispatch: Dispatch) => ({
fetchGraph: () => dispatch(fetchGraph() as any),
navigate: (path: string) => dispatch(push(path))
navigate: (path: string) => dispatch(push(path)),
});
const Graph = connect(
mapStateToProps,
mapDispatchToProps
)(GraphImpl);
const Graph = connect(mapStateToProps, mapDispatchToProps)(GraphImpl);
export default Graph;

71
frontend/src/components/organisms/InstanceTable.tsx
View File

@ -8,7 +8,7 @@ import { connect } from "react-redux";
import { Dispatch } from "redux";
import styled from "styled-components";
import { loadInstanceList } from "../../redux/actions";
import { IAppState, IInstanceListResponse, IInstanceSort, SortField } from "../../redux/types";
import { AppState, InstanceListResponse, InstanceSort, SortField, InstanceDetails } from "../../redux/types";
import { InstanceType } from "../atoms";
import { ErrorState } from "../molecules";
@ -41,15 +41,15 @@ const InsularityColumn = styled.th`
width: 15%;
`;
interface IInstanceTableProps {
interface InstanceTableProps {
loadError: boolean;
instancesResponse?: IInstanceListResponse;
instanceListSort: IInstanceSort;
instancesResponse?: InstanceListResponse;
instanceListSort: InstanceSort;
isLoading: boolean;
loadInstanceList: (page?: number, sort?: IInstanceSort) => void;
loadInstanceList: (page?: number, sort?: InstanceSort) => void;
navigate: (path: string) => void;
}
class InstanceTable extends React.PureComponent<IInstanceTableProps> {
class InstanceTable extends React.PureComponent<InstanceTableProps> {
public componentDidMount() {
const { isLoading, instancesResponse, loadError } = this.props;
if (!isLoading && !instancesResponse && !loadError) {
@ -61,22 +61,23 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
const { isLoading, instancesResponse, loadError } = this.props;
if (loadError) {
return <ErrorState />;
} else if (isLoading || !instancesResponse) {
}
if (isLoading || !instancesResponse) {
return <NonIdealState icon={<Spinner />} />;
}
const { instances, pageNumber: currentPage, totalPages, totalEntries, pageSize } = instancesResponse!;
const { instances, pageNumber: currentPage, totalPages, totalEntries, pageSize } = instancesResponse;
const pagesToDisplay = this.getPagesToDisplay(totalPages, currentPage);
return (
<>
<StyledTable striped={true} bordered={true} interactive={true}>
<StyledTable striped bordered interactive>
<thead>
<tr>
<InstanceColumn>
Instance
<Button
minimal={true}
minimal
icon={this.getSortIcon("domain")}
onClick={this.sortByFactory("domain")}
intent={this.getSortIntent("domain")}
@ -87,7 +88,7 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
<UserCountColumn>
Users
<Button
minimal={true}
minimal
icon={this.getSortIcon("userCount")}
onClick={this.sortByFactory("userCount")}
intent={this.getSortIntent("userCount")}
@ -96,7 +97,7 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
<StatusCountColumn>
Statuses
<Button
minimal={true}
minimal
icon={this.getSortIcon("statusCount")}
onClick={this.sortByFactory("statusCount")}
intent={this.getSortIntent("statusCount")}
@ -105,7 +106,7 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
<InsularityColumn>
Insularity
<Button
minimal={true}
minimal
icon={this.getSortIcon("insularity")}
onClick={this.sortByFactory("insularity")}
intent={this.getSortIntent("insularity")}
@ -114,7 +115,7 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
</tr>
</thead>
<tbody>
{instances.map(i => (
{instances.map((i: InstanceDetails) => (
<tr key={i.name} onClick={this.goToInstanceFactory(i.name)}>
<td>{i.name}</td>
<td>{i.type && <InstanceType type={i.type} />}</td>
@ -134,7 +135,7 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
</p>
<ButtonGroup>
{zip(pagesToDisplay, pagesToDisplay.slice(1)).map(([page, nextPage], idx) => {
{zip(pagesToDisplay, pagesToDisplay.slice(1)).map(([page, nextPage]) => {
if (page === undefined) {
return null;
}
@ -152,8 +153,8 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
{page}
</Button>
{isEndOfSection && (
<Button disabled={true} key={"..."}>
{"..."}
<Button disabled key="...">
...
</Button>
)}
</>
@ -187,20 +188,19 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
const { instanceListSort } = this.props;
if (instanceListSort.field !== field) {
return IconNames.SORT;
} else if (instanceListSort.direction === "asc") {
return IconNames.SORT_ASC;
} else {
return IconNames.SORT_DESC;
}
if (instanceListSort.direction === "asc") {
return IconNames.SORT_ASC;
}
return IconNames.SORT_DESC;
};
private getSortIntent = (field: SortField) => {
const { instanceListSort } = this.props;
if (instanceListSort.field === field) {
return Intent.PRIMARY;
} else {
return Intent.NONE;
}
return Intent.NONE;
};
private getPagesToDisplay = (totalPages: number, currentPage: number) => {
@ -214,24 +214,19 @@ class InstanceTable extends React.PureComponent<IInstanceTableProps> {
const pagesToDisplay = firstPages.concat(surroundingPages).concat(lastPages);
return sortedUniq(sortBy(pagesToDisplay, n => n));
return sortedUniq(sortBy(pagesToDisplay, (n) => n));
};
}
const mapStateToProps = (state: IAppState) => {
return {
instanceListSort: state.data.instanceListSort,
instancesResponse: state.data.instancesResponse,
isLoading: state.data.isLoadingInstanceList,
loadError: state.data.instanceListLoadError
};
};
const mapStateToProps = (state: AppState) => ({
instanceListSort: state.data.instanceListSort,
instancesResponse: state.data.instancesResponse,
isLoading: state.data.isLoadingInstanceList,
loadError: state.data.instanceListLoadError,
});
const mapDispatchToProps = (dispatch: Dispatch) => ({
loadInstanceList: (page?: number, sort?: IInstanceSort) => dispatch(loadInstanceList(page, sort) as any),
navigate: (path: string) => dispatch(push(path))
loadInstanceList: (page?: number, sort?: InstanceSort) => dispatch(loadInstanceList(page, sort) as any),
navigate: (path: string) => dispatch(push(path)),
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(InstanceTable);
export default connect(mapStateToProps, mapDispatchToProps)(InstanceTable);

18
frontend/src/components/organisms/Nav.tsx
View File

@ -1,21 +1,19 @@
import * as React from "react";
import { Alignment, Navbar } from "@blueprintjs/core";
import { Alignment, Navbar, Classes } from "@blueprintjs/core";
import { IconNames } from "@blueprintjs/icons";
import { Classes } from "@blueprintjs/core";
import { match, NavLink } from "react-router-dom";
import { IInstanceDomainPath } from "../../constants";
import { InstanceDomainPath } from "../../constants";
interface INavState {
interface NavState {
aboutIsOpen: boolean;
}
const graphIsActive = (currMatch: match<IInstanceDomainPath>, location: Location) => {
return location.pathname === "/" || location.pathname.startsWith("/instance/");
};
const graphIsActive = (currMatch: match<InstanceDomainPath>, location: Location) =>
location.pathname === "/" || location.pathname.startsWith("/instance/");
class Nav extends React.Component<{}, INavState> {
class Nav extends React.Component<{}, NavState> {
constructor(props: any) {
super(props);
this.state = { aboutIsOpen: false };
@ -23,7 +21,7 @@ class Nav extends React.Component<{}, INavState> {
public render() {
return (
<Navbar fixedToTop={true}>
<Navbar fixedToTop>
<Navbar.Group align={Alignment.LEFT}>
<Navbar.Heading>fediverse.space</Navbar.Heading>
<Navbar.Divider />
@ -46,7 +44,7 @@ class Nav extends React.Component<{}, INavState> {
to="/about"
className={`${Classes.BUTTON} ${Classes.MINIMAL} bp3-icon-${IconNames.INFO_SIGN}`}
activeClassName={Classes.INTENT_PRIMARY}
exact={true}
exact
>
About
</NavLink>

26
frontend/src/components/organisms/SearchFilters.tsx
View File

@ -3,7 +3,7 @@ import { IconNames } from "@blueprintjs/icons";
import React, { MouseEvent } from "react";
import styled from "styled-components";
import { INSTANCE_TYPES } from "../../constants";
import { getSearchFilterDisplayValue, ISearchFilter } from "../../searchFilters";
import { getSearchFilterDisplayValue, SearchFilter } from "../../searchFilters";
import { getTypeDisplayString } from "../../util";
const SearchFilterContainer = styled.div`
@ -19,30 +19,30 @@ const StyledTag = styled(Tag)`
margin-left: 5px;
`;
interface ISearchFiltersProps {
selectedFilters: ISearchFilter[];
selectFilter: (filter: ISearchFilter) => void;
interface SearchFiltersProps {
selectedFilters: SearchFilter[];
selectFilter: (filter: SearchFilter) => void;
deselectFilter: (e: MouseEvent<HTMLButtonElement>, props: ITagProps) => void;
}
const SearchFilters: React.FC<ISearchFiltersProps> = ({ selectedFilters, selectFilter, deselectFilter }) => {
const hasInstanceTypeFilter = selectedFilters.some(sf => sf.field === "type");
const SearchFilters: React.FC<SearchFiltersProps> = ({ selectedFilters, selectFilter, deselectFilter }) => {
const hasInstanceTypeFilter = selectedFilters.some((sf) => sf.field === "type");
const handleSelectInstanceType = (e: MouseEvent<HTMLElement>) => {
const field = "type";
const relation = "eq";
const value = e.currentTarget.innerText.toLowerCase().replace(" ", "");
const filter: ISearchFilter = {
const filter: SearchFilter = {
displayValue: getSearchFilterDisplayValue(field, relation, value),
field,
relation,
value
value,
};
selectFilter(filter);
};
const renderMenu = () => (
<Menu>
<MenuItem icon={IconNames.SYMBOL_CIRCLE} text="Instance type" disabled={hasInstanceTypeFilter}>
{INSTANCE_TYPES.map(t => (
{INSTANCE_TYPES.map((t) => (
<MenuItem key={t} text={getTypeDisplayString(t)} onClick={handleSelectInstanceType} />
))}
</MenuItem>
@ -51,15 +51,15 @@ const SearchFilters: React.FC<ISearchFiltersProps> = ({ selectedFilters, selectF
return (
<SearchFilterContainer>
<TagContainer>
{selectedFilters.map(filter => (
<StyledTag key={filter.displayValue} minimal={true} onRemove={deselectFilter}>
{selectedFilters.map((filter) => (
<StyledTag key={filter.displayValue} minimal onRemove={deselectFilter}>
{filter.displayValue}
</StyledTag>
))}
</TagContainer>
<Popover autoFocus={false} content={renderMenu()} position={Position.BOTTOM}>
<Button minimal={true} icon={IconNames.FILTER}>
{"Add filter"}
<Button minimal icon={IconNames.FILTER}>
Add filter
</Button>
</Popover>
</SearchFilterContainer>

12
frontend/src/components/organisms/SidebarContainer.tsx
View File

@ -17,11 +17,9 @@ const StyledCard = styled(Card)`
display: flex;
flex-direction: column;
`;
const SidebarContainer: React.FC = ({ children }) => {
return (
<RightDiv>
<StyledCard elevation={Elevation.TWO}>{children}</StyledCard>
</RightDiv>
);
};
const SidebarContainer: React.FC = ({ children }) => (
<RightDiv>
<StyledCard elevation={Elevation.TWO}>{children}</StyledCard>
</RightDiv>
);
export default SidebarContainer;

11
frontend/src/components/screens/AboutScreen.tsx
View File

@ -2,9 +2,9 @@ import { Classes, Code, H1, H2, H4 } from "@blueprintjs/core";
import * as React from "react";
import styled from "styled-components";
// import appsignalLogo from "../../assets/appsignal.svg";
import gitlabLogo from "../../assets/gitlab.png";
import nlnetLogo from "../../assets/nlnet.png";
import { Page } from "../atoms/";
import * as gitlabLogo from "../../assets/gitlab.png";
import * as nlnetLogo from "../../assets/nlnet.png";
import { Page } from "../atoms";
const SponsorContainer = styled.div`
margin-bottom: 20px;
@ -36,10 +36,11 @@ const AboutScreen: React.FC = () => (
<br />
<H2>FAQ</H2>
<H4>Why can't I see details about my instance?</H4>
<H4>Why can&apos;t I see details about my instance?</H4>
<p className={Classes.RUNNING_TEXT}>
fediverse.space only supports servers using the Mastodon API, the Misskey API, the GNU Social API, or Nodeinfo.
Instances with 10 or fewer users won't be scraped -- it's a tool for understanding communities, not individuals.
Instances with 10 or fewer users won&apos;t be scraped -- it&apos;s a tool for understanding communities, not
individuals.
</p>
<H4>

47
frontend/src/components/screens/AdminScreen.tsx
View File

@ -17,7 +17,7 @@ const ButtonContainer = styled.div`
justify-content: space-between;
`;
interface IAdminSettings {
interface AdminSettings {
domain: string;
optIn: boolean;
optOut: boolean;
@ -25,26 +25,26 @@ interface IAdminSettings {
statusCount: number;
}
interface IAdminScreenProps {
interface AdminScreenProps {
navigate: (path: string) => void;
}
interface IAdminScreenState {
settings?: IAdminSettings;
interface AdminScreenState {
settings?: AdminSettings;
isUpdating: boolean;
}
class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenState> {
class AdminScreen extends React.PureComponent<AdminScreenProps, AdminScreenState> {
private authToken = getAuthToken();
public constructor(props: IAdminScreenProps) {
public constructor(props: AdminScreenProps) {
super(props);
this.state = { isUpdating: false };
}
public componentDidMount() {
// Load instance settings from server
if (!!this.authToken) {
getFromApi(`admin`, this.authToken!)
.then(response => {
if (this.authToken) {
getFromApi(`admin`, this.authToken)
.then((response) => {
this.setState({ settings: response });
})
.catch(() => {
@ -52,7 +52,7 @@ class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenSta
icon: IconNames.ERROR,
intent: Intent.DANGER,
message: "Failed to load settings.",
timeout: 0
timeout: 0,
});
unsetAuthToken();
});
@ -78,7 +78,7 @@ class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenSta
<Switch
id="opt-in-switch"
checked={!!settings.optIn}
large={true}
large
label="Opt in"
disabled={!!isUpdating}
onChange={this.updateOptIn}
@ -89,7 +89,7 @@ class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenSta
<Switch
id="opt-out-switch"
checked={!!settings.optOut}
large={true}
large
label="Opt out"
disabled={!!isUpdating}
onChange={this.updateOptOut}
@ -116,9 +116,9 @@ class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenSta
}
private updateOptIn = (e: React.FormEvent<HTMLInputElement>) => {
const settings = this.state.settings as IAdminSettings;
const settings = this.state.settings as AdminSettings;
const optIn = e.currentTarget.checked;
let optOut = settings.optOut;
let { optOut } = settings;
if (optIn) {
optOut = false;
}
@ -126,9 +126,9 @@ class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenSta
};
private updateOptOut = (e: React.FormEvent<HTMLInputElement>) => {
const settings = this.state.settings as IAdminSettings;
const settings = this.state.settings as AdminSettings;
const optOut = e.currentTarget.checked;
let optIn = settings.optIn;
let { optIn } = settings;
if (optOut) {
optIn = false;
}
@ -140,15 +140,15 @@ class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenSta
this.setState({ isUpdating: true });
const body = {
optIn: this.state.settings!.optIn,
optOut: this.state.settings!.optOut
optOut: this.state.settings!.optOut,
};
postToApi(`admin`, body, this.authToken!)
.then(response => {
.then((response) => {
this.setState({ settings: response, isUpdating: false });
AppToaster.show({
icon: IconNames.TICK,
intent: Intent.SUCCESS,
message: "Successfully updated settings."
message: "Successfully updated settings.",
});
})
.catch(() => {
@ -161,16 +161,13 @@ class AdminScreen extends React.PureComponent<IAdminScreenProps, IAdminScreenSta
unsetAuthToken();
AppToaster.show({
icon: IconNames.LOG_OUT,
message: "Logged out."
message: "Logged out.",
});
this.props.navigate("/admin/login");
};
}
const mapDispatchToProps = (dispatch: Dispatch) => ({
navigate: (path: string) => dispatch(push(path))
navigate: (path: string) => dispatch(push(path)),
});
export default connect(
undefined,
mapDispatchToProps
)(AdminScreen);
export default connect(undefined, mapDispatchToProps)(AdminScreen);

29
frontend/src/components/screens/GraphScreen.tsx
View File

@ -7,9 +7,9 @@ import { Route, RouteComponentProps, Switch, withRouter } from "react-router";
import { InstanceScreen, SearchScreen } from ".";
import { INSTANCE_DOMAIN_PATH } from "../../constants";
import { loadInstance } from "../../redux/actions";
import { IAppState } from "../../redux/types";
import { AppState } from "../../redux/types";
import { domainMatchSelector, isSmallScreen } from "../../util";
import { Graph, SidebarContainer } from "../organisms/";
import { Graph, SidebarContainer } from "../organisms";
const GraphContainer = styled.div`
display: flex;
@ -24,13 +24,13 @@ const FullDiv = styled.div`
right: 0;
`;
interface IGraphScreenProps extends RouteComponentProps {
interface GraphScreenProps extends RouteComponentProps {
currentInstanceName: string | null;
pathname: string;
graphLoadError: boolean;
loadInstance: (domain: string | null) => void;
}
interface IGraphScreenState {
interface GraphScreenState {
hasBeenViewed: boolean;
}
/**
@ -41,8 +41,8 @@ interface IGraphScreenState {
* However, if it's not the first page viewed (e.g. if someone opens directly on /about) we don't want to render the
* graph since it slows down everything else!
*/
class GraphScreenImpl extends React.Component<IGraphScreenProps, IGraphScreenState> {
public constructor(props: IGraphScreenProps) {
class GraphScreenImpl extends React.Component<GraphScreenProps, GraphScreenState> {
public constructor(props: GraphScreenProps) {
super(props);
this.state = { hasBeenViewed: false };
}
@ -56,7 +56,7 @@ class GraphScreenImpl extends React.Component<IGraphScreenProps, IGraphScreenSta
this.loadCurrentInstance();
}
public componentDidUpdate(prevProps: IGraphScreenProps) {
public componentDidUpdate(prevProps: GraphScreenProps) {
this.setHasBeenViewed();
this.loadCurrentInstance(prevProps.currentInstanceName);
}
@ -72,7 +72,7 @@ class GraphScreenImpl extends React.Component<IGraphScreenProps, IGraphScreenSta
}
};
private renderRoutes = ({ location }: RouteComponentProps) => (
private renderRoutes = () => (
<FullDiv>
<GraphContainer>
{/* Smaller screens never load the entire graph. Instead, `InstanceScreen` shows only the neighborhood. */}
@ -80,7 +80,7 @@ class GraphScreenImpl extends React.Component<IGraphScreenProps, IGraphScreenSta
<SidebarContainer>
<Switch>
<Route path={INSTANCE_DOMAIN_PATH} component={InstanceScreen} />
<Route exact={true} path="/" component={SearchScreen} />
<Route exact path="/" component={SearchScreen} />
</Switch>
</SidebarContainer>
</GraphContainer>
@ -94,19 +94,16 @@ class GraphScreenImpl extends React.Component<IGraphScreenProps, IGraphScreenSta
};
}
const mapStateToProps = (state: IAppState) => {
const mapStateToProps = (state: AppState) => {
const match = domainMatchSelector(state);
return {
currentInstanceName: match && match.params.domain,
graphLoadError: state.data.graphLoadError,
pathname: state.router.location.pathname
pathname: state.router.location.pathname,
};
};
const mapDispatchToProps = (dispatch: Dispatch) => ({
loadInstance: (domain: string | null) => dispatch(loadInstance(domain) as any)
loadInstance: (domain: string | null) => dispatch(loadInstance(domain) as any),
});
const GraphScreen = connect(
mapStateToProps,
mapDispatchToProps
)(GraphScreenImpl);
const GraphScreen = connect(mapStateToProps, mapDispatchToProps)(GraphScreenImpl);
export default withRouter(GraphScreen);

193
frontend/src/components/screens/InstanceScreen.tsx
View File

@ -20,7 +20,7 @@ import {
Spinner,
Tab,
Tabs,
Tooltip
Tooltip,
} from "@blueprintjs/core";
import { IconNames } from "@blueprintjs/icons";
@ -28,10 +28,10 @@ import { push } from "connected-react-router";
import { Link } from "react-router-dom";
import { Dispatch } from "redux";
import styled from "styled-components";
import { IAppState, IGraph, IGraphResponse, IInstanceDetails } from "../../redux/types";
import { AppState, Graph, GraphResponse, InstanceDetails, Peer } from "../../redux/types";
import { domainMatchSelector, getFromApi, isSmallScreen } from "../../util";
import { InstanceType } from "../atoms";
import { Cytoscape, ErrorState } from "../molecules/";
import { Cytoscape, ErrorState } from "../molecules";
import { FederationTab } from "../organisms";
const InstanceScreenContainer = styled.div`
@ -82,25 +82,25 @@ const StyledGraphContainer = styled.div`
flex-direction: column;
margin-bottom: 10px;
`;
interface IInstanceScreenProps {
graph?: IGraph;
interface InstanceScreenProps {
graph?: Graph;
instanceName: string | null;
instanceLoadError: boolean;
instanceDetails: IInstanceDetails | null;
instanceDetails: InstanceDetails | null;
isLoadingInstanceDetails: boolean;
navigateToRoot: () => void;
navigateToInstance: (domain: string) => void;
}
interface IInstanceScreenState {
interface InstanceScreenState {
neighbors?: string[];
isProcessingNeighbors: boolean;
// Local (neighborhood) graph. Used only on small screens (mobile devices).
isLoadingLocalGraph: boolean;
localGraph?: IGraph;
localGraph?: Graph;
localGraphLoadError?: boolean;
}
class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInstanceScreenState> {
public constructor(props: IInstanceScreenProps) {
class InstanceScreenImpl extends React.PureComponent<InstanceScreenProps, InstanceScreenState> {
public constructor(props: InstanceScreenProps) {
super(props);
this.state = { isProcessingNeighbors: false, isLoadingLocalGraph: false, localGraphLoadError: false };
}
@ -116,9 +116,9 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
!this.props.instanceDetails.status
) {
content = <ErrorState />;
} else if (this.props.instanceDetails.status.toLowerCase().indexOf("personal instance") > -1) {
} else if (this.props.instanceDetails.status.toLowerCase().includes("personal instance")) {
content = this.renderPersonalInstanceErrorState();
} else if (this.props.instanceDetails.status.toLowerCase().indexOf("robots.txt") > -1) {
} else if (this.props.instanceDetails.status.toLowerCase().includes("robots.txt")) {
content = this.renderRobotsTxtState();
} else if (this.props.instanceDetails.status !== "success") {
content = this.renderMissingDataState();
@ -130,7 +130,7 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
<HeadingContainer>
<StyledHeadingH2>{this.props.instanceName}</StyledHeadingH2>
<StyledHeadingTooltip content="Open link in new tab" position={Position.TOP} className={Classes.DARK}>
<AnchorButton icon={IconNames.LINK} minimal={true} onClick={this.openInstanceLink} />
<AnchorButton icon={IconNames.LINK} minimal onClick={this.openInstanceLink} />
</StyledHeadingTooltip>
<StyledCloseButton icon={IconNames.CROSS} onClick={this.props.navigateToRoot} />
</HeadingContainer>
@ -145,7 +145,7 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
this.processEdgesToFindNeighbors();
}
public componentDidUpdate(prevProps: IInstanceScreenProps, prevState: IInstanceScreenState) {
public componentDidUpdate(prevProps: InstanceScreenProps, prevState: InstanceScreenState) {
const isNewInstance = prevProps.instanceName !== this.props.instanceName;
const receivedNewEdges = !!this.props.graph && !this.state.isProcessingNeighbors && !this.state.neighbors;
const receivedNewLocalGraph = !!this.state.localGraph && !prevState.localGraph;
@ -164,10 +164,13 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
}
this.setState({ isProcessingNeighbors: true });
const graphToUse = !!graph ? graph : localGraph;
const edges = graphToUse!.edges.filter(e => [e.data.source, e.data.target].indexOf(instanceName!) > -1);
const graphToUse = graph || localGraph;
if (!graphToUse) {
return;
}
const edges = graphToUse.edges.filter((e) => [e.data.source, e.data.target].includes(instanceName));
const neighbors: any[] = [];
edges.forEach(e => {
edges.forEach((e) => {
if (e.data.source === instanceName) {
neighbors.push({ neighbor: e.data.target, weight: e.data.weight });
} else {
@ -183,39 +186,38 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
}
this.setState({ isLoadingLocalGraph: true });
getFromApi(`graph/${this.props.instanceName}`)
.then((response: IGraphResponse) => {
.then((response: GraphResponse) => {
// We do some processing of edges here to make sure that every edge's source and target are in the neighborhood
// We could (and should) be doing this in the backend, but I don't want to mess around with complex SQL
// queries.
// TODO: think more about moving the backend to a graph database that would make this easier.
const graph = response.graph;
const nodeIds = new Set(graph.nodes.map(n => n.data.id));
const edges = graph.edges.filter(e => nodeIds.has(e.data.source) && nodeIds.has(e.data.target));
const { graph } = response;
const nodeIds = new Set(graph.nodes.map((n) => n.data.id));
const edges = graph.edges.filter((e) => nodeIds.has(e.data.source) && nodeIds.has(e.data.target));
this.setState({ isLoadingLocalGraph: false, localGraph: { ...graph, edges } });
})
.catch(() => this.setState({ isLoadingLocalGraph: false, localGraphLoadError: true }));
};
private renderTabs = () => {
const { instanceDetails } = this.props;
const hasNeighbors = this.state.neighbors && this.state.neighbors.length > 0;
const federationRestrictions = this.props.instanceDetails && this.props.instanceDetails.federationRestrictions;
const federationRestrictions = instanceDetails && instanceDetails.federationRestrictions;
const hasLocalGraph =
!!this.state.localGraph && this.state.localGraph.nodes.length > 0 && this.state.localGraph.edges.length > 0;
const insularCallout =
this.props.graph && !this.state.isProcessingNeighbors && !hasNeighbors && !hasLocalGraph ? (
<StyledCallout icon={IconNames.INFO_SIGN} title="Insular instance">
<p>This instance doesn't have any neighbors that we know of, so it's hidden from the graph.</p>
<p>This instance doesn&apos;t have any neighbors that we know of, so it&apos;s hidden from the graph.</p>
</StyledCallout>
) : (
undefined
);
) : undefined;
return (
<>
{insularCallout}
{this.maybeRenderLocalGraph()}
<StyledTabs>
{this.props.instanceDetails!.description && (
{instanceDetails && instanceDetails.description && (
<Tab id="description" title="Description" panel={this.renderDescription()} />
)}
{this.shouldRenderStats() && <Tab id="stats" title="Details" panel={this.renderVersionAndCounts()} />}
@ -232,7 +234,7 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
<StyledLinkToFdNetwork>
<AnchorButton
href={`https://fediverse.network/${this.props.instanceName}`}
minimal={true}
minimal
rightIcon={IconNames.SHARE}
target="_blank"
text="See more statistics at fediverse.network"
@ -244,18 +246,17 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
private maybeRenderLocalGraph = () => {
const { localGraph } = this.state;
const hasLocalGraph =
!!this.state.localGraph && this.state.localGraph.nodes.length > 0 && this.state.localGraph.edges.length > 0;
if (!hasLocalGraph) {
const hasLocalGraph = !!localGraph && localGraph.nodes.length > 0 && localGraph.edges.length > 0;
if (!hasLocalGraph || !localGraph) {
return;
}
return (
<StyledGraphContainer aria-hidden={true}>
<StyledGraphContainer aria-hidden>
<Cytoscape
elements={localGraph!}
elements={localGraph}
currentNodeId={this.props.instanceName}
navigateToInstancePath={this.props.navigateToInstance}
showEdges={true}
showEdges
/>
<Divider />
</StyledGraphContainer>
@ -268,7 +269,11 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
};
private renderDescription = () => {
const description = this.props.instanceDetails!.description;
const { instanceDetails } = this.props;
if (!instanceDetails) {
return;
}
const { description } = instanceDetails;
if (!description) {
return;
}
@ -288,10 +293,10 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
insularity,
type,
statusesPerDay,
statusesPerUserPerDay
statusesPerUserPerDay,
} = this.props.instanceDetails;
return (
<StyledHTMLTable small={true} striped={true}>
<StyledHTMLTable small striped>
<tbody>
<tr>
<td>Version</td>
@ -299,7 +304,7 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
</tr>
<tr>
<td>Instance type</td>
<td>{(type && <InstanceType type={type} colorAfterName={true} />) || "Unknown"}</td>
<td>{(type && <InstanceType type={type} colorAfterName />) || "Unknown"}</td>
</tr>
<tr>
<td>Users</td>
@ -311,7 +316,8 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
</tr>
<tr>
<td>
Insularity{" "}
Insularity
{" "}
<Tooltip
content={
<span>
@ -330,7 +336,8 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
</tr>
<tr>
<td>
Statuses / day{" "}
Statuses / day
{" "}
<Tooltip
content={
<span>
@ -349,7 +356,8 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
</tr>
<tr>
<td>
Statuses / person / day{" "}
Statuses / person / day
{" "}
<Tooltip
content={
<span>
@ -372,7 +380,7 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
</tr>
<tr>
<td>Last updated</td>
<td>{moment(lastUpdated + "Z").fromNow() || "Unknown"}</td>
<td>{moment(`${lastUpdated}Z`).fromNow() || "Unknown"}</td>
</tr>
</tbody>
</StyledHTMLTable>
@ -412,7 +420,7 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
would mean that every single status on {this.props.instanceName} contained a mention of someone on the other
instance, and vice versa.
</p>
<StyledHTMLTable small={true} striped={true} interactive={false}>
<StyledHTMLTable small striped interactive={false}>
<thead>
<tr>
<th>Instance</th>
@ -426,11 +434,15 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
};
private renderPeers = () => {
const peers = this.props.instanceDetails!.peers;
const { instanceDetails } = this.props;
if (!instanceDetails) {
return;
}
const { peers } = instanceDetails;
if (!peers || peers.length === 0) {
return;
}
const peerRows = peers.map(instance => (
const peerRows = peers.map((instance: Peer) => (
<tr key={instance.name}>
<td>
<Link to={`/instance/${instance.name}`} className={`${Classes.BUTTON} ${Classes.MINIMAL}`} role="button">
@ -444,7 +456,7 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
<p className={Classes.TEXT_MUTED}>
All the instances, past and present, that {this.props.instanceName} knows about.
</p>
<StyledHTMLTable small={true} striped={true} interactive={false} className="fediverse-sidebar-table">
<StyledHTMLTable small striped interactive={false} className="fediverse-sidebar-table">
<tbody>{peerRows}</tbody>
</StyledHTMLTable>
</div>
@ -453,71 +465,62 @@ class InstanceScreenImpl extends React.PureComponent<IInstanceScreenProps, IInst
private renderLoadingState = () => <NonIdealState icon={<Spinner />} />;
private renderPersonalInstanceErrorState = () => {
return (
<NonIdealState
icon={IconNames.BLOCKED_PERSON}
title="No data"
description="This instance has fewer than 10 users. It was not crawled in order to protect their privacy, but if it's your instance you can opt in."
action={
<Link to={"/admin"} className={Classes.BUTTON} role="button">
{"Opt in"}
</Link>
}
/>
);
};
private renderPersonalInstanceErrorState = () => (
<NonIdealState
icon={IconNames.BLOCKED_PERSON}
title="No data"
description="This instance has fewer than 10 users. It was not crawled in order to protect their privacy, but if it's your instance you can opt in."
action={
<Link to="/admin" className={Classes.BUTTON} role="button">
Opt in
</Link>
}
/>
);
private renderMissingDataState = () => {
return (
<>
<NonIdealState
icon={IconNames.ERROR}
title="No data"
description="This instance could not be crawled. Either it was down or it's an instance type we don't support yet."
/>
<span className="sidebar-hidden-instance-status" style={{ display: "none" }}>
{this.props.instanceDetails && this.props.instanceDetails.status}
private renderMissingDataState = () => (
<>
<NonIdealState
icon={IconNames.ERROR}
title="No data"
description="This instance could not be crawled. Either it was down or it's an instance type we don't support yet."
/>
<span className="sidebar-hidden-instance-status" style={{ display: "none" }}>
{this.props.instanceDetails && this.props.instanceDetails.status}
</span>
</>
);
private renderRobotsTxtState = () => (
<NonIdealState
icon={
<span role="img" aria-label="robot">
🤖
</span>
</>
);
};
private renderRobotsTxtState = () => {
return (
<NonIdealState
icon={
<span role="img" aria-label="robot">
🤖
</span>
}
title="No data"
description="This instance was not crawled because its robots.txt did not allow us to."
/>
);
};
}
title="No data"
description="This instance was not crawled because its robots.txt did not allow us to."
/>
);
private openInstanceLink = () => {
window.open("https://" + this.props.instanceName, "_blank");
window.open(`https://${this.props.instanceName}`, "_blank");
};
}
const mapStateToProps = (state: IAppState) => {
const mapStateToProps = (state: AppState) => {
const match = domainMatchSelector(state);
return {
graph: state.data.graphResponse && state.data.graphResponse.graph,
instanceDetails: state.currentInstance.currentInstanceDetails,
instanceLoadError: state.currentInstance.error,
instanceName: match && match.params.domain,
isLoadingInstanceDetails: state.currentInstance.isLoadingInstanceDetails
isLoadingInstanceDetails: state.currentInstance.isLoadingInstanceDetails,
};
};
const mapDispatchToProps = (dispatch: Dispatch) => ({
navigateToInstance: (domain: string) => dispatch(push(`/instance/${domain}`)),
navigateToRoot: () => dispatch(push("/"))
navigateToRoot: () => dispatch(push("/")),
});
const InstanceScreen = connect(
mapStateToProps,
mapDispatchToProps
)(InstanceScreenImpl);
const InstanceScreen = connect(mapStateToProps, mapDispatchToProps)(InstanceScreenImpl);
export default InstanceScreen;

50
frontend/src/components/screens/LoginScreen.tsx
View File

@ -8,11 +8,11 @@ import { getAuthToken, getFromApi, postToApi } from "../../util";
import { Page } from "../atoms";
import { ErrorState } from "../molecules";
interface IFormContainerProps {
interface FormContainerProps {
error: boolean;
}
const FormContainer = styled.div<IFormContainerProps>`
${props => (props.error ? "margin: 20px auto 0 auto;" : "margin-top: 20px;")}
const FormContainer = styled.div<FormContainerProps>`
${(props) => (props.error ? "margin: 20px auto 0 auto;" : "margin-top: 20px;")}
`;
const LoginTypeContainer = styled.div`
display: flex;
@ -31,23 +31,28 @@ const StyledIcon = styled(Icon)`
margin-bottom: 10px;
`;
interface ILoginTypes {
interface LoginTypes {
domain: string;
email?: string;
fediverseAccount?: string;
}
interface ILoginScreenState {
interface LoginScreenState {
domain: string;
isGettingLoginTypes: boolean;
isSendingLoginRequest: boolean;
loginTypes?: ILoginTypes;
loginTypes?: LoginTypes;
selectedLoginType?: "email" | "fediverseAccount";
error: boolean;
}
class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
class LoginScreen extends React.PureComponent<{}, LoginScreenState> {
public constructor(props: any) {
super(props);
this.state = { domain: "", error: false, isGettingLoginTypes: false, isSendingLoginRequest: false };
this.state = {
domain: "",
error: false,
isGettingLoginTypes: false,
isSendingLoginRequest: false,
};
}
public render() {
@ -59,13 +64,13 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
const { error, loginTypes, isSendingLoginRequest, selectedLoginType } = this.state;
let content;
if (!!error) {
if (error) {
content = (
<ErrorState description="This could be because the instance is down. If not, please reload the page and try again." />
);
} else if (!!selectedLoginType && !isSendingLoginRequest) {
content = this.renderPostLogin();
} else if (!!loginTypes) {
} else if (loginTypes) {
content = this.renderChooseLoginType();
} else {
content = this.renderChooseInstance();
@ -78,7 +83,7 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
You must be the instance admin to manage how fediverse.space interacts with your instance.
</p>
<p className={Classes.RUNNING_TEXT}>
It's currently only possible to administrate Mastodon and Pleroma instances. If you want to login with a
It&apos;s currently only possible to administrate Mastodon and Pleroma instances. If you want to login with a
direct message, your instance must federate with mastodon.social and vice versa.
</p>
<p className={Classes.RUNNING_TEXT}>
@ -95,7 +100,7 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
const onButtonClick = () => this.getLoginTypes();
return (
<form onSubmit={this.getLoginTypes}>
<FormGroup label="Instance domain" labelFor="domain-input" disabled={isGettingLoginTypes} inline={true}>
<FormGroup label="Instance domain" labelFor="domain-input" disabled={isGettingLoginTypes} inline>
<InputGroup
disabled={isGettingLoginTypes}
id="domain-input"
@ -104,7 +109,7 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
rightElement={
<Button
intent={Intent.PRIMARY}
minimal={true}
minimal
rightIcon={IconNames.ARROW_RIGHT}
title="submit"
loading={isGettingLoginTypes}
@ -130,18 +135,13 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
<H4>Choose an authentication method</H4>
<LoginTypeContainer>
{loginTypes.email && (
<LoginTypeButton
large={true}
icon={IconNames.ENVELOPE}
onClick={loginWithEmail}
loading={!!isSendingLoginRequest}
>
<LoginTypeButton large icon={IconNames.ENVELOPE} onClick={loginWithEmail} loading={!!isSendingLoginRequest}>
{`Email ${loginTypes.email}`}
</LoginTypeButton>
)}
{loginTypes.fediverseAccount && (
<LoginTypeButton
large={true}
large
icon={IconNames.GLOBE_NETWORK}
onClick={loginWithDm}
loading={!!isSendingLoginRequest}
@ -175,7 +175,7 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
};
private getLoginTypes = (e?: React.FormEvent<HTMLFormElement>) => {
if (!!e) {
if (e) {
e.preventDefault();
}
this.setState({ isGettingLoginTypes: true });
@ -184,8 +184,8 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
domain = domain.slice(8);
}
getFromApi(`admin/login/${domain.trim()}`)
.then(response => {
if (!!response.error) {
.then((response) => {
if (response.error) {
// Go to catch() below
throw new Error(response.error);
} else {
@ -196,7 +196,7 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
AppToaster.show({
icon: IconNames.ERROR,
intent: Intent.DANGER,
message: err.message
message: err.message,
});
this.setState({ isGettingLoginTypes: false });
});
@ -205,7 +205,7 @@ class LoginScreen extends React.PureComponent<{}, ILoginScreenState> {
private login = (type: "email" | "fediverseAccount") => {
this.setState({ isSendingLoginRequest: true, selectedLoginType: type });
postToApi("admin/login", { domain: this.state.loginTypes!.domain, type })
.then(response => {
.then((response) => {
if ("error" in response || "errors" in response) {
// Go to catch() below
throw new Error();

57
frontend/src/components/screens/SearchScreen.tsx
View File

@ -7,20 +7,20 @@ import { connect } from "react-redux";
import { Dispatch } from "redux";
import styled from "styled-components";
import { setResultHover, updateSearch } from "../../redux/actions";
import { IAppState, ISearchResultInstance } from "../../redux/types";
import { ISearchFilter } from "../../searchFilters";
import { AppState, SearchResultInstance } from "../../redux/types";
import { SearchFilter } from "../../searchFilters";
import { isSmallScreen } from "../../util";
import { SearchResult } from "../molecules";
import { SearchFilters } from "../organisms";
interface ISearchBarContainerProps {
interface SearchBarContainerProps {
hasSearchResults: boolean;
hasError: boolean;
}
const SearchBarContainer = styled.div<ISearchBarContainerProps>`
const SearchBarContainer = styled.div<SearchBarContainerProps>`
width: 80%;
text-align: center;
margin: ${props => (props.hasSearchResults || props.hasError ? "0 auto" : "auto")};
margin: ${(props) => (props.hasSearchResults || props.hasError ? "0 auto" : "auto")};
align-self: center;
`;
const SearchResults = styled.div`
@ -38,22 +38,22 @@ const CalloutContainer = styled.div`
text-align: left;
`;
interface ISearchScreenProps {
interface SearchScreenProps {
error: boolean;
isLoadingResults: boolean;
query: string;
hasMoreResults: boolean;
results: ISearchResultInstance[];
handleSearch: (query: string, filters: ISearchFilter[]) => void;
results: SearchResultInstance[];
handleSearch: (query: string, filters: SearchFilter[]) => void;
navigateToInstance: (domain: string) => void;
setIsHoveringOver: (domain?: string) => void;
}
interface ISearchScreenState {
interface SearchScreenState {
currentQuery: string;
searchFilters: ISearchFilter[];
searchFilters: SearchFilter[];
}
class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreenState> {
public constructor(props: ISearchScreenProps) {
class SearchScreen extends React.PureComponent<SearchScreenProps, SearchScreenState> {
public constructor(props: SearchScreenProps) {
super(props);
this.state = { currentQuery: "", searchFilters: [] };
}
@ -81,7 +81,7 @@ class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreen
} else if (!!results && results.length > 0) {
content = (
<SearchResults>
{results.map(result => (
{results.map((result) => (
<SearchResult
result={result}
key={result.name}
@ -92,7 +92,7 @@ class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreen
))}
{isLoadingResults && <StyledSpinner size={Spinner.SIZE_SMALL} />}
{!isLoadingResults && hasMoreResults && (
<Button onClick={this.search} minimal={true}>
<Button onClick={this.search} minimal>
Load more results
</Button>
)}
@ -104,13 +104,11 @@ class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreen
if (isLoadingResults) {
rightSearchBarElement = <Spinner size={Spinner.SIZE_SMALL} />;
} else if (query || error) {
rightSearchBarElement = (
<Button minimal={true} icon={IconNames.CROSS} onClick={this.clearQuery} aria-label="Search" />
);
rightSearchBarElement = <Button minimal icon={IconNames.CROSS} onClick={this.clearQuery} aria-label="Search" />;
} else {
rightSearchBarElement = (
<Button
minimal={true}
minimal
icon={IconNames.ARROW_RIGHT}
intent={Intent.PRIMARY}
onClick={this.search}
@ -127,7 +125,7 @@ class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreen
<InputGroup
leftIcon={IconNames.SEARCH}
rightElement={rightSearchBarElement}
large={true}
large
placeholder="Search instance names and descriptions"
aria-label="Search instance names and descriptions"
type="search"
@ -164,10 +162,10 @@ class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreen
this.setState({ currentQuery: "" }, () => this.props.handleSearch("", []));
};
private selectSearchFilter = (filter: ISearchFilter) => {
private selectSearchFilter = (filter: SearchFilter) => {
const { searchFilters } = this.state;
// Don't add the same filters twice
if (searchFilters.some(sf => isEqual(sf, filter))) {
if (searchFilters.some((sf) => isEqual(sf, filter))) {
return;
}
this.setState({ searchFilters: [...searchFilters, filter] }, this.search);
@ -176,9 +174,9 @@ class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreen
private deselectSearchFilter = (e: MouseEvent<HTMLButtonElement>) => {
const { searchFilters } = this.state;
const displayValueToRemove = get(e, "currentTarget.parentElement.innerText", "");
if (!!displayValueToRemove) {
if (displayValueToRemove) {
this.setState(
{ searchFilters: searchFilters.filter(sf => sf.displayValue !== displayValueToRemove) },
{ searchFilters: searchFilters.filter((sf) => sf.displayValue !== displayValueToRemove) },
this.search
);
}
@ -207,19 +205,16 @@ class SearchScreen extends React.PureComponent<ISearchScreenProps, ISearchScreen
);
}
const mapStateToProps = (state: IAppState) => ({
const mapStateToProps = (state: AppState) => ({
error: state.search.error,
hasMoreResults: !!state.search.next,
isLoadingResults: state.search.isLoadingResults,
query: state.search.query,
results: state.search.results
results: state.search.results,
});
const mapDispatchToProps = (dispatch: Dispatch) => ({
handleSearch: (query: string, filters: ISearchFilter[]) => dispatch(updateSearch(query, filters) as any),
handleSearch: (query: string, filters: SearchFilter[]) => dispatch(updateSearch(query, filters) as any),
navigateToInstance: (domain: string) => dispatch(push(`/instance/${domain}`)),
setIsHoveringOver: (domain?: string) => dispatch(setResultHover(domain))
setIsHoveringOver: (domain?: string) => dispatch(setResultHover(domain)),
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(SearchScreen);
export default connect(mapStateToProps, mapDispatchToProps)(SearchScreen);

4
frontend/src/components/screens/TableScreen.tsx
View File

@ -6,8 +6,8 @@ import { InstanceTable } from "../organisms";
class TableScreen extends React.PureComponent {
public render() {
return (
<Page fullWidth={true}>
<H1>{"Instances"}</H1>
<Page fullWidth>
<H1>Instances</H1>
<InstanceTable />
</Page>
);

19
frontend/src/components/screens/VerifyLoginScreen.tsx
View File

@ -1,20 +1,20 @@
import React, { useEffect, useState } from "react";
import { connect } from "react-redux";
import { Redirect } from "react-router";
import { IAppState } from "../../redux/types";
import { AppState } from "../../redux/types";
import { setAuthToken } from "../../util";
import { Page } from "../atoms";
interface IVerifyLoginScreenProps {
interface VerifyLoginScreenProps {
search: string;
}
const VerifyLoginScreen: React.FC<IVerifyLoginScreenProps> = ({ search }) => {
const VerifyLoginScreen: React.FC<VerifyLoginScreenProps> = ({ search }) => {
const [didSaveToken, setDidSaveToken] = useState(false);
const token = new URLSearchParams(search).get("token");
useEffect(() => {
// Save the auth token
if (!!token) {
if (token) {
setAuthToken(token);
setDidSaveToken(true);
}
@ -22,15 +22,14 @@ const VerifyLoginScreen: React.FC<IVerifyLoginScreenProps> = ({ search }) => {
if (!token) {
return <Redirect to="/admin/login" />;
} else if (!didSaveToken) {
}
if (!didSaveToken) {
return <Page />;
}
return <Redirect to="/admin" />;
};
const mapStateToProps = (state: IAppState) => {
return {
search: state.router.location.search
};
};
const mapStateToProps = (state: AppState) => ({
search: state.router.location.search,
});
export default connect(mapStateToProps)(VerifyLoginScreen);

8
frontend/src/constants.tsx
View File

@ -21,7 +21,7 @@ export const QUALITATIVE_COLOR_SCHEME = [
"#0E5A8A",
"#0A6640",
"#A66321",
"#A82A2A"
"#A82A2A",
];
// From https://blueprintjs.com/docs/#core/colors.sequential-color-schemes
@ -35,11 +35,11 @@ export const QUANTITATIVE_COLOR_SCHEME = [
"#C15B3F",
"#B64C2F",
"#AA3C1F",
"#9E2B0E"
"#9E2B0E",
];
export const INSTANCE_DOMAIN_PATH = "/instance/:domain";
export interface IInstanceDomainPath {
export interface InstanceDomainPath {
domain: string;
}
@ -55,5 +55,5 @@ export const INSTANCE_TYPES = [
"friendica",
"hubzilla",
"plume",
"wordpress"
"wordpress",
];

3
frontend/src/index.tsx
View File

@ -25,8 +25,7 @@ FocusStyleManager.onlyShowFocusOnTabs();
export const history = createBrowserHistory();
// Initialize redux
// @ts-ignore
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const composeEnhancers = (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(
createRootReducer(history),
composeEnhancers(applyMiddleware(routerMiddleware(history), thunk))

2
frontend/src/react-app-env.d.ts vendored
View File

@ -1 +1 @@
/// <reference types="react-scripts" />
// / <reference types="react-scripts" />

244
frontend/src/redux/actions.ts
View File

@ -2,171 +2,145 @@ import { isEqual } from "lodash";
import { Dispatch } from "redux";
import { push } from "connected-react-router";
import { ISearchFilter } from "../searchFilters";
import { SearchFilter } from "../searchFilters";
import { getFromApi } from "../util";
import { ActionType, IAppState, IGraph, IInstanceDetails, IInstanceSort, ISearchResponse } from "./types";
import { ActionType, AppState, Graph, InstanceDetails, InstanceSort, SearchResponse } from "./types";
// Instance details
const requestInstanceDetails = (instanceName: string) => {
return {
payload: instanceName,
type: ActionType.REQUEST_INSTANCE_DETAILS
};
};
const receiveInstanceDetails = (instanceDetails: IInstanceDetails) => {
return {
payload: instanceDetails,
type: ActionType.RECEIVE_INSTANCE_DETAILS
};
};
const instanceLoadFailed = () => {
return {
type: ActionType.INSTANCE_LOAD_ERROR
};
};
const deselectInstance = () => {
return {
type: ActionType.DESELECT_INSTANCE
};
};
const requestInstanceDetails = (instanceName: string) => ({
payload: instanceName,
type: ActionType.REQUEST_INSTANCE_DETAILS,
});
const receiveInstanceDetails = (instanceDetails: InstanceDetails) => ({
payload: instanceDetails,
type: ActionType.RECEIVE_INSTANCE_DETAILS,
});
const instanceLoadFailed = () => ({
type: ActionType.INSTANCE_LOAD_ERROR,
});
const deselectInstance = () => ({
type: ActionType.DESELECT_INSTANCE,
});
// Graph
const requestGraph = () => {
return {
type: ActionType.REQUEST_GRAPH
};
};
const receiveGraph = (graph: IGraph) => {
return {
payload: graph,
type: ActionType.RECEIVE_GRAPH
};
};
const graphLoadFailed = () => {
return {
type: ActionType.GRAPH_LOAD_ERROR
};
};
const requestGraph = () => ({
type: ActionType.REQUEST_GRAPH,
});
const receiveGraph = (graph: Graph) => ({
payload: graph,
type: ActionType.RECEIVE_GRAPH,
});
const graphLoadFailed = () => ({
type: ActionType.GRAPH_LOAD_ERROR,
});
// Instance list
const requestInstanceList = (sort?: IInstanceSort) => ({
const requestInstanceList = (sort?: InstanceSort) => ({
payload: sort,
type: ActionType.REQUEST_INSTANCES
type: ActionType.REQUEST_INSTANCES,
});
const receiveInstanceList = (instances: IInstanceDetails[]) => ({
const receiveInstanceList = (instances: InstanceDetails[]) => ({
payload: instances,
type: ActionType.RECEIVE_INSTANCES
type: ActionType.RECEIVE_INSTANCES,
});
const instanceListLoadFailed = () => ({
type: ActionType.INSTANCE_LIST_LOAD_ERROR
type: ActionType.INSTANCE_LIST_LOAD_ERROR,
});
// Search
const requestSearchResult = (query: string, filters: ISearchFilter[]) => {
return {
payload: { query, filters },
type: ActionType.REQUEST_SEARCH_RESULTS
};
};
const receiveSearchResults = (result: ISearchResponse) => {
return {
payload: result,
type: ActionType.RECEIVE_SEARCH_RESULTS
};
};
const searchFailed = () => {
return {
type: ActionType.SEARCH_RESULTS_ERROR
};
};
const requestSearchResult = (query: string, filters: SearchFilter[]) => ({
payload: { query, filters },
type: ActionType.REQUEST_SEARCH_RESULTS,
});
const receiveSearchResults = (result: SearchResponse) => ({
payload: result,
type: ActionType.RECEIVE_SEARCH_RESULTS,
});
const searchFailed = () => ({
type: ActionType.SEARCH_RESULTS_ERROR,
});
const resetSearch = () => {
return {
type: ActionType.RESET_SEARCH
};
};
const resetSearch = () => ({
type: ActionType.RESET_SEARCH,
});
export const setResultHover = (domain?: string) => {
return {
payload: domain,
type: ActionType.SET_SEARCH_RESULT_HOVER
};
};
export const setResultHover = (domain?: string) => ({
payload: domain,
type: ActionType.SET_SEARCH_RESULT_HOVER,
});
/** Async actions: https://redux.js.org/advanced/asyncactions */
export const loadInstance = (instanceName: string | null) => {
return (dispatch: Dispatch, getState: () => IAppState) => {
if (!instanceName) {
dispatch(deselectInstance());
if (getState().router.location.pathname.startsWith("/instance/")) {
dispatch(push("/"));
}
return;
export const loadInstance = (instanceName: string | null) => (dispatch: Dispatch, getState: () => AppState) => {
if (!instanceName) {
dispatch(deselectInstance());
if (getState().router.location.pathname.startsWith("/instance/")) {
dispatch(push("/"));
}
dispatch(requestInstanceDetails(instanceName));
return getFromApi("instances/" + instanceName)
.then(details => dispatch(receiveInstanceDetails(details)))
.catch(() => dispatch(instanceLoadFailed()));
};
return;
}
dispatch(requestInstanceDetails(instanceName));
return getFromApi(`instances/${instanceName}`)
.then((details) => dispatch(receiveInstanceDetails(details)))
.catch(() => dispatch(instanceLoadFailed()));
};
export const updateSearch = (query: string, filters: ISearchFilter[]) => {
return (dispatch: Dispatch, getState: () => IAppState) => {
query = query.trim();
export const updateSearch = (query: string, filters: SearchFilter[]) => (
dispatch: Dispatch,
getState: () => AppState
) => {
query = query.trim();
if (!query) {
dispatch(resetSearch());
return;
}
if (!query) {
dispatch(resetSearch());
return;
}
const prevQuery = getState().search.query;
const prevFilters = getState().search.filters;
const isNewQuery = prevQuery !== query || !isEqual(prevFilters, filters);
const prevQuery = getState().search.query;
const prevFilters = getState().search.filters;
const isNewQuery = prevQuery !== query || !isEqual(prevFilters, filters);
const next = getState().search.next;
let url = `search/?query=${query}`;
if (!isNewQuery && next) {
url += `&after=${next}`;
}
const { next } = getState().search;
let url = `search/?query=${query}`;
if (!isNewQuery && next) {
url += `&after=${next}`;
}
// Add filters
// The format is e.g. type_eq=mastodon or user_count_gt=1000
filters.forEach(filter => {
url += `&${filter.field}_${filter.relation}=${filter.value}`;
});
// Add filters
// The format is e.g. type_eq=mastodon or user_count_gt=1000
filters.forEach((filter) => {
url += `&${filter.field}_${filter.relation}=${filter.value}`;
});
dispatch(requestSearchResult(query, filters));
return getFromApi(url)
.then(result => dispatch(receiveSearchResults(result)))
.catch(() => dispatch(searchFailed()));
};
dispatch(requestSearchResult(query, filters));
return getFromApi(url)
.then((result) => dispatch(receiveSearchResults(result)))
.catch(() => dispatch(searchFailed()));
};
export const fetchGraph = () => {
return (dispatch: Dispatch) => {
dispatch(requestGraph());
return getFromApi("graph")
.then(graph => dispatch(receiveGraph(graph)))
.catch(() => dispatch(graphLoadFailed()));
};
export const fetchGraph = () => (dispatch: Dispatch) => {
dispatch(requestGraph());
return getFromApi("graph")
.then((graph) => dispatch(receiveGraph(graph)))
.catch(() => dispatch(graphLoadFailed()));
};
export const loadInstanceList = (page?: number, sort?: IInstanceSort) => {
return (dispatch: Dispatch, getState: () => IAppState) => {
sort = sort ? sort : getState().data.instanceListSort;
dispatch(requestInstanceList(sort));
const params: string[] = [];
if (!!page) {
params.push(`page=${page}`);
}
if (!!sort) {
params.push(`sortField=${sort.field}`);
params.push(`sortDirection=${sort.direction}`);
}
const path = !!params ? `instances?${params.join("&")}` : "instances";
return getFromApi(path)
.then(instancesListResponse => dispatch(receiveInstanceList(instancesListResponse)))
.catch(() => dispatch(instanceListLoadFailed()));
};
export const loadInstanceList = (page?: number, sort?: InstanceSort) => (
dispatch: Dispatch,
getState: () => AppState
) => {
sort = sort || getState().data.instanceListSort;
dispatch(requestInstanceList(sort));
const params: string[] = [];
if (page) {
params.push(`page=${page}`);
}
if (sort) {
params.push(`sortField=${sort.field}`);
params.push(`sortDirection=${sort.direction}`);
}
const path = params ? `instances?${params.join("&")}` : "instances";
return getFromApi(path)
.then((instancesListResponse) => dispatch(receiveInstanceList(instancesListResponse)))
.catch(() => dispatch(instanceListLoadFailed()));
};

49
frontend/src/redux/reducers.ts
View File

@ -3,34 +3,34 @@ import { isEqual } from "lodash";
import { combineReducers } from "redux";
import { History } from "history";
import { ActionType, IAction, ICurrentInstanceState, IDataState, ISearchState } from "./types";
import { ActionType, Action, CurrentInstanceState, DataState, SearchState } from "./types";
const initialDataState: IDataState = {
const initialDataState: DataState = {
graphLoadError: false,
instanceListLoadError: false,
instanceListSort: { field: "userCount", direction: "desc" },
isLoadingGraph: false,
isLoadingInstanceList: false
isLoadingInstanceList: false,
};
const data = (state: IDataState = initialDataState, action: IAction): IDataState => {
const data = (state: DataState = initialDataState, action: Action): DataState => {
switch (action.type) {
case ActionType.REQUEST_GRAPH:
return {
...state,
graphResponse: undefined,
isLoadingGraph: true
isLoadingGraph: true,
};
case ActionType.RECEIVE_GRAPH:
return {
...state,
graphResponse: action.payload,
isLoadingGraph: false
isLoadingGraph: false,
};
case ActionType.GRAPH_LOAD_ERROR:
return {
...state,
graphLoadError: true,
isLoadingGraph: false
isLoadingGraph: false,
};
case ActionType.REQUEST_INSTANCES:
return {
@ -38,71 +38,71 @@ const data = (state: IDataState = initialDataState, action: IAction): IDataState
instanceListLoadError: false,
instanceListSort: action.payload,
instancesResponse: undefined,
isLoadingInstanceList: true
isLoadingInstanceList: true,
};
case ActionType.RECEIVE_INSTANCES:
return {
...state,
instancesResponse: action.payload,
isLoadingInstanceList: false
isLoadingInstanceList: false,
};
case ActionType.INSTANCE_LIST_LOAD_ERROR:
return {
...state,
instanceListLoadError: true,
isLoadingInstanceList: false
isLoadingInstanceList: false,
};
default:
return state;
}
};
const initialCurrentInstanceState: ICurrentInstanceState = {
const initialCurrentInstanceState: CurrentInstanceState = {
currentInstanceDetails: null,
error: false,
isLoadingInstanceDetails: false
isLoadingInstanceDetails: false,
};
const currentInstance = (state = initialCurrentInstanceState, action: IAction): ICurrentInstanceState => {
const currentInstance = (state = initialCurrentInstanceState, action: Action): CurrentInstanceState => {
switch (action.type) {
case ActionType.REQUEST_INSTANCE_DETAILS:
return {
...state,
error: false,
isLoadingInstanceDetails: true
isLoadingInstanceDetails: true,
};
case ActionType.RECEIVE_INSTANCE_DETAILS:
return {
...state,
currentInstanceDetails: action.payload,
error: false,
isLoadingInstanceDetails: false
isLoadingInstanceDetails: false,
};
case ActionType.DESELECT_INSTANCE:
return {
...state,
currentInstanceDetails: null,
error: false
error: false,
};
case ActionType.INSTANCE_LOAD_ERROR:
return {
...state,
error: true,
isLoadingInstanceDetails: false
isLoadingInstanceDetails: false,
};
default:
return state;
}
};
const initialSearchState: ISearchState = {
const initialSearchState: SearchState = {
error: false,
filters: [],
isLoadingResults: false,
next: "",
query: "",
results: []
results: [],
};
const search = (state = initialSearchState, action: IAction): ISearchState => {
const search = (state = initialSearchState, action: Action): SearchState => {
switch (action.type) {
case ActionType.REQUEST_SEARCH_RESULTS:
const { query, filters } = action.payload;
@ -114,7 +114,7 @@ const search = (state = initialSearchState, action: IAction): ISearchState => {
isLoadingResults: true,
next: isNewQuery ? "" : state.next,
query,
results: isNewQuery ? [] : state.results
results: isNewQuery ? [] : state.results,
};
case ActionType.RECEIVE_SEARCH_RESULTS:
return {
@ -122,7 +122,7 @@ const search = (state = initialSearchState, action: IAction): ISearchState => {
error: false,
isLoadingResults: false,
next: action.payload.next,
results: state.results.concat(action.payload.results)
results: state.results.concat(action.payload.results),
};
case ActionType.SEARCH_RESULTS_ERROR:
return { ...initialSearchState, error: true };
@ -131,7 +131,7 @@ const search = (state = initialSearchState, action: IAction): ISearchState => {
case ActionType.SET_SEARCH_RESULT_HOVER:
return {
...state,
hoveringOverResult: action.payload
hoveringOverResult: action.payload,
};
default:
return state;
@ -141,8 +141,7 @@ const search = (state = initialSearchState, action: IAction): ISearchState => {
export default (history: History) =>
combineReducers({
router: connectRouter(history),
// tslint:disable-next-line:object-literal-sort-keys
currentInstance,
data,
search
search,
});

72
frontend/src/redux/types.ts
View File

@ -1,5 +1,5 @@
import { RouterState } from "connected-react-router";
import { ISearchFilter } from "../searchFilters";
import { SearchFilter } from "../searchFilters";
export enum ActionType {
// Instance details
@ -22,33 +22,33 @@ export enum ActionType {
SEARCH_RESULTS_ERROR = "SEARCH_RESULTS_ERROR",
RESET_SEARCH = "RESET_SEARCH",
// Search -- hovering over results
SET_SEARCH_RESULT_HOVER = "SET_SEARCH_RESULT_HOVER"
SET_SEARCH_RESULT_HOVER = "SET_SEARCH_RESULT_HOVER",
}
export interface IAction {
export interface Action {
type: ActionType;
payload: any;
}
export type SortField = "domain" | "userCount" | "statusCount" | "insularity";
export type SortDirection = "asc" | "desc";
export interface IInstanceSort {
export interface InstanceSort {
field: SortField;
direction: SortDirection;
}
export interface IPeer {
export interface Peer {
name: string;
}
export interface ISearchResultInstance {
export interface SearchResultInstance {
name: string;
description?: string;
userCount?: number;
type?: string;
}
export interface IFederationRestrictions {
export interface FederationRestrictions {
reportRemoval?: string[];
reject?: string[];
mediaRemoval?: string[];
@ -59,7 +59,7 @@ export interface IFederationRestrictions {
accept?: string[];
}
export interface IInstanceDetails {
export interface InstanceDetails {
name: string;
description?: string;
version?: string;
@ -67,8 +67,8 @@ export interface IInstanceDetails {
insularity?: number;
statusCount?: number;
domainCount?: number;
peers?: IPeer[];
federationRestrictions: IFederationRestrictions;
peers?: Peer[];
federationRestrictions: FederationRestrictions;
lastUpdated?: string;
status: string;
type?: string;
@ -76,7 +76,7 @@ export interface IInstanceDetails {
statusesPerUserPerDay?: number;
}
interface IGraphNode {
interface GraphNode {
data: {
id: string;
label: string;
@ -88,7 +88,7 @@ interface IGraphNode {
};
}
interface IGraphEdge {
interface GraphEdge {
data: {
source: string;
target: string;
@ -97,65 +97,65 @@ interface IGraphEdge {
};
}
interface IGraphMetadata {
interface GraphMetadata {
ranges: { [key: string]: [number, number] };
}
export interface IGraph {
nodes: IGraphNode[];
edges: IGraphEdge[];
export interface Graph {
nodes: GraphNode[];
edges: GraphEdge[];
}
export interface IGraphResponse {
graph: IGraph;
metadata: IGraphMetadata;
export interface GraphResponse {
graph: Graph;
metadata: GraphMetadata;
}
export interface ISearchResponse {
results: ISearchResultInstance[];
export interface SearchResponse {
results: SearchResultInstance[];
next: string | null;
}
export interface IInstanceListResponse {
export interface InstanceListResponse {
pageNumber: number;
totalPages: number;
totalEntries: number;
pageSize: number;
instances: IInstanceDetails[];
instances: InstanceDetails[];
}
// Redux state
// The current instance name is stored in the URL. See state -> router -> location
export interface ICurrentInstanceState {
currentInstanceDetails: IInstanceDetails | null;
export interface CurrentInstanceState {
currentInstanceDetails: InstanceDetails | null;
isLoadingInstanceDetails: boolean;
error: boolean;
}
export interface IDataState {
graphResponse?: IGraphResponse;
instancesResponse?: IInstanceListResponse;
instanceListSort: IInstanceSort;
export interface DataState {
graphResponse?: GraphResponse;
instancesResponse?: InstanceListResponse;
instanceListSort: InstanceSort;
isLoadingGraph: boolean;
isLoadingInstanceList: boolean;
graphLoadError: boolean;
instanceListLoadError: boolean;
}
export interface ISearchState {
export interface SearchState {
error: boolean;
isLoadingResults: boolean;
next: string;
query: string;
results: ISearchResultInstance[];
filters: ISearchFilter[];
results: SearchResultInstance[];
filters: SearchFilter[];
hoveringOverResult?: string;
}
export interface IAppState {
export interface AppState {
router: RouterState;
currentInstance: ICurrentInstanceState;
data: IDataState;
search: ISearchState;
currentInstance: CurrentInstanceState;
data: DataState;
search: SearchState;
}

14
frontend/src/searchFilters.ts
View File

@ -1,8 +1,8 @@
type ISearchFilterRelation = "eq" | "gt" | "gte" | "lt" | "lte";
export interface ISearchFilter {
type SearchFilterRelation = "eq" | "gt" | "gte" | "lt" | "lte";
export interface SearchFilter {
// The ES field to filter on
field: string;
relation: ISearchFilterRelation;
relation: SearchFilterRelation;
// The value we want to filter to
value: string;
// Human-meaningful text that we're showing in the UI
@ -10,17 +10,19 @@ export interface ISearchFilter {
}
// Maps to translate this to user-friendly text
type SearchFilterField = "type" | "user_count";
const searchFilterFieldTranslations = {
type: "Instance type",
user_count: "User count"
// eslint-disable-next-line @typescript-eslint/camelcase
user_count: "User count",
};
const searchFilterRelationTranslations = {
eq: "=",
gt: ">",
gte: ">=",
lt: "<",
lte: "<="
lte: "<=",
};
export const getSearchFilterDisplayValue = (field: string, relation: ISearchFilterRelation, value: string) =>
export const getSearchFilterDisplayValue = (field: SearchFilterField, relation: SearchFilterRelation, value: string) =>
`${searchFilterFieldTranslations[field]} ${searchFilterRelationTranslations[relation]} ${value}`;

2
frontend/src/toaster.ts
View File

@ -2,5 +2,5 @@ import { Position, Toaster } from "@blueprintjs/core";
export default Toaster.create({
className: "app-toaster",
position: Position.TOP
position: Position.TOP,
});

18
frontend/src/types.ts
View File

@ -1,6 +1,6 @@
import { INSTANCE_TYPES } from "./constants";
interface IColorSchemeBase {
interface ColorSchemeBase {
// The name of the coloring, e.g. "Instance type"
name: string;
// The name of the key in a cytoscape node's `data` field to color by.
@ -9,30 +9,30 @@ interface IColorSchemeBase {
description?: string;
type: "qualitative" | "quantitative";
}
interface IQualitativeColorScheme extends IColorSchemeBase {
interface QualitativeColorScheme extends ColorSchemeBase {
// The values the color scheme is used for. E.g. ["mastodon", "pleroma", "misskey"].
values: string[];
type: "qualitative";
}
interface IQuantitativeColorScheme extends IColorSchemeBase {
interface QuantitativeColorScheme extends ColorSchemeBase {
type: "quantitative";
exponential: boolean;
}
export type IColorScheme = IQualitativeColorScheme | IQuantitativeColorScheme;
export type ColorScheme = QualitativeColorScheme | QuantitativeColorScheme;
export const typeColorScheme: IQualitativeColorScheme = {
export const typeColorScheme: QualitativeColorScheme = {
cytoscapeDataKey: "type",
name: "Instance type",
type: "qualitative",
values: INSTANCE_TYPES
values: INSTANCE_TYPES,
};
export const activityColorScheme: IQuantitativeColorScheme = {
export const activityColorScheme: QuantitativeColorScheme = {
cytoscapeDataKey: "statusesPerDay",
description: "The average number of statuses posted per day. This is an exponential scale.",
exponential: true,
name: "Activity",
type: "quantitative"
type: "quantitative",
};
export const colorSchemes: IColorScheme[] = [typeColorScheme, activityColorScheme];
export const colorSchemes: ColorScheme[] = [typeColorScheme, activityColorScheme];

1
frontend/src/typings/globals.d.ts vendored Normal file
View File

@ -0,0 +1 @@
declare module "*.png";

43
frontend/src/util.ts
View File

@ -1,41 +1,39 @@
import { createMatchSelector } from "connected-react-router";
import fetch from "cross-fetch";
import { range } from "lodash";
import { DESKTOP_WIDTH_THRESHOLD, IInstanceDomainPath, INSTANCE_DOMAIN_PATH } from "./constants";
import { IAppState } from "./redux/types";
import { DESKTOP_WIDTH_THRESHOLD, InstanceDomainPath, INSTANCE_DOMAIN_PATH } from "./constants";
import { AppState } from "./redux/types";
let API_ROOT = "http://localhost:4000/api/";
if (["true", true, 1, "1"].indexOf(process.env.REACT_APP_STAGING || "") > -1) {
if (["true", true, 1, "1"].includes(process.env.REACT_APP_STAGING || "")) {
API_ROOT = "https://phoenix.api-develop.fediverse.space/api/";
} else if (process.env.NODE_ENV === "production") {
API_ROOT = "https://phoenix.api.fediverse.space/api/";
}
export const getFromApi = (path: string, token?: string): Promise<any> => {
const domain = API_ROOT.endsWith("/") ? API_ROOT : API_ROOT + "/";
const domain = API_ROOT.endsWith("/") ? API_ROOT : `${API_ROOT}/`;
const headers = token ? { token } : undefined;
return fetch(encodeURI(domain + path), {
headers
}).then(response => response.json());
headers,
}).then((response) => response.json());
};
export const postToApi = (path: string, body: any, token?: string): Promise<any> => {
const domain = API_ROOT.endsWith("/") ? API_ROOT : API_ROOT + "/";
const domain = API_ROOT.endsWith("/") ? API_ROOT : `${API_ROOT}/`;
const defaultHeaders = {
Accept: "application/json",
"Content-Type": "application/json"
"Content-Type": "application/json",
};
const headers = token ? { ...defaultHeaders, token } : defaultHeaders;
return fetch(encodeURI(domain + path), {
body: JSON.stringify(body),
headers,
method: "POST"
}).then(response => {
return response.json();
});
method: "POST",
}).then((response) => response.json());
};
export const domainMatchSelector = createMatchSelector<IAppState, IInstanceDomainPath>(INSTANCE_DOMAIN_PATH);
export const domainMatchSelector = createMatchSelector<AppState, InstanceDomainPath>(INSTANCE_DOMAIN_PATH);
export const isSmallScreen = window.innerWidth < DESKTOP_WIDTH_THRESHOLD;
@ -49,28 +47,25 @@ export const unsetAuthToken = () => {
sessionStorage.removeItem("adminToken");
};
export const getAuthToken = () => {
return sessionStorage.getItem("adminToken");
};
export const getAuthToken = () => sessionStorage.getItem("adminToken");
export const getBuckets = (min: number, max: number, steps: number, exponential: boolean) => {
if (exponential) {
const logSpace = range(steps).map(i => Math.E ** i);
const logSpace = range(steps).map((i) => Math.E ** i);
// Scale the log space to the linear range
const logRange = logSpace[logSpace.length - 1] - logSpace[0];
const linearRange = max - min;
const scalingFactor = linearRange / logRange;
const translation = min - logSpace[0];
return logSpace.map(i => (i + translation) * scalingFactor);
} else {
// Linear
const bucketSize = (max - min) / steps;
return range(min, max, bucketSize);
return logSpace.map((i) => (i + translation) * scalingFactor);
}
// Linear
const bucketSize = (max - min) / steps;
return range(min, max, bucketSize);
};
const typeToDisplay = {
gnusocial: "GNU Social"
const typeToDisplay: { [field: string]: string } = {
gnusocial: "GNU Social",
};
export const getTypeDisplayString = (key: string) => {
if (key in typeToDisplay) {

44
frontend/tsconfig.json
View File

@ -1,40 +1,32 @@
{
"compilerOptions": {
"allowJs": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"jsx": "preserve",
"lib": [
"es2015",
"dom"
],
"module": "esnext",
"moduleResolution": "node",
"noImplicitAny": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noUnusedLocals": true,
"outDir": "build",
"rootDir": "src",
"sourceMap": true,
"strictNullChecks": true,
"suppressImplicitAnyIndexErrors": true,
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"sourceMap": true,
"forceConsistentCasingInFileNames": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"noImplicitAny": true,
"noImplicitReturns": true,
"noUnusedLocals": true,
"jsx": "react",
"typeRoots": [
"./node_modules/@types",
"./src/typings"
],
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true
},
"exclude": [
"node_modules",
"build"
],
"include": [
"src"
]

11
frontend/tslint.json
View File

@ -1,11 +0,0 @@
{
"extends": [
"tslint:recommended",
"tslint-eslint-rules",
"tslint-react",
"@blueprintjs/tslint-config/blueprint-rules",
"tslint-config-prettier",
"tslint-config-security"
],
"exclude": ["**/*.css"]
}

2053
frontend/yarn.lock
View File

File diff suppressed because it is too large Load Diff