Merge pull request #2396 from online-go/fetch_based_requests

Switch to Fetch based requests, get rid of %% based url templates

src/components/ACLModal/ACLModal.tsx

@@ -47,13 +47,13 @@ export class ACLModal extends Modal<Events, ACLModalProperties, any> {
 
         if ("game_id" in props) {
             this.url = `games/${props.game_id}/acl`;
-            this.del_url = `games/acl/%%`;
+            this.del_url = `games/acl/`;
         } else if ("review_id" in props) {
             this.url = `reviews/${props.review_id}/acl`;
-            this.del_url = `reviews/acl/%%`;
+            this.del_url = `reviews/acl/`;
         } else if ("puzzle_collection_id" in props) {
             this.url = `puzzles/collections/${props.puzzle_collection_id}/acl`;
-            this.del_url = `puzzles/collections/acl/%%`;
+            this.del_url = `puzzles/collections/acl/`;
         } else {
             throw new Error(`ACLModal created with invalid parameters`);
         }
@@ -79,7 +79,7 @@ export class ACLModal extends Modal<Events, ACLModalProperties, any> {
         }
         this.setState({ acl: new_acl });
 
-        del(this.del_url, obj.id)
+        del(this.del_url + obj.id)
             .then(this.refresh)
             .catch((e) => {
                 this.refresh();

src/components/BlockPlayer/BlockPlayer.ts

@@ -50,7 +50,7 @@ export function setIgnore(player_id: number, tf: boolean) {
             block_states[player_id] = new BlockState(player_id);
         }
         block_states[player_id].block_chat = tf;
-        put("players/%%/block", player_id, { block_chat: tf ? 1 : 0 })
+        put(`players/${player_id}/block`, { block_chat: tf ? 1 : 0 })
             .then(() => {
                 ITC.send("update-blocks", true);
             })
@@ -64,7 +64,7 @@ export function setGameBlock(player_id: number, tf: boolean) {
             block_states[player_id] = new BlockState(player_id);
         }
         block_states[player_id].block_games = tf;
-        put("players/%%/block", player_id, { block_games: tf ? 1 : 0 })
+        put(`players/${player_id}/block`, { block_games: tf ? 1 : 0 })
             .then(() => {
                 ITC.send("update-blocks", true);
             })
@@ -78,7 +78,7 @@ export function setAnnouncementBlock(player_id: number, tf: boolean) {
             block_states[player_id] = new BlockState(player_id);
         }
         block_states[player_id].block_announcements = tf;
-        put("players/%%/block", player_id, { block_announcements: tf ? 1 : 0 })
+        put(`players/${player_id}/block`, { block_announcements: tf ? 1 : 0 })
             .then(() => {
                 ITC.send("update-blocks", true);
             })

src/components/ChallengeModal/ChallengeModal.tsx

@@ -625,7 +625,7 @@ export class ChallengeModal extends Modal<Events, ChallengeModalProperties, any>
         this.saveSettings();
         this.close();
 
-        post(player_id ? "players/%%/challenge" : "challenges", player_id, challenge)
+        post(player_id ? `players/${player_id}/challenge` : "challenges", challenge)
             .then((res) => {
                 // console.log("Challenge response: ", res);
 
@@ -669,7 +669,7 @@ export class ChallengeModal extends Modal<Events, ChallengeModalProperties, any>
                                 off();
                                 if (accept) {
                                     // cancel challenge
-                                    void del("me/challenges/%%", challenge_id);
+                                    void del(`me/challenges/${challenge_id}`);
                                 }
                             })
                             .catch(() => {

src/components/GameAcceptModal/GameAcceptModal.tsx

@@ -48,7 +48,7 @@ export class GameAcceptModal extends Modal<Events, GameAcceptModalProperties, {}
             allowEscapeKey: false,
         });
 
-        post("challenges/%%/accept", this.props.challenge.challenge_id, {})
+        post(`challenges/${this.props.challenge.challenge_id}/accept`, {})
             .then(() => {
                 alert.close();
                 this.close();

src/components/IncidentReportTracker/IncidentReportTracker.tsx

@@ -52,12 +52,12 @@ export function IncidentReportTracker(): JSX.Element {
         const onReport = (report: Report) => {
             if (report.state !== "resolved") {
                 report.unclaim = () => {
-                    post("moderation/incident/%%", report.id, { id: report.id, action: "unclaim" })
+                    post(`moderation/incident/${report.id}`, { id: report.id, action: "unclaim" })
                         .then(ignore)
                         .catch(errorAlerter);
                 };
                 report.good_report = () => {
-                    post("moderation/incident/%%", report.id, {
+                    post(`moderation/incident/${report.id}`, {
                         id: report.id,
                         action: "resolve",
                         was_helpful: true,
@@ -66,7 +66,7 @@ export function IncidentReportTracker(): JSX.Element {
                         .catch(errorAlerter);
                 };
                 report.bad_report = () => {
-                    post("moderation/incident/%%", report.id, {
+                    post(`moderation/incident/${report.id}`, {
                         id: report.id,
                         action: "resolve",
                         was_helpful: false,
@@ -75,7 +75,7 @@ export function IncidentReportTracker(): JSX.Element {
                         .catch(errorAlerter);
                 };
                 report.steal = () => {
-                    post("moderation/incident/%%", report.id, { id: report.id, action: "steal" })
+                    post(`moderation/incident/${report.id}`, { id: report.id, action: "steal" })
                         .then((res) => {
                             if (res.vanished) {
                                 void alert.fire("Report was removed");
@@ -84,7 +84,7 @@ export function IncidentReportTracker(): JSX.Element {
                         .catch(errorAlerter);
                 };
                 report.claim = () => {
-                    post("moderation/incident/%%", report.id, { id: report.id, action: "claim" })
+                    post(`moderation/incident/${report.id}`, { id: report.id, action: "claim" })
                         .then((res) => {
                             if (res.vanished) {
                                 void alert.fire("Report was removed");
@@ -96,7 +96,7 @@ export function IncidentReportTracker(): JSX.Element {
                         .catch(errorAlerter);
                 };
                 report.cancel = () => {
-                    post("moderation/incident/%%", report.id, { id: report.id, action: "cancel" })
+                    post(`moderation/incident/${report.id}`, { id: report.id, action: "cancel" })
                         .then(ignore)
                         .catch(errorAlerter);
                 };
@@ -110,7 +110,7 @@ export function IncidentReportTracker(): JSX.Element {
                         })
                         .then(({ value: txt, isConfirmed }) => {
                             if (isConfirmed) {
-                                post("moderation/incident/%%", report.id, {
+                                post(`moderation/incident/${report.id}`, {
                                     id: report.id,
                                     action: "note",
                                     note: txt,

src/components/ModerateUser/ModerateUser.tsx

@@ -44,7 +44,7 @@ export class ModerateUser extends Modal<Events, ModerateUserProperties, any> {
     }
 
     componentDidMount() {
-        get("players/%%/full", this.props.playerId)
+        get(`players/${this.props.playerId}/full`)
             .then((result) => {
                 console.log(result);
                 this.setState(

src/components/Notifications/Notifications.tsx

@@ -200,15 +200,15 @@ class NotificationEntry extends React.Component<{ notification }, any> {
                             <FabX
                                 onClick={() => {
                                     this.setState({ message: _("Declining") });
-                                    del("me/challenges/%%", notification.challenge_id)
+                                    del(`me/challenges/${notification.challenge_id}`)
                                         .then(this.del)
                                         .catch(this.onError);
                                 }}
                             />
                             <FabCheck
                                 onClick={() => {
                                     this.setState({ message: _("Accepting") });
-                                    post("me/challenges/%%/accept", notification.challenge_id, {})
+                                    post(`me/challenges/${notification.challenge_id}/accept`, {})
                                         .then(() => {
                                             this.del();
                                             if (

src/components/PlayerAutocomplete/PlayerAutocomplete.tsx

@@ -164,8 +164,7 @@ function _PlayerAutocomplete(props: PlayerAutocompleteProperties, ref): JSX.Elem
                     //complete(value);
                 }
             }).catch((err) => {
-                if (err.status !== 0) {
-                    // status === 0 is an abort
+                if (err.name !== "AbortError") {
                     console.log(err);
                 }
             });

src/components/SeekGraph/SeekGraph.tsx

@@ -804,7 +804,7 @@ export class SeekGraph extends TypedEventEmitter<Events> {
                         .attr("title", _("Remove challenge"))
                         .click(() => {
                             //console.log("Remove");
-                            del("challenges/%%", C.challenge_id)
+                            del(`challenges/${C.challenge_id}`)
                                 .then(() => e.html(_("Challenge removed")))
                                 .catch(() => alert.fire(_("Error removing challenge")));
                         }),

src/lib/misc.ts

@@ -248,6 +248,10 @@ export function getPrintableError(err) {
     }
 
     if (err instanceof Error) {
+        if (err.name === "AbortError") {
+            /* ignore aborted requests' */
+            return;
+        }
         console.error(err.stack);
         return err.toString();
     }
@@ -279,11 +283,6 @@ export function getPrintableError(err) {
         }
     }
 
-    if (obj.status === 0 && obj.statusText === "abort") {
-        /* ignore aborted requests' */
-        return;
-    }
-
     /*
     if (typeof(obj) === "object") {
         if (obj.game) obj = obj.game;

src/lib/rengo_balancer.ts

@@ -169,14 +169,14 @@ export async function balanceTeams(challenge: Challenge): Promise<RengoParticipa
         Math.abs(result.blackAverageRating - result.whiteAverageRating),
     );
 
-    return put("challenges/%%/team", challenge.challenge_id, {
+    return put(`challenges/${challenge.challenge_id}/team`, {
         assign_black: result.black.map(user_id),
         assign_white: result.white.map(user_id),
     });
 }
 
 export function unassignPlayers(challenge: Challenge): Promise<RengoParticipantsDTO> {
-    return put("challenges/%%/team", challenge.challenge_id, {
+    return put(`challenges/${challenge.challenge_id}/team`, {
         unassign: challenge.rengo_participants,
     });
 }

src/lib/rengo_utils.ts

@@ -32,7 +32,7 @@ export function nominateForRengoChallenge(c: Challenge): Promise<RengoParticipan
         allowEscapeKey: false,
     });
 
-    return put("challenges/%%/join", c.challenge_id, {}).then((res) => {
+    return put(`challenges/${c.challenge_id}/join`, {}).then((res) => {
         alert.close();
         return res;
     });
@@ -50,7 +50,7 @@ export function assignToTeam(
             ? "assign_white"
             : "unassign";
 
-    return put("challenges/%%/team", challenge.challenge_id, {
+    return put(`challenges/${challenge.challenge_id}/team`, {
         [assignment]: [player_id], // back end expects an array of changes, but we only ever send one at a time.
     });
 }
@@ -70,13 +70,13 @@ export function startOwnRengoChallenge(the_challenge: Challenge): Promise<void>
         allowEscapeKey: false,
     });
 
-    return post("challenges/%%/start", the_challenge.challenge_id, {}).then(() => {
+    return post(`challenges/${the_challenge.challenge_id}/start`, {}).then(() => {
         alert.close();
     });
 }
 
 export function cancelRengoChallenge(the_challenge: Challenge): Promise<void> {
-    return del("challenges/%%", the_challenge.challenge_id);
+    return del(`challenges/${the_challenge.challenge_id}`);
 }
 
 export function unNominate(the_challenge: Challenge): Promise<RengoParticipantsDTO> {
@@ -88,7 +88,7 @@ export function unNominate(the_challenge: Challenge): Promise<RengoParticipantsD
         allowEscapeKey: false,
     });
 
-    return del("challenges/%%/join", the_challenge.challenge_id, {}).then((res) => {
+    return del(`challenges/${the_challenge.challenge_id}/join`, {}).then((res) => {
         alert.close();
         return res;
     });

src/lib/report_manager.tsx

@@ -318,7 +318,7 @@ class ReportManager extends EventEmitter<Events> {
     public async close(report_id: number, helpful: boolean): Promise<Report> {
         delete this.active_incident_reports[report_id];
         this.update();
-        const res = await post("moderation/incident/%%", report_id, {
+        const res = await post(`moderation/incident/${report_id}`, {
             id: report_id,
             action: "resolve",
             was_helpful: helpful,
@@ -337,15 +337,15 @@ class ReportManager extends EventEmitter<Events> {
         return res;
     }
     public async unclaim(report_id: number): Promise<Report> {
-        const res = await post("moderation/incident/%%", report_id, {
+        const res = await post(`moderation/incident/${report_id}`, {
             id: report_id,
             action: "unclaim",
         });
         this.updateIncidentReport(res);
         return res;
     }
     public async claim(report_id: number): Promise<Report> {
-        const res = await post("moderation/incident/%%", report_id, {
+        const res = await post(`moderation/incident/${report_id}`, {
             id: report_id,
             action: "claim",
         }).then((res) => {