From 3044baf194284a55316a2f4ffeae5386e888c267 Mon Sep 17 00:00:00 2001 From: Valerie Kenyon <35377991+ValerieKenyon@users.noreply.github.com> Date: Tue, 13 Nov 2018 20:09:03 -0500 Subject: [PATCH 01/21] Updates de.js --- src/localization/de.js | 336 ++++++++++++++++++++++++++++++----------- 1 file changed, 251 insertions(+), 85 deletions(-) diff --git a/src/localization/de.js b/src/localization/de.js index b6f42d19..96f610b3 100644 --- a/src/localization/de.js +++ b/src/localization/de.js @@ -6,13 +6,13 @@ export default { header: {}, footer: { - header: [ + header_v1: [ { name: `__githubRepoLink__`, text: `Cliff Effects Werkzeug`, }, ], - cfbCredit: [ + cfbCredit_v1: [ `Mit `, { name: `__heartIcon__` }, ` von Code for Boston gemacht`, @@ -20,121 +20,287 @@ export default { }, homePage: { - appName: `Cliff Effects Werkzeug`, - prototypeNote: `Ein Prototyp für Beratungshilfe*`, - cautionaryNote: `*Dieses Werkzeug ist ein Prototyp. Bitte diesen Prototyp nicht benutzen, Ihre Entsheidungen fest zu machen.`, - toFirstInputPage: `Beginnen`, - toAboutPage: `Mehr lernen`, + appName_v1: `Cliff Effects Werkzeug`, + prototypeNote_v1: `Ein Prototyp für Beratungshilfe*`, + cautionaryNote_v1: `*Dieses Werkzeug ist ein Prototyp. Bitte diesen Prototyp nicht benutzen, Ihre Entscheidungen fest zu machen.`, + toFirstInputPage_v1: `Beginnen`, + toAboutPage_v1: `Mehr lernen`, }, aboutPage: { - aboutPageHeader: `Über dieses Cliff Effects Werkzeug`, - - whatForHeader: `Wozu benutzt man dieses Werkzeug?`, - - whatForImportantNote1A: `Wichtige Anmerkung: `, - whatForImportantNote1B: `Diese Anwendung ist ein Minimum Viable Product (minimal überlebensfähiges Produkt). Sie sollte nicht als das einzige Werkzeug benutzt werden, um die SNAP- oder Section-8- (oder irgendein anderes Sozialhilfeprogramm-) finanzielle Situation eines Klienten zu verstehen.`, - - whatFor1A: `Dieses Werkzeug kann zeigen helfen, wie eine Einkommensveränderung sich auf die Sozialhilfe von SNAP und Section-8-Wohnungsgutschein auswirkt. Es wurde für die Sozialarbeiter an dem `, - whatFor1B: ` gedacht, um ihnen zu helfen, die Veränderungen von den Klientenunterstützungen vorherzusehen.`, - - whyImportantHeader: `Warum ist dieses Werkzeug wichtig?`, - - why1: `Ein Cliff Effect sich ereignet, als eine kleine Veränderung von der Situation eines Haushalts (z.B. eine oberflächliche Lohnerhöhung) den Wert der Unterstützung in einer unangemessenen Weise senkt. Die Familie arbeitet, um ihre Einkommen sich zu verbessern, aber am Ende bekommt sie einen Nettoverlust, der sie eigentlich in eine schwerere Situation stellt. Diese Cliff Effects hindern viele Familien daran, das Bekommen von Sozialhilfe eigentlich zu enden.`, - - why2: `Die Cliff Effects sind schwer vorherzusehen. Die Interaktionen zwischen dem Einkommen, der Nummer von Personnen im Haushalt, vielen verschiedenen anderen Krieterien, und den Auswirkungen der Programmen selbst haben Auswirkungen aufeinander in unerwarteten Weisen. Wir suchen Methoden, um dieses Problem sich mit der Komplexität zu befassen, und die Familien ihre Situationen besser zu verstehen und vorherzusehen.`, - - linkText1: `Ein zweiminutenlanges Video über Cliff Effects`, - linkText2: `Manche Quantitative Szenarios, die Cliff Effects demonstrieren`, - linkText3: `Eine Aufgliederung von verschiedenen Sozialhilfeprogrammen im Bundesstaat Massachusetts`, - - howToUseHeader: `Wie benutze ich dieses Werkzeug?`, - - howToUse1: `Gehen Sie Schritt für Schritt, Informationen über eines Klienten gegenwärtigen Unterstützungen, Haushalt, Einkommen, und andere wichtige Information in das Formular auszufüllen. Diese Informationen werden benutzt werden, um die umgefähre Unterstützung vom Klienten vorherzusehen. Als Sie zum Ende kommen, wechseln Sie den Betrag vom 'Einkommen in Zukunft', um die daraus resultierende Veränderung des Unterstützungsbetrag zu sehen. Zu dieser Zeit können Sie Auswirkungen für die Programmen SNAP und Section 8 Housing Voucher sehen. Bitte bemerken Sie, daß die Vorhersagen sich vielleicht nicht direkt zu dem gegenwärtigen Unterstützungsbetrag eines Klienten passen. Das Ziel der Anwendung ist der Betrag von dem Unterstützungswechsel, das sich ereignet, als es Einkommenwechsel gibt.`, - - howToUseRefreshNote1A: `Bitte bemerken Sie, daß diese Anwendung die Benutzerdaten nicht behaltet. `, - hotToUseRefreshNote1B: `Wenn Sie die Webseite wieder aufnehmen, wird Ihre Daten verloren werden. `, - howToUseRefreshNote1C: `Jedes Mal, wenn Sie die Anwendung verwenden, gibt die Anwendung Ihnen ein neues, leeres Formular.`, - - whoMadeThisHeader: `Wer entwickelt diese Anwendung?`, - - whoMadeThis1A: `Diese Anwendung ist ein Teil eines Projektes, das möglich mit dem Geben einen Open Door Grant (Zuschuß) von der Stiftung Boston Foundation an das `, - whoMadeThis1B: ` an der University of Massachusetts Boston ist. Das Center for Social Policy arbeitet mit den Organisationen `, - whoMadeThis1C: ` und `, - whoMadeThis1D: `. Das Center for Social Policy ist der Hauptpartner für das `, - whoMadeThis1E: `.`, - - whoMadeThis2A: `Die Freiwilligen von `, - whoMadeThis2B: ` erhalten die Codebasis auf `, - whoMadeThis2C: ` aufrecht. Für weitere Auskunft treten Sie bitte in Verbindung mit `, - whoMadeThis2D: `.`, - - whoMadeThis3Intro: `Wir möchten den folgenden Freiwilligen von Code for Boston besonders danken: `, - whoMadeThis3Names: `Annie LaCourt, Isaac Chansky, Michelle Bernstein, Alec Danaher, Sasha Maryl, Drew Love, Liani Lye, Andrew Cunningham, Liam Morley, Nick Francisci, Stephen Chin, Shameek Poddar, Will McIntosh, Andrew Seeder, Ben Lewis, Don Blair, Ethan Strominger, Nick Lee, Jonathan Marcus, Emily Wasserman, Ethan Blackwood,`, - whoMadeThis3And: ` und `, - whoMadeThis3FinalName: `Valerie Kenyon`, - whoMadeThisPeriod: `.`, + aboutPageHeader_v1: `Über dieses Cliff Effects Werkzeug`, + + whatForHeader_v1: `Wozu benutzt man dieses Werkzeug?`, + whatForImportantNote_v1: [ + { + name: `__importantNote__`, + text: `Wichtige Anmerkung: `, + }, + `Diese Anwendung ist ein Minimum Viable Product (minimal überlebensfähiges Produkt). Sie sollte nicht als das einzige Werkzeug benutzt werden, um die SNAP- oder Section-8- (oder irgendein anderes Sozialhilfeprogramm-) finanzielle Situation eines Klienten zu verstehen.`, + ], + whatFor_v2: [ + `Dieses Werkzeug kann zeigen helfen, wie eine Einkommensveränderung sich auf die Sozialhilfe von SNAP (Supplemental Nutrition Assistance Program = Programm für ergänzende Ernährungshilfe) und Section 8 Housing Voucher (= Wohnungsgutschein) auswirkt. Es wurde für die Sozialarbeiter an dem `, + { name: `__projectHope__` }, + ` entworfen, um ihnen zu helfen, die Veränderungen von den Unterstützungen der Klienten vorherzusehen.`, + ], + + whyHeader_v1: `Warum ist dieses Werkzeug wichtig?`, + why1_v1: `Ein Cliff Effect sich ereignet, als eine kleine Veränderung von der Situation eines Haushalts (z.B. eine oberflächliche Lohnerhöhung) den Wert der Unterstützung in einer unangemessenen Weise senkt. Die Familie arbeitet, um ihre Einkommen sich zu verbessern, aber am Ende bekommt sie einen Nettoverlust, der sie eigentlich in eine schwierigere Situation stellt. Diese Cliff Effects hindern viele Familien daran, das Bekommen von Sozialhilfe eigentlich zu enden.`, + why2_v1: `Die Cliff Effects sind schwer vorherzusehen. Die Interaktionen zwischen dem Einkommen, der Anzahl der Personen im Haushalt, vielen verschiedenen anderen Kriterien und den Auswirkungen der Programmen selbst haben Auswirkungen aufeinander in unerwarteten Weisen. Wir suchen Methoden, um dieses Problem sich mit der Komplexität zu befassen und den Familien zu helfen, ihre Situationen besser zu verstehen und vorherzusehen.`, + + videoLinkText_v1: `Ein zweiminutenlanges Video über Cliff Effects`, + quantLinkText_v1: `Manche quantitative Szenarios, die Cliff Effects demonstrieren`, + benefitsLinkText_v1: `Eine Aufgliederung von verschiedenen Sozialhilfeprogrammen im Bundesstaat Massachusetts`, + + howToUseHeader_v1: `Wie benutze ich dieses Werkzeug?`, + howtoUse_v1: `Gehen Sie Schritt für Schritt, Informationen über eines Klienten gegenwärtigen Unterstützungen, Haushalt, Einkommen und andere wichtige Information in das Formular auszufüllen. Diese Informationen werden benutzt werden, um die ungefähre Unterstützung des Klienten vorherzusehen. Als Sie zum Ende kommen, wechseln Sie den Betrag vom 'Einkommen in Zukunft', um die daraus resultierende Veränderung des Unterstützungsbetrag zu sehen. Zu dieser Zeit können Sie Auswirkungen für die Programmen SNAP und Section 8 Housing Voucher sehen. Bitte bemerken Sie, daß die Vorhersagen sich vielleicht nicht direkt zu dem gegenwärtigen Unterstützungsbetrag eines Klienten passen. Das Ziel der Anwendung ist der Betrag von dem Unterstützungswechsel, das sich ereignet, als es manche Einkommenwechsel gibt.`, + howToUseNote_v1: [ + `Bitte bemerken Sie, daß diese Anwendung die Benutzerdaten nicht behaltet. `, + { + name: `__refreshWarning__`, + text: `Wenn Sie die Webseite wieder aufnehmen, wird Ihre Daten verloren werden. `, + }, + `Jedes Mal, wenn Sie die Anwendung verwenden, gibt die Anwendung Ihnen ein neues, leeres Formular.`, + ], + + whoMadeThisHeader_v1: `Wer entwickelt diese Anwendung?`, + whoMadeThis1_v1: [ + `Diese Anwendung ist ein Teil eines Projektes, das möglich mit dem Geben einen Open Door Grant (Zuschuß) von der Stiftung Boston Foundation an das Center for Social Policy an der University of Massachusetts Boston ist. Das `, + { name: `__centerForSocialPolicy__` }, + `, arbeitet mit den Organisationen `, + { name: `__projectHope__` }, + ` und `, + { name: `__codeForBoston__` }, + `. Das Center for Social Policy ist der Hauptpartner für das `, + { name: `__onSolidGroundCoalition__` }, + `.`, + ], + whoMadeThis2_v1: [ + `Die Codebasis wird auf `, + { name: `__github__` }, + ` von den Freiwilligen von `, + { name: `__codeForBoston__` }, + ` aufrechterhalten. Für weitere Auskunft oder einen Programmfehler zu melden, treten Sie bitte in Verbindung mit `, + { name: `__contactEmail__` }, + `.`, + ], + whoMadeThis3_v1: [ + `Wir möchten den folgenden Freiwilligen von Code for Boston besonders danken: `, + { name: `__namesExceptLast__` }, + ` und `, + { name: `__lastName__` }, + `.`, + ], }, visitPage: { + previous_v1: `Vorherige Seite`, + next_v1: `Nächste Seite`, + newClient_v1: `Neuer Klient`, + + stepBar: { + currentBenefits_v1: `Gegenwärtige Sozialhilfe`, + household_v1: `Haushalt`, + currentIncome_v1: `Einkommen`, + currentExpenses_v1: `Kosten (des Haushalts)`, + predictions_v1: `Prognosen`, + }, + + formHelpers: { + weekly: `Wöchentlich`, + monthly: `Monatlich`, + yearly: `Jährlich`, + yesLabel: `Ja`, + noLabel: `Nein`, + }, + currentBenefits: { - hasSection8: { - label: `Haben Sie Section 8 Housing?`, - hint: `Section 8 gibt Hilfe für die Miete`, - }, - hasSnap: { - label: `Haben Sie SNAP?`, - hint: `SNAP gibt Hilfe für das Essenkaufen`, - }, + currentBenefits_v1: `Gegenwärtige Sozialhilfe`, + selectBenefits_v1: `Auswählen Sie jene Sozialhilfe Programmen, die Sie in der Gegenwart bekommen.`, + hasSection8Label_v1: `Haben Sie Section 8 Housing?`, + hasSection8Hint_v1: `Section 8 gibt Hilfe für die Miete`, + hasSnapLabel_v1: `Haben Sie SNAP?`, + hasSnapHint_v1: `SNAP gibt Hilfe für das Essenkaufen`, }, - household: {}, + household: { + title_v1: `Haushalt`, + clarifier_v1: `Daten über die Mitglieder von Ihrem Haushalt.`, + householdHeader_v1: `Haushalt`, + householdIntro_v1: `Daten über die Mitglieder von Ihrem Haushalt.`, + role_v1: `Rolle`, + age_v1: `Alter`, + disabled_v1: `Behindert`, + headOfHousehold_v1: `Haushaltsvorstand`, + addMember_v1: `Fügen Sie ein Familienmitglied hinzu`, + spouse_v1: `Ehepartner des Haushaltsvorstandes`, + childOther_v1: `Kind/Anderes Haushaltsmitglied`, + previous_v1: `Vorherige Seite`, + next_v1: `Nächste Seite`, + }, currentIncome: { - earnedIncome: { - label: `Einkommen von der Arbeit`, - hint: `Einkommen von der Arbeit`, + title_v1: `Gegenwärtiges Haushaltseinkommen`, + clarifier_v1: `Einkommen, das Sie in den vorherigen 12 Monaten bekommen haben.`, + explainSnapCalculation_v1: `Dieser Prototyp wird versuchen, seine eigenen Berechnungen für den SNAP-Betrag zu machen`, + earnedIncome: { + label_v1: `Einkommen von der Arbeit`, + hint_v1: `Einkommen von der Arbeit`, // In German, this hint is already self-explanatory from the label }, TAFDC: { - label: `TAFDC`, - hint: `TAFDC (Transitional Aid to Families with Dependent Children) ist ein Programm von dem Bundesstaat Massachusetts, das Familien mit Kindern während einer kurzen Zeit hilft`, + label_v1: `TAFDC`, + hint_v1: `TAFDC (Transitional Aid to Families with Dependent Children = Übergangshilfe für Familien mit unselbständigen Kindern) ist ein Programm von dem Bundesstaat Massachusetts, das Familien mit Kindern während einer kurzen Zeit hilft`, }, SSI: { - label: `SSI`, - hint: `SSI (Supplemental Security Income) ist ein Programm von der amerikanischen Bundesregierung, das finanzielle und medizinische Hilfe den Leuten gibt, die blind, behindert oder älter als 65 Jahre sind`, + label_v1: `SSI`, + hint_v1: `Supplemental Security Income (= zusätzliches Sicherheitseinkommen) ist ein Programm von der amerikanischen Bundesregierung, das finanzielle und medizinische Hilfe den Leuten gibt, die blind, behindert oder älter als 65 Jahre sind`, }, SSDI: { - label: `SSDI`, - hint: `SSDI (Social Security Disability Income) ist ein Program von der amerikanischen Bundesregierung, das behinderten Leuten hilft`, + label_v1: `SSDI`, + hint_v1: `Social Security Disability Income (= Sozialversicherung für den Behinderten) ist ein Programm von der amerikanischen Bundesregierung, das behinderten Leuten hilft`, }, childSupport: { - label: `Bekommene Kinderunterstützung`, - hint: `Kinderunterstützung ist Geld, das Ihr(e) ehemalige(r) Herr/Frau Ihnen gibt, um Ihre Kinder zu unterstützen`, + label_v1: `Bekommene Kinderunterstützung`, + hint_v1: `Kinderunterstützung ist Geld, das Ihr ehemaliger Ehepartner Ihnen gibt, um Ihre Kinder zu unterstützen`, }, unemployment: { - label: `Arbeitslosenunterstützung`, - hint: `Arbeitslosenunterstützung hilft Leuten, die ihre Arbeit verloren haben`, + label_v1: `Arbeitslosenversicherung`, + hint_v1: `Arbeitslosenversicherung hilft den Leuten, die ihre Arbeit verloren haben`, }, workersComp: { - label: `Arbeitsunfallversicherung`, - hint: `Arbeitsunfallversicherung hilft Leuten, die einen Unfall bei der Arbeit haben`, + label_v1: `Arbeitsunfallversicherung`, + hint_v1: `Arbeitsunfallversicherung hilft den Leuten, die einen Unfall bei der Arbeit haben`, }, pension: { - label: `Rente`, - hint: `Eine Rente gibt Einkommen einer Person, die sich aus Altersgründen aus der Karriere zurückzieht`, + label_v1: `Rente`, + hint_v1: `Die Rente gibt den Rentnern ein Einkommen, das von den ehemaligen Arbeitgebern bezahlt wird`, }, socialSecurity: { - label: `Staatliche Rentenversicherung`, - hint: `Staatliche Rentenversicherung ist ein Program von der amerikanischen Bundesregierung, das den Rentnern hilft`, + label_v1: `Social security`, + hint_v1: `Social Security (= Staatliche Rentenversicherung) ist ein Programm von der amerikanischen Bundesregierung, das den Rentnern die Einkommenshilfe gibt`, }, alimony: { - label: `Unterhaltszahlung`, - hint: `Unterhaltszahlung ist Geld, das eine Person der zweiten Person nach einer Ehescheidung bezahlt`, + label_v1: `Unterhaltszahlung`, + hint_v1: `Unterhaltszahlung ist Geld, das eine Person der zweiten Person nach einer Ehescheidung bezahlt`, }, otherIncome: { - label: `Anderes Einkommen`, - hint: `Bitte bemerken Sie hier irgendwelches Einkommen aus anderen Quellen, die nicht schon bemerkt werden`, + label_v1: `Anderes Einkommen`, + hint_v1: `Bitte bemerken Sie hier irgendwelches Einkommen aus anderen Quellen, die Sie nicht schon bemerkt haben`, }, + previous_v1: `Vorherige Seite`, + next_v1: `Nächste Seite`, + }, + + currentExpenses: { + title_v1: `Gegenwärtige Haushaltskosten`, + unreimbursedNonMedicalChildCare: { + sectionHeading_v1: `Angemessene Kinderbetreuung, die nicht zurückgezahlte und nicht medizinische ist`, + subheading_v1: `Ein "Kind" ist ein Mensch, der jünger als 12 Jahre ist. Bitte nicht einfügen Beträge, die andere Sozialprogrammen bezahlen.`, + columnExpenseType_v1: `Kosten`, + childDirectCare: { + label_v1: `Direkte Betreuungskosten`, + hint_v1: `Wieviel bezahlen Sie aus Ihrer eigenen Tasche?`, + }, + childBeforeAndAfterSchoolCare: { + label_v1: `Betreuungskosten für die Zeiten außerhalb der Schulzeit`, + hint_v1: `Wieviel bezahlen Sie für die Kinderbetreuung für jene Zeiten außerhalb der Schulzeit?`, + }, + childTransportation: { + label_v1: `Transportkosten`, + hint_v1: `Wieviel bezahlen Sie für den Transport (der Kinder)?`, + }, + childOtherCare: { + label_v1: `Andere Betreuungskosten`, + hint_v1: `Wieviel bezahlen Sie für andere Kinderbetreuungskosten?`, + }, + doEarnBecauseOfChildCare_v1: `Gibt die Kinderbetreuung Ihnen die Möglichkeit, anderes Einkommen zu machen?`, + earnedBecauseOfChildCare_v1: `Einkommen, das die Kinderbetreuung möglich macht`, + }, + childSupport: { + sectionHeading_v1: `Kinderunterstützung`, + columnExpenseType_v1: `Kosten`, + childSupportPaidOut: { + legallyObligated_v1: `Gesetzlich verpflichtete`, + childSupport_v1: ` Kinderunterstützung`, + }, + }, + housing: { + sectionHeading_v1: `Wohnung`, + monthlyContractRent: { + label_v1: `Monatliche Vertragsmiete (die Gesamtmiete für Ihre Wohnung)`, + hint_v1: `Die Gesamtmiete für Ihre Wohnung`, + }, + monthlyRentShare: { + label_v1: `Ihrer monatliche Mietanteil (Wieviel Sie von der Gesamtmiete bezahlen müssen)`, + hint_v1: `Wieviel müssen Sie von der Gesamtmiete bezahlen?`, + }, + utilitiesSubheading: `Für welche Rechnungen bezahlen Sie?`, + climateControl: { + label_v1: `Die Heizung oder das Kühlsystem (z.B. die Klimaanlage im Sommer)`, + hint_v1: `Wieviel bezalhen Sie, wenn Sie eine gesonderte Rechnung für die Heizung und/oder das Kühlsystem haben?`, + }, + nonHeatElectricity: { + label_v1: `Stromrechnung für die Zwecke außer der Heizung`, + hint_v1: `Wieviel bezahlen Sie für irgendwelche Stromrechnung (außer der Stromrechnung für die Heizung)`, + }, + phone: { + label_v1: `Der Telefondienst`, + hint_v1: `Wieviel bezahlen Sie für den grundlegenden Telefondienst?`, + }, + fuelAssistance: { + label_v1: `Bekommen Sie Treibstoffunterstützung?`, + hint_v1: `Die Treibstoffunterstützung hilft Ihnen mit den Erdgas- oder Ölkosten`, + }, + previous_v1: `Vorherige Seite`, + next_v1: `Nächste Seite`, + }, + }, + + predictions: { + title_v1: `Was kann passieren?`, + futureIncomeQuestion_v1: `Wieviel Geld würden Sie in der Zukunft bezahlt werden? (Sie können verschiedene Beträge probieren)`, + tabTitleChanges_v1: `Tabelle der Wechseldaten`, + tabTitleChangesChart_v1: `Gestapeltes Balkendiagramm der Veränderungen`, + tabTitleStackedIncomes_v1: `Die gestapelten Einkommen`, + tabTitleBenefitPrograms_v1: `Kartesisches Diagramm mit den Wechseln der Sozialhilfe Programmen`, + chartsHeader_v1: `Wie können Ihre Sozialhilfe Programmen mit dem neuen Einkommen ändern?`, + warningMessage_v1: `Dieses Werkzeug ist im Testzustand. Vielleicht sind diese Zahlen nicht richtig. Wenn die Zahlen falsch sind, möchten wir Ihre Rückmeldungen bekommen.`, + submitFeedback_v1: `Geben Sie Ihre Rückmeldungen`, + // added the following snippets Friday 2018_9_7 + // Benefits Table: + benefitsTableTitle_v1: `Veränderungen`, + columnBenefit_v1: `Sozialhilfe`, // see BenefitsTable.js + columnCurrentBenefits_v1: `Gegenwärtige Sozialhilfe`, // see BenefitsTable.js + columnNewEstimate_v1: `Neue Schätzung`, // see BenefitsTable.js + columnDifference_v1: `Unterschied`, // see BenefitsTable.js + rowSNAP_v1: `SNAP`, // see BenefitsTable.js + rowSection8_v1: `Section 8 Housing (Wohnung)`, // see BenefitsTable.js + rowTotalBenefits_v1: `Gesamte Sozialhilfe`, // see BenefitsTable.js + rowEarned_v2: `Verdientes Einkommen`, // see BenefitsTable.js + rowNetTotal_v1: `Netto-Summe`, // see BenefitsTable.js + beforeMoney_v1: `$`, // see BenefitsTable.js multiple lines + afterMoney_v1: ` pro Monat`, // see BenefitsTable.js multiple lines + // Stacked Bar Graph: + stackedBarGraphTitle_v1: `Gestapeltes Balkendiagramm der Veränderungen`, + moneyInAsPayChanges_v2: `Einkommendes Geld, als der Lohn ändert`, // see StackedBarGraph.js + // Stacked Area Graph: + stackedAreaGraphTitle_v1: `Die gestapelten Einkommen`, + allMoneyComingIn_v2: `Alle einkommenden Gelder, als der Lohn ändert`, // see StackedAreaGraph.js + // Benefit Programs Graph, showing benefit programs as lines not areas: + benefitProgramsTitle_v2: `Individuelle Sozialhilfsbeträge für den Haushalt, als der Lohn ändert`, // maybe rename as benefitProgramsSubTitle_v1 ? see also BenefitsLineGraph.js + benefitValue_v1: `Sozialhilfswert ($)`, // see BenefitsLineGraph.js + // Snippets that are used in more than one chart, table, or graph: + totalMoney_v1: `Gesamteinkommendes Geld ($)`, // see StackedAreaGraph.js, StackedBarGraph.js + weeklyPay_v2: `Wöchentlicher Lohn ($)`, + monthlyPay_v2: `Monatlicher Lohn ($)`, + yearlyPay_v2: `Jährlicher Lohn ($)`, + hasPay_v2: `Lohn`, + hasSNAP_v1: `SNAP`, + hasSection8_v1: `Section 8`, + futurePayLine_v2: `Zukünftiger Lohn`, // see VerticalLine.js + buttonWeekly_v1: `Wöchentlich`, // see cashflow.js, GraphTimeButtons + buttonMonthly_v1: `Monatlich`, // see cashflow.js, GraphTimeButtons + buttonYearly_v1: `Jährlich`, // see cashflow.js, GraphTimeButton }, }, }; From e1ac7d0dd20568a5eb575130a8730fdc098ffe94 Mon Sep 17 00:00:00 2001 From: Turner Hayes Date: Fri, 16 Nov 2018 21:16:46 -0500 Subject: [PATCH 02/21] Dev utilities - Persist loaded client for 1 day - Add command line utilities for viewing client (read-only) and enabling Dev HUD --- package-lock.json | 47 +++++++++++++++++- package.json | 4 +- src/App.js | 90 ++++++++++++++++++++++++++++++----- src/containers/VisitPage.js | 10 ++++ src/dev/command-line-utils.js | 45 ++++++++++++++++++ src/dev/deepFreeze.js | 39 +++++++++++++++ 6 files changed, 220 insertions(+), 15 deletions(-) create mode 100644 src/dev/command-line-utils.js create mode 100644 src/dev/deepFreeze.js diff --git a/package-lock.json b/package-lock.json index 99e41198..8d270ea3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2608,6 +2608,29 @@ "gud": "^1.0.0" } }, + "cross-env": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-5.2.0.tgz", + "integrity": "sha512-jtdNFfFW1hB7sMhr/H6rW1Z45LFqyI431m3qU6bFXcQ3Eh7LtBuG3h74o7ohHZ3crrRkkqHlo4jYHFPcjroANg==", + "requires": { + "cross-spawn": "^6.0.5", + "is-windows": "^1.0.0" + }, + "dependencies": { + "cross-spawn": { + "version": "6.0.5", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz", + "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==", + "requires": { + "nice-try": "^1.0.4", + "path-key": "^2.0.1", + "semver": "^5.5.0", + "shebang-command": "^1.2.0", + "which": "^1.2.9" + } + } + } + }, "cross-spawn": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz", @@ -5768,6 +5791,11 @@ "minimatch": "^3.0.4" } }, + "immediate": { + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz", + "integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps=" + }, "immutable": { "version": "3.8.2", "resolved": "https://registry.npmjs.org/immutable/-/immutable-3.8.2.tgz", @@ -6951,6 +6979,14 @@ "type-check": "~0.3.2" } }, + "lie": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz", + "integrity": "sha1-mkNrLMd0bKWd56QfpGmz77dr2H4=", + "requires": { + "immediate": "~3.0.5" + } + }, "lint-staged": { "version": "8.0.4", "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-8.0.4.tgz", @@ -7647,6 +7683,14 @@ "json5": "^0.5.0" } }, + "localforage": { + "version": "1.7.3", + "resolved": "https://registry.npmjs.org/localforage/-/localforage-1.7.3.tgz", + "integrity": "sha512-1TulyYfc4udS7ECSBT2vwJksWbkwwTX8BzeUIiq8Y07Riy7bDAAnxDaPU/tWyOVmQAcWJIEIFP9lPfBGqVoPgQ==", + "requires": { + "lie": "3.1.1" + } + }, "locate-path": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz", @@ -8173,8 +8217,7 @@ "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", - "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==", - "dev": true + "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==" }, "no-case": { "version": "2.3.2", diff --git a/package.json b/package.json index 4d09ca42..fd590d6b 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,9 @@ "dependencies": { "ajv": "6.5.4", "chart.js": "2.7.2", + "cross-env": "^5.2.0", "highcharts": "^6.2.0", + "localforage": "^1.7.3", "lodash": "4.17.10", "moment": "2.22.1", "react": "16.3.2", @@ -20,7 +22,7 @@ "semantic-ui-react": "0.75.1" }, "scripts": { - "start": "react-scripts start", + "start": "cross-env NODE_ENV=development; react-scripts start", "build": "npm run docs && react-scripts build && node postbuild.js", "test": "react-scripts test", "coverage": "react-scripts test --coverage", diff --git a/src/App.js b/src/App.js index e167d69f..4695b27e 100644 --- a/src/App.js +++ b/src/App.js @@ -5,6 +5,7 @@ import { Switch, } from 'react-router-dom'; import { Helmet } from 'react-helmet'; +import localforage from 'localforage'; import { Confirmer } from './utils/getUserConfirmation'; @@ -18,14 +19,30 @@ import Header from './components/Header'; // Development HUD import { DevSwitch } from './containers/DevSwitch'; import { DevHud } from './components/dev/DevHud'; +import { + printSummaryToConsole, + addClientGetterProperty, + addEnableDevProperty, +} from './dev/command-line-utils'; // Object Manipulation -import { cloneDeep } from 'lodash'; +import cloneDeep from 'lodash/cloneDeep'; +import merge from 'lodash/merge'; import { CLIENT_DEFAULTS } from './utils/CLIENT_DEFAULTS'; // LOCALIZATION import { getTextForLanguage } from './utils/getTextForLanguage'; + +const DEV_PROPS_STORAGE_KEY = 'cliffEffectsDevProps'; + +const LOADED_CLIENT_STORAGE_KEY = 'cliffEffects_loadedClient'; + +const CLIENT_LAST_LOADED_STORAGE_KEY = 'cliffEffects_clientLastLoaded'; + +// Time-to-live for stored client data, in milliseconds +const STORED_CLIENT_TTL = 1000 * 60 * 60 * 24; // 1 day + /** * Main top-level component of the app. Contains the router that controls access * to the {@link HomePage}, {@link VisitPage}, and {@link AboutPage}, as well @@ -48,14 +65,6 @@ class App extends Component { let defaults = cloneDeep(CLIENT_DEFAULTS); - // Development variables are the only things stored - let localDev = localStorage.getItem(`cliffEffectsDevProps`); - if (typeof localDev !== `string`) { - localDev = {}; - } else { - localDev = JSON.parse(localDev); - } - /** * React state. * @property {string} langCode - [ISO 639-1 code]{@link https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes} of currently selected language @@ -84,12 +93,66 @@ class App extends Component { english: true, nonEnglish: true, warningOff: true, - ...localDev, }, distrustConfirmed: false, }; }; // End constructor() + componentDidMount() { + Promise.all([ + localforage.getItem(DEV_PROPS_STORAGE_KEY), + localforage.getItem(CLIENT_LAST_LOADED_STORAGE_KEY), + localforage.getItem(LOADED_CLIENT_STORAGE_KEY), + ]).then( + ([ + localDev, + clientLastLoaded, + loadedClient, + ]) => { + if (localDev) { + this.setState((prevState) => { + const now = Date.now(); + + clientLastLoaded = clientLastLoaded || 0; + + let state = merge( + {}, + prevState, + { devProps: localDev } + ); + + // This will clear out a loaded client from local storage + // if it's been there too long--this is for security purposes, + // as the loaded client could potentially have sensitive client + // data and we want to minimize exposure of that info. + if (now - clientLastLoaded >= STORED_CLIENT_TTL) { + localforage.removeItem(LOADED_CLIENT_STORAGE_KEY); + localforage.removeItem(CLIENT_LAST_LOADED_STORAGE_KEY); + } + else { + state.clients.loaded = loadedClient; + } + + return state; + }); + } + } + ); + + // Webpack should remove this whole conditional when not built for development environment + if (process.env.NODE_ENV === 'development') { + printSummaryToConsole(); + + addEnableDevProperty(() => { + return this.setDev('dev', true); + }); + + addClientGetterProperty(() => { + return this.state.clients.loaded; + }); + } + } + /** * Set the human language of the app (i.e. the language in which the UI will * display text for users to read, NOT the coding language). @@ -115,9 +178,9 @@ class App extends Component { let props = prevState.devProps; if (props[ key ] !== value) { - let newProps = { ...props, [ key ]: value }; - localStorage.setItem(`cliffEffectsDevProps`, JSON.stringify(newProps)); + + localforage.setItem(DEV_PROPS_STORAGE_KEY, newProps); return { devProps: newProps }; } @@ -139,6 +202,9 @@ class App extends Component { defaults = cloneDeep(clients.default), newData = Object.assign(defaults, toLoad); + localforage.setItem(CLIENT_LAST_LOADED_STORAGE_KEY, Date.now()); + localforage.setItem(LOADED_CLIENT_STORAGE_KEY, newData); + return { clients: { ...clients, loaded: newData }}; }); }; // End loadClient() diff --git a/src/containers/VisitPage.js b/src/containers/VisitPage.js index 39f40115..780d7d89 100644 --- a/src/containers/VisitPage.js +++ b/src/containers/VisitPage.js @@ -9,6 +9,7 @@ import { Redirect } from 'react-router-dom'; import { setNestedProperty } from '../utils/setNestedProperty'; import { cloneDeep } from 'lodash'; import { convertForUpdate } from '../utils/convertForUpdate'; +import { addClientGetterProperty } from '../dev/command-line-utils'; // Data // import { clientList } from '../config/dummyClients'; @@ -56,6 +57,15 @@ class VisitPage extends Component { componentDidMount() { this.didMount = true; + + // Webpack should remove this whole conditional when not built for development environment + if (process.env.NODE_ENV === 'development') { + // Override property set in App.js, because that property + // doesn't get changed by updateClientValue() + addClientGetterProperty(() => { + return this.state.client; + }); + } } resetClientIfOk = (shouldReset) => { diff --git a/src/dev/command-line-utils.js b/src/dev/command-line-utils.js new file mode 100644 index 00000000..24349d88 --- /dev/null +++ b/src/dev/command-line-utils.js @@ -0,0 +1,45 @@ +import deepFreeze from './deepFreeze'; + +export const printSummaryToConsole = () => { + console.log( + ` +%c========================= Cliff Effects Dev Utilities ========================= + +- enableDev() - Enable the Dev HUD (without needing to go to /dev) + +- client - The current value of the loaded client (a recursively frozen + one, so that you can't change it, which could cause weirdness + in the app) + +===============================================================================`, + 'color: blue', + ); +}; + +export const addEnableDevProperty = (devSetter) => { + Object.defineProperties( + window, + { + enableDev: { + enumerable: true, + configurable: true, + value: devSetter, + }, + } + ); +}; + +export const addClientGetterProperty = (clientGetter) => { + Object.defineProperties( + window, + { + client: { + enumerable: true, + configurable: true, + get: () => { + return deepFreeze(clientGetter()); + }, + }, + } + ); +}; diff --git a/src/dev/deepFreeze.js b/src/dev/deepFreeze.js new file mode 100644 index 00000000..5281ff4b --- /dev/null +++ b/src/dev/deepFreeze.js @@ -0,0 +1,39 @@ +/** + * Returns a version of the passed in object that is recursively frozen. + * + * Does not freeze the passed object or any of its nested properties, instead + * returns a frozen copy (diverges from the behavior of Object.freeze()). + * + * @param {*} obj - The object to deep freeze + * + * @returns the frozen object + */ +const deepFreeze = (obj) => { + if (typeof obj === 'undefined' || obj === null) { + return obj; + } + + // Object.freeze() freezes the object passed in as well as returning the frozen object, + // so we need to shallow clone the object/array + obj = + Array.isArray(obj) ? + obj.slice() : + Object.assign({}, obj); + + for (let prop in obj) { + if ( + !obj.hasOwnProperty(prop) || + Object.isFrozen(obj[ prop ]) + ) { + continue; + } + + if (typeof obj[ prop ] === 'object') { + obj[ prop ] = deepFreeze(obj[ prop ]); + } + } + + return Object.freeze(obj); +}; + +export default deepFreeze; From 294749cb1414056d58619539b11c2e924e06328a Mon Sep 17 00:00:00 2001 From: Turner Hayes Date: Fri, 16 Nov 2018 21:34:35 -0500 Subject: [PATCH 03/21] Put localforage calls behind a development environment conditional --- src/App.js | 92 ++++++++++++++++++++++++++++-------------------------- 1 file changed, 48 insertions(+), 44 deletions(-) diff --git a/src/App.js b/src/App.js index 4695b27e..65cfd2c1 100644 --- a/src/App.js +++ b/src/App.js @@ -99,48 +99,48 @@ class App extends Component { }; // End constructor() componentDidMount() { - Promise.all([ - localforage.getItem(DEV_PROPS_STORAGE_KEY), - localforage.getItem(CLIENT_LAST_LOADED_STORAGE_KEY), - localforage.getItem(LOADED_CLIENT_STORAGE_KEY), - ]).then( - ([ - localDev, - clientLastLoaded, - loadedClient, - ]) => { - if (localDev) { - this.setState((prevState) => { - const now = Date.now(); - - clientLastLoaded = clientLastLoaded || 0; - - let state = merge( - {}, - prevState, - { devProps: localDev } - ); - - // This will clear out a loaded client from local storage - // if it's been there too long--this is for security purposes, - // as the loaded client could potentially have sensitive client - // data and we want to minimize exposure of that info. - if (now - clientLastLoaded >= STORED_CLIENT_TTL) { - localforage.removeItem(LOADED_CLIENT_STORAGE_KEY); - localforage.removeItem(CLIENT_LAST_LOADED_STORAGE_KEY); - } - else { - state.clients.loaded = loadedClient; - } - - return state; - }); - } - } - ); - // Webpack should remove this whole conditional when not built for development environment if (process.env.NODE_ENV === 'development') { + Promise.all([ + localforage.getItem(DEV_PROPS_STORAGE_KEY), + localforage.getItem(CLIENT_LAST_LOADED_STORAGE_KEY), + localforage.getItem(LOADED_CLIENT_STORAGE_KEY), + ]).then( + ([ + localDev, + clientLastLoaded, + loadedClient, + ]) => { + if (localDev) { + this.setState((prevState) => { + const now = Date.now(); + + clientLastLoaded = clientLastLoaded || 0; + + let state = merge( + {}, + prevState, + { devProps: localDev } + ); + + // This will clear out a loaded client from local storage + // if it's been there too long--this is for security purposes, + // as the loaded client could potentially have sensitive client + // data and we want to minimize exposure of that info. + if (now - clientLastLoaded >= STORED_CLIENT_TTL) { + localforage.removeItem(LOADED_CLIENT_STORAGE_KEY); + localforage.removeItem(CLIENT_LAST_LOADED_STORAGE_KEY); + } + else { + state.clients.loaded = loadedClient; + } + + return state; + }); + } + } + ); + printSummaryToConsole(); addEnableDevProperty(() => { @@ -150,7 +150,7 @@ class App extends Component { addClientGetterProperty(() => { return this.state.clients.loaded; }); - } + } // End development environment conditional } /** @@ -180,7 +180,9 @@ class App extends Component { if (props[ key ] !== value) { let newProps = { ...props, [ key ]: value }; - localforage.setItem(DEV_PROPS_STORAGE_KEY, newProps); + if (process.env.NODE_ENV === 'development') { + localforage.setItem(DEV_PROPS_STORAGE_KEY, newProps); + } return { devProps: newProps }; } @@ -202,8 +204,10 @@ class App extends Component { defaults = cloneDeep(clients.default), newData = Object.assign(defaults, toLoad); - localforage.setItem(CLIENT_LAST_LOADED_STORAGE_KEY, Date.now()); - localforage.setItem(LOADED_CLIENT_STORAGE_KEY, newData); + if (process.env.NODE_ENV === 'development') { + localforage.setItem(CLIENT_LAST_LOADED_STORAGE_KEY, Date.now()); + localforage.setItem(LOADED_CLIENT_STORAGE_KEY, newData); + } return { clients: { ...clients, loaded: newData }}; }); From e045010fcf9e3f3cbc940e9852cfacf7afec1bc7 Mon Sep 17 00:00:00 2001 From: knod Date: Thu, 22 Nov 2018 16:22:03 -0500 Subject: [PATCH 04/21] Transfers tests to new files, skips them --- ...ineGraph.test.js => BenefitsLines.test.js} | 26 +- ...Graph.test.js => ResourcesColumns.test.js} | 26 +- ...Graph.test.js => StackedResources.test.js} | 26 +- .../BenefitsLineGraph.test.js.snap | 3530 ------------- .../StackedAreaGraph.test.js.snap | 4462 ----------------- .../StackedBarGraph.test.js.snap | 1082 ---- 6 files changed, 39 insertions(+), 9113 deletions(-) rename src/test/forms/output/{BenefitsLineGraph.test.js => BenefitsLines.test.js} (81%) rename src/test/forms/output/{StackedBarGraph.test.js => ResourcesColumns.test.js} (79%) rename src/test/forms/output/{StackedAreaGraph.test.js => StackedResources.test.js} (79%) delete mode 100644 src/test/forms/output/__snapshots__/BenefitsLineGraph.test.js.snap delete mode 100644 src/test/forms/output/__snapshots__/StackedAreaGraph.test.js.snap delete mode 100644 src/test/forms/output/__snapshots__/StackedBarGraph.test.js.snap diff --git a/src/test/forms/output/BenefitsLineGraph.test.js b/src/test/forms/output/BenefitsLines.test.js similarity index 81% rename from src/test/forms/output/BenefitsLineGraph.test.js rename to src/test/forms/output/BenefitsLines.test.js index a776131b..5eebec04 100644 --- a/src/test/forms/output/BenefitsLineGraph.test.js +++ b/src/test/forms/output/BenefitsLines.test.js @@ -2,28 +2,28 @@ import React from 'react'; import { mount } from 'enzyme'; import { cloneDeep, set } from 'lodash'; -import { BenefitsLineGraph } from '../../../forms/output/BenefitsLineGraph'; +import { BenefitsLines } from '../../../forms/output/BenefitsLines'; import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; -jest.mock('react-chartjs-2', () => { - const LineMock = () => { - return null; - }; +// jest.mock('react-chartjs-2', () => { +// const LineMock = () => { +// return null; +// }; - return { - Line(props) { - return ; - }, - }; -}); +// return { +// Line(props) { +// return ; +// }, +// }; +// }); -describe('', () => { +describe.skip('', () => { let activePrograms; let client; let defaultProps; const buildGraph = () => { - return mount(); + return mount(); }; beforeEach(() => { diff --git a/src/test/forms/output/StackedBarGraph.test.js b/src/test/forms/output/ResourcesColumns.test.js similarity index 79% rename from src/test/forms/output/StackedBarGraph.test.js rename to src/test/forms/output/ResourcesColumns.test.js index 2d7b179b..e745e450 100644 --- a/src/test/forms/output/StackedBarGraph.test.js +++ b/src/test/forms/output/ResourcesColumns.test.js @@ -2,26 +2,26 @@ import React from 'react'; import { mount } from 'enzyme'; import { cloneDeep, set } from 'lodash'; -import { StackedBarGraph } from '../../../forms/output/StackedBarGraph'; +import { ResourcesColumns } from '../../../forms/output/ResourcesColumns'; import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; -jest.mock('react-chartjs-2', () => { - const BarMock = () => { - return null; - }; +// jest.mock('react-chartjs-2', () => { +// const BarMock = () => { +// return null; +// }; - return { - Bar(props) { - return ; - }, - }; -}); +// return { +// Bar(props) { +// return ; +// }, +// }; +// }); -describe('', () => { +describe.skip('', () => { let client; const buildGraph = () => { - return mount(); + return mount(); }; beforeEach(() => { diff --git a/src/test/forms/output/StackedAreaGraph.test.js b/src/test/forms/output/StackedResources.test.js similarity index 79% rename from src/test/forms/output/StackedAreaGraph.test.js rename to src/test/forms/output/StackedResources.test.js index 0e811d81..04be4f91 100644 --- a/src/test/forms/output/StackedAreaGraph.test.js +++ b/src/test/forms/output/StackedResources.test.js @@ -2,28 +2,28 @@ import React from 'react'; import { mount } from 'enzyme'; import { cloneDeep, set } from 'lodash'; -import { StackedAreaGraph } from '../../../forms/output/StackedAreaGraph'; +import { StackedResources } from '../../../forms/output/StackedResources'; import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; -jest.mock('react-chartjs-2', () => { - const LineMock = () => { - return null; - }; +// jest.mock('react-chartjs-2', () => { +// const LineMock = () => { +// return null; +// }; - return { - Line(props) { - return ; - }, - }; -}); +// return { +// Line(props) { +// return ; +// }, +// }; +// }); -describe('', () => { +describe.skip('', () => { let activePrograms; let client; let defaultProps; const buildGraph = () => { - return mount(); + return mount(); }; beforeEach(() => { diff --git a/src/test/forms/output/__snapshots__/BenefitsLineGraph.test.js.snap b/src/test/forms/output/__snapshots__/BenefitsLineGraph.test.js.snap deleted file mode 100644 index 3180e9b7..00000000 --- a/src/test/forms/output/__snapshots__/BenefitsLineGraph.test.js.snap +++ /dev/null @@ -1,3530 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[` renders with both snap and section8 1`] = ` - - - - - -`; - -exports[` renders with section8 1`] = ` - - - - - -`; - -exports[` renders with snap and current earned greater than future earned 1`] = ` - - - - - -`; - -exports[` renders with snap and current earned less than future earned 1`] = ` - - - - - -`; diff --git a/src/test/forms/output/__snapshots__/StackedAreaGraph.test.js.snap b/src/test/forms/output/__snapshots__/StackedAreaGraph.test.js.snap deleted file mode 100644 index 66090f74..00000000 --- a/src/test/forms/output/__snapshots__/StackedAreaGraph.test.js.snap +++ /dev/null @@ -1,4462 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[` renders with both snap and section8 1`] = ` - - - - - -`; - -exports[` renders with section8 1`] = ` - - - - - -`; - -exports[` renders with snap and current earned greater than future earned 1`] = ` - - - - - -`; - -exports[` renders with snap and current earned less than future earned 1`] = ` - - - - - -`; diff --git a/src/test/forms/output/__snapshots__/StackedBarGraph.test.js.snap b/src/test/forms/output/__snapshots__/StackedBarGraph.test.js.snap deleted file mode 100644 index 29f5f53f..00000000 --- a/src/test/forms/output/__snapshots__/StackedBarGraph.test.js.snap +++ /dev/null @@ -1,1082 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[` renders with both snap and section8 1`] = ` - - - - - -`; - -exports[` renders with section8 1`] = ` - - - - - -`; - -exports[` renders with snap and current earned greater than future earned 1`] = ` - - - - - -`; - -exports[` renders with snap and current earned less than future earned 1`] = ` - - - - - -`; From 8407fddaea3f9a2ecbc583496ed13e37d2d6b75e Mon Sep 17 00:00:00 2001 From: knod Date: Fri, 23 Nov 2018 11:00:47 -0500 Subject: [PATCH 05/21] Deletes obsolete files --- src/forms/output/BenefitsLineGraph.js | 124 ------------------------ src/forms/output/StackedAreaGraph.js | 130 -------------------------- src/forms/output/StackedBarGraph.js | 130 -------------------------- src/forms/output/VerticalLine.js | 59 ------------ 4 files changed, 443 deletions(-) delete mode 100644 src/forms/output/BenefitsLineGraph.js delete mode 100644 src/forms/output/StackedAreaGraph.js delete mode 100644 src/forms/output/StackedBarGraph.js delete mode 100644 src/forms/output/VerticalLine.js diff --git a/src/forms/output/BenefitsLineGraph.js b/src/forms/output/BenefitsLineGraph.js deleted file mode 100644 index daa0bb33..00000000 --- a/src/forms/output/BenefitsLineGraph.js +++ /dev/null @@ -1,124 +0,0 @@ -import React, { Component } from 'react'; -import _ from 'lodash'; -import { Line } from 'react-chartjs-2'; -import { Message } from 'semantic-ui-react'; - -// CUSTOM ELEMENTS -import { VerticalLine } from './VerticalLine'; - -// LOGIC -import { timescaleMultipliers } from '../../utils/convert-by-timescale'; -import { - formatAxis, - formatLabel, - formatBenefitLinesTitle, -} from '../../utils/charts/chartFormatting'; -import { getChartData } from '../../utils/charts/getChartData'; - -// DATA -// In future, graphs will control their own aspect ratio, -// zoom levels, etc., so for now they'll have access to -// the limit values. -import { PROGRAM_CHART_VALUES } from '../../utils/charts/PROGRAM_CHART_VALUES'; - - -// Graphs get things in monthly values, so we'll convert from there -let multipliers = timescaleMultipliers.fromMonthly, - // Each graph controls its own scaling - limits = PROGRAM_CHART_VALUES.limits; - - -class BenefitsLineGraph extends Component { - - constructor (props) { - super(props); - this.state = { verticalLine: new VerticalLine() }; - } - - render () { - const { client, timescale, activePrograms, className } = this.props; - const multiplier = multipliers[ timescale ]; - - if (activePrograms.length === 0) { - return No public benefit programs have been selected; - } - - // Adjust to time-interval, round to hundreds - let max = Math.ceil((limits.max * multiplier) / 100) * 100, - interval = Math.ceil((max / 100) / 10) * 10; - - let extraProps = {}; - - for (let benefitIndex = 0; benefitIndex < activePrograms.length; benefitIndex++) { - extraProps[ activePrograms[ benefitIndex ] ] = { fill: false }; - } - - const xRange = _.range(limits.min, max, interval), // x-axis/earned income numbers - datasets = getChartData(xRange, multiplier, client, activePrograms, extraProps); - - // If there's no data to show, don't show the table - if (datasets.length === 0) { - return null; - } - - // react-chartjs-2 keeps references to plugins, so we - // have to mutate that reference - const earned = client.future.earned * multiplier, - hack = this.state.verticalLine; - hack.xRange = xRange; - hack.earned = earned; - - let lineProps = { - data: { - labels: xRange, - datasets: datasets, - }, // end `data` - options: { - title: { - display: true, - text: 'Individual Benefit Amounts for Household as Pay Changes', - }, - showLines: true, - scales: { - yAxes: [ - { - scaleLabel: { - display: true, - labelString: 'Benefit Value ($)', - }, - ticks: { - beginAtZero: true, - /* chart.js v2.7 requires a callback function */ - callback: formatAxis, - }, - }, - ], // end `yAxes` - xAxes: [ - { - scaleLabel: { - display: true, - labelString: timescale + ' Pay ($)', - }, - ticks: { callback: formatAxis }, - }, - ], // end `xAxes` - }, // end `scales` - tooltips: { - callbacks: { - title: formatBenefitLinesTitle, - label: formatLabel, - }, - }, // end `tooltips` - }, // end `options` - plugins: [ this.state.verticalLine ], - }; // end lineProps - - return ( - - ); - } - -}; // End - - -export { BenefitsLineGraph }; diff --git a/src/forms/output/StackedAreaGraph.js b/src/forms/output/StackedAreaGraph.js deleted file mode 100644 index 707e4f85..00000000 --- a/src/forms/output/StackedAreaGraph.js +++ /dev/null @@ -1,130 +0,0 @@ -import React, { Component } from 'react'; -import _ from 'lodash'; -import { Line } from 'react-chartjs-2'; - -// CUSTOM ELEMENTS -import { VerticalLine } from './VerticalLine'; - -// LOGIC -import { timescaleMultipliers } from '../../utils/convert-by-timescale'; -import { - formatAxis, - formatLabel, - formatStackedTitle, -} from '../../utils/charts/chartFormatting'; -import { getChartData } from '../../utils/charts/getChartData'; - -// DATA -// In future, graphs will control their own aspect ratio, -// zoom levels, etc., so for now they'll have access to -// the limit values. -import { PROGRAM_CHART_VALUES } from '../../utils/charts/PROGRAM_CHART_VALUES'; - - -// Graphs get things in monthly values, so we'll convert from there -let multipliers = timescaleMultipliers.fromMonthly, - // Each graph controls its own scaling - limits = PROGRAM_CHART_VALUES.limits; - -// =============== -// GRAPH DATA -// =============== -/* Note: default tooltip for chart.js 2.0+: - * options: { tooltips: { callbacks: { - * label: function(tooltipItem, data) { - * return tooltipItem.yLabel; - * } - * }}} - */ -class StackedAreaGraph extends Component { - - constructor (props) { - super(props); - this.state = { verticalLine: new VerticalLine() }; - } - - render () { - const { client, timescale, activePrograms } = this.props; - const multiplier = multipliers[ timescale ]; - - let withEarned = activePrograms.slice(); - withEarned.unshift('earned'); - - // Adjust to time-interval, round to hundreds - const earned = client.future.earned * multiplier, - max = Math.max(earned, limits.max * multiplier), - xMax = Math.ceil(max / 100) * 100, - xMin = Math.ceil(limits.min * multiplier / 100) * 100, - interval = Math.ceil(((xMax - xMin) / 100) / 10) * 10, - xRange = _.range(xMin, xMax + interval, interval), - extraProps = { earned: { fill: 'origin' }}, - datasets = getChartData(xRange, multiplier, client, withEarned, extraProps); - - // react-chartjs-2 keeps references to plugins, so we - // have to mutate that reference - let hack = this.state.verticalLine; - hack.xRange = xRange; - hack.earned = earned; - - let stackedAreaProps = { - data: { - labels: xRange, - datasets: datasets, - }, // end `data` - options: { - title: { - display: true, - text: 'All Money Coming in as Pay Changes', - }, // end `title` - elements: { - line: { fill: '-1' }, - point: { - radius: 0, - hitRadius: 10, - hoverRadius: 10, - }, - }, // end `elements` - scales: { - yAxes: [ - { - stacked: true, - scaleLabel: { - display: true, - labelString: 'Total Money Coming In ($)', - }, - ticks: { - beginAtZero: true, - callback: formatAxis, - }, - }, - ], // end `yAxes` - xAxes: [ - { - stacked: true, - scaleLabel: { - display: true, - labelString: timescale + ' Earned ($)', - }, - ticks: { callback: formatAxis }, - }, - ], // end `xAxes` - }, // end `scales` - tooltips: { - callbacks: { - title: formatStackedTitle, - label: formatLabel, - }, - }, // end `tooltips` - }, // end `options` - plugins: [ this.state.verticalLine ], - redraw: true, - }; // end `stackedAreaProps` - - return ( - - ); - } -}; // End - - -export { StackedAreaGraph }; diff --git a/src/forms/output/StackedBarGraph.js b/src/forms/output/StackedBarGraph.js deleted file mode 100644 index 754751c0..00000000 --- a/src/forms/output/StackedBarGraph.js +++ /dev/null @@ -1,130 +0,0 @@ -import React from 'react'; -import { Bar } from 'react-chartjs-2'; - -// COMPONENT HELPER FUNCTIONS -import { - formatAxis, - formatLabel, - formatStackedTitle, -} from '../../utils/charts/chartFormatting'; -import { applyAndPushBenefits } from '../../programs/applyAndPushBenefits'; - -// DATA -// Colors and text for parts of the chart -import { PROGRAM_CHART_VALUES } from '../../utils/charts/PROGRAM_CHART_VALUES'; - -// OBJECT MANIPULATION -import { cloneDeep } from 'lodash'; - - -/** Visual representation of the table - * - * Alternatives: - * 1. Stacked area graph for two data points - * 2. Line graph of difference of just total money coming in - * - * @param {object} client Full client object, with current - * and future. All client props are needed. - */ -const StackedBarGraph = function({ client }) { - - let clone = cloneDeep(client), - curr = clone.current; - - const allData = {}, - activeBenefits = [ - `earned`, - ...curr.benefits, - ]; - - let currentCalcData = { - activeBenefits: activeBenefits, - dataToAddTo: allData, - clientToChange: clone, - timeframe: `current`, - }; - applyAndPushBenefits (currentCalcData); - - // Add to the `current` data already there - let futureCalcData = { - activeBenefits: activeBenefits, - dataToAddTo: allData, - clientToChange: clone, - timeframe: `future`, - }; - applyAndPushBenefits (futureCalcData); - - let datasets = [], - moneyLabels = []; - for (let bName of activeBenefits) { - - let frosting = PROGRAM_CHART_VALUES[ bName ], - dataset = { - label: frosting.name, - backgroundColor: frosting.color, - data: allData[ bName ], - }; - - if (bName === `earned`) { - dataset.fill = `origin`; - for (let amount of dataset.data) { - moneyLabels.push(Math.round(amount)); - } - } - - datasets.push(dataset); - } // end for each benefit in order - - const stackedBarProps = { - data: { - labels: moneyLabels, - datasets: datasets, - }, - options: { - title: { - display: true, - text: 'Money Coming In as Pay Changes', - }, - scales: { - yAxes: [ - { - stacked: true, - scaleLabel: { - display: true, - labelString: 'Total Money Coming In ($)', - }, - ticks: { - beginAtZero: true, - callback: formatAxis, - }, - }, - ], - xAxes: [ - { - stacked: true, - scaleLabel: { - display: true, - labelString: 'Monthly Pay ($)', - }, - ticks: { callback: formatAxis }, - }, - ], - }, - tooltips: { - callbacks: { - title: formatStackedTitle, - label: formatLabel, - }, - }, - }, - }; - - - return ( - - ); - -}; // End - - -export { StackedBarGraph }; diff --git a/src/forms/output/VerticalLine.js b/src/forms/output/VerticalLine.js deleted file mode 100644 index 1f6cbaec..00000000 --- a/src/forms/output/VerticalLine.js +++ /dev/null @@ -1,59 +0,0 @@ - -/** Returns a dashed vertical line at a given - * horizontal position with a given label. For - * use with anything using the same API as - * react-chartjs-2. - * - * @class - */ -class VerticalLine { - - constructor () { - this.xRange = []; - this.earned = 0; - } - - afterDatasetsDraw = (chart) => { - const xRange = this.xRange, - earned = this.earned; - - const i = xRange.findIndex((val) => { - return earned < val; - }); - const positionBetweenTwoPoints = (earned - xRange[ i - 1 ]) / (xRange[ i ] - xRange[ i - 1 ]); - - const data = chart.getDatasetMeta(0).data; - const prevX = data[ i - 1 ]._model.x; - const currX = data[ i ]._model.x; - const offset = Math.floor(positionBetweenTwoPoints * (currX - prevX) + prevX); - - const ctx = chart.chart.ctx; - const scale = chart.scales[ 'y-axis-0' ]; - - ctx.save(); - - ctx.beginPath(); - ctx.strokeStyle = 'rgba(50, 50, 50, 0.5)'; - ctx.lineWidth = 2; - ctx.setLineDash([ - 5, - 5, - ]); - ctx.moveTo(offset, scale.top); - ctx.lineTo(offset, scale.bottom); - ctx.stroke(); - - ctx.fillStyle = 'rgba(50, 50, 50, 0.5)'; - ctx.textAlign = 'left'; - const lineHeight = ctx.measureText('M').width * 1.2; - const xMargin = 5; - const yMargin = 200; - ctx.fillText('Future', offset + xMargin, yMargin); - ctx.fillText('Pay', offset + xMargin, lineHeight + yMargin); - - ctx.restore(); - }; -}; - - -export { VerticalLine }; From 4a769da9676b052609143ec4df306dbde7fee45d Mon Sep 17 00:00:00 2001 From: knod Date: Sat, 24 Nov 2018 13:24:16 -0500 Subject: [PATCH 06/21] Code style cleaning in '/src/components/dev' --- src/components/dev/DevHud.js | 7 +- src/components/dev/LocalizationReport.js | 152 +++++++++++++---------- 2 files changed, 93 insertions(+), 66 deletions(-) diff --git a/src/components/dev/DevHud.js b/src/components/dev/DevHud.js index 089b4def..039a7e90 100644 --- a/src/components/dev/DevHud.js +++ b/src/components/dev/DevHud.js @@ -40,7 +40,7 @@ const DevMenu = function ({ devProps, funcs, data, state }) { } - open={ this.state.modalOpen } - onClose={ this.toggleModalOpen } + trigger = { } + open = { this.state.modalOpen } + onClose = { this.toggleModalOpen } closeIcon> - - Localization Report - + + Localization Report +

This report indicates whether keys in the 'en' localization file are present in - your chosen localization. It will also list any keys in your chosen localization + your chosen localization. It will also list any keys in your chosen localization which should be removed. indicates a check passed. + name = { `check square` } + size = { `large` } + color = { `green` } />indicates a check passed. indicates a check failed and action is needed. + name = { `window close` } + size = { `large` } + color = { `red` } />indicates a check failed and action is needed.

@@ -252,7 +272,7 @@ class LocalizationReport extends Component { @@ -261,4 +281,8 @@ class LocalizationReport extends Component { } }; -export { LocalizationReport }; +export { + LocalizationReport, + ReportItem, + ReportList, +}; From 6d9b0423efccc5fb2d89af6eb3f5ed925ae8e241 Mon Sep 17 00:00:00 2001 From: knod Date: Sat, 24 Nov 2018 13:32:59 -0500 Subject: [PATCH 07/21] Adds to existing comment --- src/components/dev/LocalizationReport.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/components/dev/LocalizationReport.js b/src/components/dev/LocalizationReport.js index fd7fd076..7df8ca57 100644 --- a/src/components/dev/LocalizationReport.js +++ b/src/components/dev/LocalizationReport.js @@ -76,6 +76,8 @@ class LocalizationReport extends Component { // @todo Why not do this at the top before this // component is even created? Then there wouldn't // have to be a check for null in the comparison function. + // Or do it when constructing the component. I don't think + // there's anything that would preclude that in here. componentDidMount() { // Get the list of non-EN localizations for testing let localizationKeys = Object.keys(localizations); From 1dba03a13f10866930afc39e86dac967ec9d9c92 Mon Sep 17 00:00:00 2001 From: Turner Hayes Date: Sat, 24 Nov 2018 20:06:28 -0500 Subject: [PATCH 08/21] Renamed `client` to `clientClone` in dev command line utils; made it a clone and not deep frozen --- src/dev/command-line-utils.js | 4 ++-- src/dev/deepFreeze.js | 39 ----------------------------------- 2 files changed, 2 insertions(+), 41 deletions(-) delete mode 100644 src/dev/deepFreeze.js diff --git a/src/dev/command-line-utils.js b/src/dev/command-line-utils.js index 24349d88..a3f2c9b7 100644 --- a/src/dev/command-line-utils.js +++ b/src/dev/command-line-utils.js @@ -1,4 +1,4 @@ -import deepFreeze from './deepFreeze'; +import cloneDeep from 'lodash/cloneDeep'; export const printSummaryToConsole = () => { console.log( @@ -37,7 +37,7 @@ export const addClientGetterProperty = (clientGetter) => { enumerable: true, configurable: true, get: () => { - return deepFreeze(clientGetter()); + return cloneDeep(clientGetter()); }, }, } diff --git a/src/dev/deepFreeze.js b/src/dev/deepFreeze.js deleted file mode 100644 index 5281ff4b..00000000 --- a/src/dev/deepFreeze.js +++ /dev/null @@ -1,39 +0,0 @@ -/** - * Returns a version of the passed in object that is recursively frozen. - * - * Does not freeze the passed object or any of its nested properties, instead - * returns a frozen copy (diverges from the behavior of Object.freeze()). - * - * @param {*} obj - The object to deep freeze - * - * @returns the frozen object - */ -const deepFreeze = (obj) => { - if (typeof obj === 'undefined' || obj === null) { - return obj; - } - - // Object.freeze() freezes the object passed in as well as returning the frozen object, - // so we need to shallow clone the object/array - obj = - Array.isArray(obj) ? - obj.slice() : - Object.assign({}, obj); - - for (let prop in obj) { - if ( - !obj.hasOwnProperty(prop) || - Object.isFrozen(obj[ prop ]) - ) { - continue; - } - - if (typeof obj[ prop ] === 'object') { - obj[ prop ] = deepFreeze(obj[ prop ]); - } - } - - return Object.freeze(obj); -}; - -export default deepFreeze; From 1c4476d2c660fe658d91e2b40b15e7536032ac69 Mon Sep 17 00:00:00 2001 From: Turner Hayes Date: Sat, 24 Nov 2018 20:13:20 -0500 Subject: [PATCH 09/21] Actually rename the property --- src/dev/command-line-utils.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/dev/command-line-utils.js b/src/dev/command-line-utils.js index a3f2c9b7..a5f4565c 100644 --- a/src/dev/command-line-utils.js +++ b/src/dev/command-line-utils.js @@ -7,9 +7,7 @@ export const printSummaryToConsole = () => { - enableDev() - Enable the Dev HUD (without needing to go to /dev) -- client - The current value of the loaded client (a recursively frozen - one, so that you can't change it, which could cause weirdness - in the app) +- clientClone - A deep clone of the current value of the loaded client ===============================================================================`, 'color: blue', @@ -33,7 +31,7 @@ export const addClientGetterProperty = (clientGetter) => { Object.defineProperties( window, { - client: { + clientClone: { enumerable: true, configurable: true, get: () => { From 6374a49440ce5f505d20841d47e4653661cddfc9 Mon Sep 17 00:00:00 2001 From: knod Date: Sat, 24 Nov 2018 21:02:46 -0500 Subject: [PATCH 10/21] Explanatory comments on skipping --- src/test/forms/output/BenefitsLines.test.js | 1 + src/test/forms/output/ResourcesColumns.test.js | 1 + src/test/forms/output/StackedResources.test.js | 1 + 3 files changed, 3 insertions(+) diff --git a/src/test/forms/output/BenefitsLines.test.js b/src/test/forms/output/BenefitsLines.test.js index 5eebec04..858411ef 100644 --- a/src/test/forms/output/BenefitsLines.test.js +++ b/src/test/forms/output/BenefitsLines.test.js @@ -17,6 +17,7 @@ import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; // }; // }); +// Skipping till highcharts testing is worked out describe.skip('', () => { let activePrograms; let client; diff --git a/src/test/forms/output/ResourcesColumns.test.js b/src/test/forms/output/ResourcesColumns.test.js index e745e450..8c063eba 100644 --- a/src/test/forms/output/ResourcesColumns.test.js +++ b/src/test/forms/output/ResourcesColumns.test.js @@ -17,6 +17,7 @@ import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; // }; // }); +// Skipping till highcharts testing is worked out describe.skip('', () => { let client; diff --git a/src/test/forms/output/StackedResources.test.js b/src/test/forms/output/StackedResources.test.js index 04be4f91..b939ddca 100644 --- a/src/test/forms/output/StackedResources.test.js +++ b/src/test/forms/output/StackedResources.test.js @@ -17,6 +17,7 @@ import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; // }; // }); +// Skipping till highcharts testing is worked out describe.skip('', () => { let activePrograms; let client; From 941cff53c2231fa801590d50d7dd00873863401f Mon Sep 17 00:00:00 2001 From: knod Date: Sat, 24 Nov 2018 21:04:28 -0500 Subject: [PATCH 11/21] Removes old test functionality --- src/test/forms/output/BenefitsLines.test.js | 12 ------------ src/test/forms/output/ResourcesColumns.test.js | 12 ------------ src/test/forms/output/StackedResources.test.js | 12 ------------ 3 files changed, 36 deletions(-) diff --git a/src/test/forms/output/BenefitsLines.test.js b/src/test/forms/output/BenefitsLines.test.js index 858411ef..030e6807 100644 --- a/src/test/forms/output/BenefitsLines.test.js +++ b/src/test/forms/output/BenefitsLines.test.js @@ -5,18 +5,6 @@ import { cloneDeep, set } from 'lodash'; import { BenefitsLines } from '../../../forms/output/BenefitsLines'; import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; -// jest.mock('react-chartjs-2', () => { -// const LineMock = () => { -// return null; -// }; - -// return { -// Line(props) { -// return ; -// }, -// }; -// }); - // Skipping till highcharts testing is worked out describe.skip('', () => { let activePrograms; diff --git a/src/test/forms/output/ResourcesColumns.test.js b/src/test/forms/output/ResourcesColumns.test.js index 8c063eba..3da639ed 100644 --- a/src/test/forms/output/ResourcesColumns.test.js +++ b/src/test/forms/output/ResourcesColumns.test.js @@ -5,18 +5,6 @@ import { cloneDeep, set } from 'lodash'; import { ResourcesColumns } from '../../../forms/output/ResourcesColumns'; import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; -// jest.mock('react-chartjs-2', () => { -// const BarMock = () => { -// return null; -// }; - -// return { -// Bar(props) { -// return ; -// }, -// }; -// }); - // Skipping till highcharts testing is worked out describe.skip('', () => { let client; diff --git a/src/test/forms/output/StackedResources.test.js b/src/test/forms/output/StackedResources.test.js index b939ddca..3670ccd1 100644 --- a/src/test/forms/output/StackedResources.test.js +++ b/src/test/forms/output/StackedResources.test.js @@ -5,18 +5,6 @@ import { cloneDeep, set } from 'lodash'; import { StackedResources } from '../../../forms/output/StackedResources'; import { CLIENT_DEFAULTS } from '../../../utils/CLIENT_DEFAULTS'; -// jest.mock('react-chartjs-2', () => { -// const LineMock = () => { -// return null; -// }; - -// return { -// Line(props) { -// return ; -// }, -// }; -// }); - // Skipping till highcharts testing is worked out describe.skip('', () => { let activePrograms; From f4e27a01ef11695d3c1e0e345f28de1dabe0203d Mon Sep 17 00:00:00 2001 From: knod Date: Sat, 24 Nov 2018 21:19:58 -0500 Subject: [PATCH 12/21] Simplifies logic --- src/components/dev/LocalizationReport.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/components/dev/LocalizationReport.js b/src/components/dev/LocalizationReport.js index 7df8ca57..becf7dba 100644 --- a/src/components/dev/LocalizationReport.js +++ b/src/components/dev/LocalizationReport.js @@ -110,11 +110,7 @@ class LocalizationReport extends Component { return results; } - let pass = true; - if (filter !== `true`) { - pass = false; - } - + let pass = filter === `true`; return results.filter((result) => { return result.pass === pass; }); From ae5e48b7a28650b385f379bb024a2836463e5ddf Mon Sep 17 00:00:00 2001 From: knod Date: Sat, 24 Nov 2018 23:52:50 -0500 Subject: [PATCH 13/21] Cleans code style of '/src/components' through 'Surrounder`. #1018 --- src/components/MainMenu.js | 14 +++++++------- src/components/PageLayout.js | 16 ++++++++++------ src/components/StepBar.js | 26 +++++++++++++++----------- src/components/Surrounder.js | 16 ++++++++-------- src/containers/VisitPage.js | 2 +- src/test/components/StepBar.test.js | 2 +- 6 files changed, 42 insertions(+), 34 deletions(-) diff --git a/src/components/MainMenu.js b/src/components/MainMenu.js index e0c5d3dd..6f79016d 100644 --- a/src/components/MainMenu.js +++ b/src/components/MainMenu.js @@ -11,30 +11,30 @@ const MainMenu = function ({ translations }) { + size = { `large` }> + className = { `main-nav` } + to = { `/` }> { translations.i_homeNav } + className = { `main-nav` } + to = { `/about` }> { translations.i_aboutNav } { translations.i_githubNav } - + {/**/} {/**/} ); -}; // End MainMenu(<>) +}; // Ends export { MainMenu }; diff --git a/src/components/PageLayout.js b/src/components/PageLayout.js index 57e7a384..3b61bf8a 100644 --- a/src/components/PageLayout.js +++ b/src/components/PageLayout.js @@ -4,23 +4,26 @@ import { Segment, } from 'semantic-ui-react'; -const PageLayout = (props) => { + +const PageLayout = ({ children }) => { return (
+ verticalAlign = { `middle` }> - {props.children} + + { children } + + floated = { `right` } + width = { 6 } /> @@ -28,4 +31,5 @@ const PageLayout = (props) => { ); }; + export { PageLayout }; diff --git a/src/components/StepBar.js b/src/components/StepBar.js index e8940e8c..bfed2c80 100644 --- a/src/components/StepBar.js +++ b/src/components/StepBar.js @@ -3,25 +3,29 @@ import { Step } from 'semantic-ui-react'; import { STEP_VALS } from '../forms/STEP_VALS'; + const StepBar = ({ currentStepKey, goToStep, translations }) => { let cleanSteps = []; STEP_VALS.forEach((step, index) => { let newStep = { title: { content: translations[ `i_` + step.key ] }}; - newStep.active = step.key === currentStepKey; - newStep.onClick = (e) => { - goToStep({ key: step.key }); - }; - newStep.key = index; + + newStep.active = step.key === currentStepKey; + newStep.onClick = function (event) { goToStep({ key: step.key }); }; + newStep.key = index; + cleanSteps[ index ] = newStep; }); - return (); + return ( + + ); }; -export default StepBar; + +export { StepBar }; diff --git a/src/components/Surrounder.js b/src/components/Surrounder.js index addef967..712d49bf 100644 --- a/src/components/Surrounder.js +++ b/src/components/Surrounder.js @@ -6,26 +6,26 @@ const Surrounder = function ({ Top, Left, Right, Bottom, children }) { let contents = { top: null, left: null, right: null, bottom: null }; if (Top) { - contents.top = (
{ Top }
); + contents.top = (
{ Top }
); } if (Left) { - contents.left = (
{ Left }
); + contents.left = (
{ Left }
); } if (Right) { - contents.right = (
{ Right }
); + contents.right = (
{ Right }
); } if (Bottom) { - contents.bottom = (
{ Bottom }
); + contents.bottom = (
{ Bottom }
); } return ( -
+
{ contents.top } -
+
{ contents.left } -
+
{ children }
@@ -36,7 +36,7 @@ const Surrounder = function ({ Top, Left, Right, Bottom, children }) {
); -}; // End +}; // Ends export { Surrounder }; diff --git a/src/containers/VisitPage.js b/src/containers/VisitPage.js index 67f52ccb..02308470 100644 --- a/src/containers/VisitPage.js +++ b/src/containers/VisitPage.js @@ -22,7 +22,7 @@ import ErrorListener from '../components/prompts/ErrorListener'; import FeedbackPrompt from '../components/prompts/FeedbackPrompt'; import FeedbackForm from '../components/prompts/FeedbackForm'; import { FeedbackAnytime } from '../components/prompts/FeedbackAnytime'; -import StepBar from '../components/StepBar'; +import { StepBar } from '../components/StepBar'; import { BigButton } from '../forms/inputs'; import { ButtonReset } from '../forms/ButtonReset'; import PredictionsWarning from '../components/prompts/PredictionsWarning'; diff --git a/src/test/components/StepBar.test.js b/src/test/components/StepBar.test.js index 157fe2e0..df8918db 100644 --- a/src/test/components/StepBar.test.js +++ b/src/test/components/StepBar.test.js @@ -1,7 +1,7 @@ import React from 'react'; import { mount } from 'enzyme'; -import StepBar from '../../components/StepBar'; +import { StepBar } from '../../components/StepBar'; import { STEP_VALS } from '../../forms/STEP_VALS'; import { translations } from '../helpers'; From cb6de6d4ec746182ef77a1d2a9dd4a831e3f2c81 Mon Sep 17 00:00:00 2001 From: knod Date: Sun, 25 Nov 2018 13:00:15 -0500 Subject: [PATCH 14/21] Cleans code style of '/src/data'. #1018 --- src/data/federal/2017/SNAPData.js | 14 ++++- src/data/federal/federalPovertyGuidelines.js | 11 ++-- src/data/massachusetts/name-cores.js | 54 +++++++++++--------- 3 files changed, 51 insertions(+), 28 deletions(-) diff --git a/src/data/federal/2017/SNAPData.js b/src/data/federal/2017/SNAPData.js index 4afbafee..2043adf2 100644 --- a/src/data/federal/2017/SNAPData.js +++ b/src/data/federal/2017/SNAPData.js @@ -1,10 +1,18 @@ -/* - * RESOURCES +/** Data tables for MA SNAP calculations. + * @namespace + * + * RESOURCES: * Derived from https://www.masslegalservices.org/content/online-snap-calculator * http://www.mass.gov/eohhs/consumer/basic-needs/financial/program-eligibility-charts-and-tables.html * http://www.mass.gov/eohhs/gov/departments/dta/program-eligibility-charts-and-tables.html + * Standard deductions: http://www.mass.gov/eohhs/docs/dta/eligibility-charts/c-snap-364-400.pdf + * Utility allowance categories: http://www.mass.gov/eohhs/docs/dta/eligibility-charts/c-snap-364-945.pdf + * Net income limits: http://www.mass.gov/eohhs/docs/dta/eligibility-charts/c-snap-364-970.pdf + * SNAP allowance maximums: http://www.mass.gov/eohhs/docs/dta/eligibility-charts/c-snap-364-980-hh-1-10.pdf */ const SNAPData = { + // Code-style note: Properties have to use quotes + // in monthly values, because that is what 106 CMR 364.400 leads to: http://www.mass.gov/eohhs/docs/dta/eligibility-charts/c-snap-364-400.pdf STANDARD_DEDUCTIONS: { 0: 0, 1: 160, 2: 160, 3: 160, 4: 170, 5: 199, 6: 228, 'eachAdditional': 0 }, PERCENT_GROSS_MONTHLY_EARNED: 0.20, @@ -25,5 +33,7 @@ const SNAPData = { SMALL_HOUSEHOLD_SIZE: 2, SMALL_HOUSEHOLD_MIN_GRANT: 15, }; +// @todo: Make class for 'money amount by number of items'-type object + export { SNAPData }; diff --git a/src/data/federal/federalPovertyGuidelines.js b/src/data/federal/federalPovertyGuidelines.js index 22ac39cf..b158bcca 100644 --- a/src/data/federal/federalPovertyGuidelines.js +++ b/src/data/federal/federalPovertyGuidelines.js @@ -1,6 +1,11 @@ +/** Data tables for Federal poverty guildelines/income limits. + * @namespace + * + * RESOURCES: + * http://www.mass.gov/eohhs/docs/masshealth/deskguides/fpl-deskguide.pdf + * https://aspe.hhs.gov/poverty-guidelines + */ const federalPovertyGuidelines = { 0: 0, 1: 12060, 2: 16240, 3: 20420, 4: 24600, 5: 28780, 6: 32960, 7: 37140, 8: 41320, 'eachAdditional': 4180 }; -export { federalPovertyGuidelines }; -//http://www.mass.gov/eohhs/docs/masshealth/deskguides/fpl-deskguide.pdf -//https://aspe.hhs.gov/poverty-guidelines +export { federalPovertyGuidelines }; diff --git a/src/data/massachusetts/name-cores.js b/src/data/massachusetts/name-cores.js index 1ecd8014..d27674b1 100644 --- a/src/data/massachusetts/name-cores.js +++ b/src/data/massachusetts/name-cores.js @@ -1,36 +1,44 @@ -/** Arrays of names which can act as a base off of which -* to build client property keys +/** Collections of names that fall under common MA categories. +* Right now they're meant to be used to make sums of +* client property values. This has been useful when +* property names have changed. +* @module * -* @example var gross = client[ timeframe + base + 'Monthly' ]; +* @example +* import { sumProps } from './someUtilityFolder'; +* let client = { disabledMedical: 1, otherMedical: 10, disabledAssistance: 100 }; +* var allMedicalExpenses = sumProps(ALL_MEDICAL_EXPENSES); +* console.log(allMedicalExpenses); +* // 111 */ const UNEARNED_INCOME_SOURCES = [ - 'TAFDC', - 'SSI', - 'SSDI', - 'childSupportIn', - 'unemployment', - 'workersComp', - 'pension', - 'socialSecurity', - 'alimony', - 'otherIncome', + `TAFDC`, + `SSI`, + `SSDI`, + `childSupportIn`, + `unemployment`, + `workersComp`, + `pension`, + `socialSecurity`, + `alimony`, + `otherIncome`, ]; const UNDER13_CARE_EXPENSES = [ - 'childDirectCare', - 'childBeforeAndAfterSchoolCare', - 'childTransportation', - 'childOtherCare', + `childDirectCare`, + `childBeforeAndAfterSchoolCare`, + `childTransportation`, + `childOtherCare`, ]; const OVER12_CARE_EXPENSES = [ - 'adultDirectCare', - 'adultTransportation', - 'adultOtherCare', + `adultDirectCare`, + `adultTransportation`, + `adultOtherCare`, ]; -/** @todo Convert all to this later, but will have +/* @todo Convert all to this later, but will have * to generate new SNAP test cases because the * strings they check against have the array * elements in a different order. @@ -40,14 +48,14 @@ const UNDER13_NON_TRANSPORT_CARE = [ `childBeforeAndAfterSchoolCare`, `childOtherCare`, ]; -const UNDER13_TRANSPORT = [ `childTransportation` ]; +const UNDER13_TRANSPORT = [ `childTransportation` ]; // const UNDER13_CARE_EXPENSES = UNDER13_NON_TRANSPORT_CARE.concat(UNDER13_TRANSPORT); const OVER12_NON_TRANSPORT_CARE = [ `adultDirectCare`, `adultOtherCare`, ]; -const OVER12_TRANSPORT = [ `adultTransportation` ]; +const OVER12_TRANSPORT = [ `adultTransportation` ]; // const OVER12_CARE_EXPENSES = OVER12_NON_TRANSPORT_CARE.concat(OVER12_TRANSPORT); const NON_TRANSPORT_DEPENDENT_COSTS = UNDER13_NON_TRANSPORT_CARE.concat(OVER12_NON_TRANSPORT_CARE); From 34a9f0286a17ed0b003ae24981d2980fd99d53dd Mon Sep 17 00:00:00 2001 From: knod Date: Sun, 25 Nov 2018 21:08:06 -0500 Subject: [PATCH 15/21] Non-ideal possible solution for jsdoc build problems --- src/data/federal/2017/SNAPData.js | 7 ++++++- src/data/federal/federalPovertyGuidelines.js | 4 ++-- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/data/federal/2017/SNAPData.js b/src/data/federal/2017/SNAPData.js index 2043adf2..7f9755e9 100644 --- a/src/data/federal/2017/SNAPData.js +++ b/src/data/federal/2017/SNAPData.js @@ -2,7 +2,12 @@ * @namespace * * RESOURCES: - * Derived from https://www.masslegalservices.org/content/online-snap-calculator + * Derived from {@link https://www.masslegalservices.org/content/online-snap-calculator} + * See more resources in the actual code since some + * can't be referenced in these comments. + */ +/* MORE RESOURCES + * (Since pdfs and htmls can't seem to be referenced safely in jsdoc comments) * http://www.mass.gov/eohhs/consumer/basic-needs/financial/program-eligibility-charts-and-tables.html * http://www.mass.gov/eohhs/gov/departments/dta/program-eligibility-charts-and-tables.html * Standard deductions: http://www.mass.gov/eohhs/docs/dta/eligibility-charts/c-snap-364-400.pdf diff --git a/src/data/federal/federalPovertyGuidelines.js b/src/data/federal/federalPovertyGuidelines.js index b158bcca..fc671038 100644 --- a/src/data/federal/federalPovertyGuidelines.js +++ b/src/data/federal/federalPovertyGuidelines.js @@ -2,8 +2,8 @@ * @namespace * * RESOURCES: - * http://www.mass.gov/eohhs/docs/masshealth/deskguides/fpl-deskguide.pdf - * https://aspe.hhs.gov/poverty-guidelines + * {@link http://www.mass.gov/eohhs/docs/masshealth/deskguides/fpl-deskguide.pdf} + * {@link https://aspe.hhs.gov/poverty-guidelines} */ const federalPovertyGuidelines = { 0: 0, 1: 12060, 2: 16240, 3: 20420, 4: 24600, 5: 28780, 6: 32960, 7: 37140, 8: 41320, 'eachAdditional': 4180 }; From 19b4c8c5e43b80537bb0ec65c72964fed3769f72 Mon Sep 17 00:00:00 2001 From: knod Date: Sun, 25 Nov 2018 21:22:56 -0500 Subject: [PATCH 16/21] Cleans code style of some files --- src/forms/output/BenefitsLines.js | 30 +- src/forms/output/BenefitsTable.js | 262 +- src/forms/output/GraphHolder.js | 30 +- src/forms/output/ResourcesColumns.js | 21 +- src/forms/output/StackedResources.js | 30 +- src/forms/output/chartStringTransformers.js | 2 +- .../__snapshots__/BenefitsTable.test.js.snap | 2412 ++++++++--------- 7 files changed, 1391 insertions(+), 1396 deletions(-) diff --git a/src/forms/output/BenefitsLines.js b/src/forms/output/BenefitsLines.js index 68f654d4..3333348d 100644 --- a/src/forms/output/BenefitsLines.js +++ b/src/forms/output/BenefitsLines.js @@ -81,21 +81,21 @@ class BenefitsLinesComp extends Component { classes += ` ` + className; } - const multiplier = multipliers[ timescale ], - resources = activePrograms, - currentEarned = client.current.earned * multiplier, - getText = textFromTranslatedElement; + let multiplier = multipliers[ timescale ], + resources = activePrograms, + currentEarned = client.current.earned * multiplier, + getText = textFromTranslatedElement; // Adjust to time-interval. Highcharts will round // for displayed ticks. - const max = (limits.max * multiplier), - interval = ((max / 100) / 10); + let max = (limits.max * multiplier), + interval = ((max / 100) / 10); - const xRange = range(limits.min, max, interval), // x-axis/earned income numbers - datasets = getChartData(xRange, multiplier, client, resources, {}); + let xRange = range(limits.min, max, interval), // x-axis/earned income numbers + datasets = getChartData(xRange, multiplier, client, resources, {}); // Individual benefit lines - const lines = []; + let lines = []; for (let dataset of datasets) { let line = ( ${getText(translations.i_beforeMoney)}`, - labelHeaderFormatEnd = `{point.key:,.2f}${getText(translations.i_afterMoney)}
`, - labelHeaderFormat = labelHeaderFormatStart + labelHeaderFormatEnd; + let labelHeaderFormatStart = `${getText(translations.i_beforeMoney)}`, + labelHeaderFormatEnd = `{point.key:,.2f}${getText(translations.i_afterMoney)}
`, + labelHeaderFormat = labelHeaderFormatStart + labelHeaderFormatEnd; - const plotOptions = { line: { pointInterval: interval }}; + let plotOptions = { line: { pointInterval: interval }}; return (
@@ -265,10 +265,10 @@ class BenefitsLinesComp extends Component { this.setState({ altKeyClass: `` }); } }; -}; +}; // Ends -const BenefitsLines = withHighcharts(BenefitsLinesComp, Highcharts); +let BenefitsLines = withHighcharts(BenefitsLinesComp, Highcharts); export { BenefitsLines }; diff --git a/src/forms/output/BenefitsTable.js b/src/forms/output/BenefitsTable.js index eb2e81a6..c9052400 100644 --- a/src/forms/output/BenefitsTable.js +++ b/src/forms/output/BenefitsTable.js @@ -9,15 +9,14 @@ import { applyAndPushBenefits } from '../../programs/applyAndPushBenefits'; import { cloneDeep } from 'lodash'; +// @todo Move to utils file somewhere? const getSignSymbol = function (num) { if (num > 0) { - return '+'; - } - else if (num < 0) { - return '-'; - } - else { return ''; } -}; // End getSignSymbol() + return `+`; + } else if (num < 0) { + return `-`; + } else { return ``; } +}; const BenefitsTable = function ({ client, translations }) { @@ -49,77 +48,75 @@ const BenefitsTable = function ({ client, translations }) { }; applyAndPushBenefits (futureCalcData); - const earned = allData.earned; + let earned = allData.earned; - const currentBenefits = {}; - const futureBenefits = {}; - const benefitDiffs = {}; - let totalDiff = 0; - let totalBenefitCurrent = 0; - let totalBenefitFuture = 0; + let currentBenefits = {}, + futureBenefits = {}, + benefitDiffs = {}, + totalDiff = 0, + totalBenefitCurrent = 0, + totalBenefitFuture = 0; for (let benefitIndex = 0; benefitIndex < curr.benefits.length; benefitIndex++) { - const benefit = curr.benefits[ benefitIndex ]; - - const benefitData = allData[ benefit ]; + + let benefit = curr.benefits[ benefitIndex ], + benefitData = allData[ benefit ]; if (benefitData) { - const [ + let [ currentBenefit, futureBenefit, ] = benefitData; currentBenefits[ benefit ] = Math.round(currentBenefit); - - futureBenefits[ benefit ] = Math.round(futureBenefit); + futureBenefits[ benefit ] = Math.round(futureBenefit); totalBenefitCurrent += currentBenefits[ benefit ]; - totalBenefitFuture += futureBenefits[ benefit ]; - } - else { + totalBenefitFuture += futureBenefits[ benefit ]; + } else { currentBenefits[ benefit ] = 0; - - futureBenefits[ benefit ] = 0; + futureBenefits[ benefit ] = 0; } benefitDiffs[ benefit ] = futureBenefits[ benefit ] - currentBenefits[ benefit ]; totalDiff += benefitDiffs[ benefit ]; } - const earnedCurrent = Math.round(earned[ 0 ]), - earnedFuture = Math.round(earned[ 1 ]), - earnedDiff = earnedFuture - earnedCurrent, - netCurrent = totalBenefitCurrent + earnedCurrent, - netFuture = totalBenefitFuture + earnedFuture, - netDiff = totalDiff + earnedDiff; - - const columnHeaderStyle = { - background: 'rgba(0, 181, 173, 1)', - color: 'white', - fontSize: '1.3em', - fontWeight: 900, - textAlign: 'center', - borderRadius: 'inherit', - letterSpacing: '0.02em', - }, - totalsRowStyle = { - borderTop: '2px solid rgba(0, 181, 173, 1)', - fontWeight: 700, - fontSize: '1.1em', - padingTop: '0.25em', - }, - rowHeaderStyle = { - fontSize: '1.1em', - fontWeight: 700, - textAlign: 'left', - }, - totalsRowHeaderStyle = { - fontSize: '1.2em', - fontWeight: 700, - textAlign: 'left', - borderTop: '2px solid rgba(0, 181, 173, 1)', - padingTop: '0.25em', - }; + let earnedCurrent = Math.round(earned[ 0 ]), + earnedFuture = Math.round(earned[ 1 ]), + earnedDiff = earnedFuture - earnedCurrent, + netCurrent = totalBenefitCurrent + earnedCurrent, + netFuture = totalBenefitFuture + earnedFuture, + netDiff = totalDiff + earnedDiff; + + // @todo Possible to break the following components out? + let columnHeaderStyle = { + background: `rgba(0, 181, 173, 1)`, + color: `white`, + fontSize: `1.3em`, + fontWeight: 900, + textAlign: `center`, + borderRadius: `inherit`, + letterSpacing: `0.02em`, + }, + totalsRowStyle = { + borderTop: `2px solid rgba(0, 181, 173, 1)`, + fontWeight: 700, + fontSize: `1.1em`, + padingTop: `0.25em`, + }, + rowHeaderStyle = { + fontSize: `1.1em`, + fontWeight: 700, + textAlign: `left`, + }, + totalsRowHeaderStyle = { + fontSize: `1.2em`, + fontWeight: 700, + textAlign: `left`, + borderTop: `2px solid rgba(0, 181, 173, 1)`, + padingTop: `0.25em`, + }; const TotalBenefitsRow = function({ client, translations }){ if (client.current.benefits.length <= 1) { @@ -129,24 +126,28 @@ const BenefitsTable = function ({ client, translations }) { return ( { translations.i_rowTotalBenefits } + textAlign = { `right` } + width = { 3 } + style = { totalsRowHeaderStyle }> + { translations.i_rowTotalBenefits } { translations.i_beforeMoneyWithTime }{totalBenefitCurrent}{ translations.i_afterMoneyWithTime } + textAlign = { `right` } + width = { 3 } + style = { totalsRowStyle }> + { translations.i_beforeMoneyWithTime }{totalBenefitCurrent}{ translations.i_afterMoneyWithTime } { translations.i_beforeMoneyWithTime }{totalBenefitFuture}{ translations.i_afterMoneyWithTime } + textAlign = { `right` } + width = { 3 } + style = { totalsRowStyle }> + { translations.i_beforeMoneyWithTime }{totalBenefitFuture}{ translations.i_afterMoneyWithTime } { getSignSymbol(totalDiff) } { translations.i_beforeMoneyWithTime }{ Math.abs(totalDiff) }{ translations.i_afterMoneyWithTime } + textAlign = { `right` } + width = { 3 } + style = { totalsRowStyle }> + { getSignSymbol(totalDiff) } { translations.i_beforeMoneyWithTime }{ Math.abs(totalDiff) }{ translations.i_afterMoneyWithTime } ); @@ -156,35 +157,39 @@ const BenefitsTable = function ({ client, translations }) { return ( { translations.i_rowEarned } - { translations.i_beforeMoneyWithTime }{earnedCurrent}{ translations.i_afterMoneyWithTime } - { translations.i_beforeMoneyWithTime }{earnedFuture}{ translations.i_afterMoneyWithTime } - { getSignSymbol(earnedDiff) } { translations.i_beforeMoneyWithTime }{ Math.abs(earnedDiff) }{ translations.i_afterMoneyWithTime } + { translations.i_beforeMoneyWithTime }{earnedCurrent}{ translations.i_afterMoneyWithTime } + { translations.i_beforeMoneyWithTime }{earnedFuture}{ translations.i_afterMoneyWithTime } + { getSignSymbol(earnedDiff) } { translations.i_beforeMoneyWithTime }{ Math.abs(earnedDiff) }{ translations.i_afterMoneyWithTime } ); }; const TotalsRow = function ({ translations }) { return ( - + { translations.i_rowNetTotal } + textAlign = { `right` } + width = { 3 } + style = { totalsRowHeaderStyle }> + { translations.i_rowNetTotal } { translations.i_beforeMoneyWithTime }{netCurrent}{ translations.i_afterMoneyWithTime } + textAlign = { `right` } + width = { 3 } + style = { totalsRowStyle }> + { translations.i_beforeMoneyWithTime }{netCurrent}{ translations.i_afterMoneyWithTime } { translations.i_beforeMoneyWithTime }{netFuture}{ translations.i_afterMoneyWithTime } + textAlign = { `right` } + width = { 3 } + style = { totalsRowStyle }> + { translations.i_beforeMoneyWithTime }{netFuture}{ translations.i_afterMoneyWithTime } { getSignSymbol(netDiff) } { translations.i_beforeMoneyWithTime }{ Math.abs(netDiff) }{ translations.i_afterMoneyWithTime } + textAlign = { `right` } + width = { 3 } + style = { totalsRowStyle }> + { getSignSymbol(netDiff) } { translations.i_beforeMoneyWithTime }{ Math.abs(netDiff) }{ translations.i_afterMoneyWithTime } ); @@ -193,59 +198,60 @@ const BenefitsTable = function ({ client, translations }) { const benefitRows = []; for (let benefitIndex = 0; benefitIndex < curr.benefits.length; benefitIndex++) { - const benefit = curr.benefits[ benefitIndex ]; - - const diff = benefitDiffs[ benefit ]; - - const label = translations[ `i_row_${benefit}` ]; + let benefit = curr.benefits[ benefitIndex ], + diff = benefitDiffs[ benefit ], + label = translations[ `i_row_${benefit}` ]; benefitRows.push( { label } - { translations.i_beforeMoneyWithTime }{currentBenefits[ benefit ]}{ translations.i_afterMoneyWithTime } - { translations.i_beforeMoneyWithTime }{futureBenefits[ benefit ]}{ translations.i_afterMoneyWithTime } - { getSignSymbol(diff) } { translations.i_beforeMoneyWithTime }{ Math.abs(diff) }{ translations.i_afterMoneyWithTime } + { translations.i_beforeMoneyWithTime }{currentBenefits[ benefit ]}{ translations.i_afterMoneyWithTime } + { translations.i_beforeMoneyWithTime }{futureBenefits[ benefit ]}{ translations.i_afterMoneyWithTime } + { getSignSymbol(diff) } { translations.i_beforeMoneyWithTime }{ Math.abs(diff) }{ translations.i_afterMoneyWithTime } ); } return ( -
- - - - { translations.i_columnBenefit } - - { translations.i_columnCurrentBenefits } - - { translations.i_columnNewEstimate } - - { translations.i_columnDifference } - - - - - {benefitRows} - - - - -
-
+ + + + + { translations.i_columnBenefit } + + + { translations.i_columnCurrentBenefits } + + + { translations.i_columnNewEstimate } + + + { translations.i_columnDifference } + + + + + + { benefitRows } + + + + +
); -}; // End BenefitsTable(<>) +}; // Ends export { BenefitsTable }; diff --git a/src/forms/output/GraphHolder.js b/src/forms/output/GraphHolder.js index 9e757368..31771c6d 100644 --- a/src/forms/output/GraphHolder.js +++ b/src/forms/output/GraphHolder.js @@ -5,11 +5,14 @@ import { Message } from 'semantic-ui-react'; import { GraphTimeButtons } from '../../components/GraphTimeButtons'; +/** Keeps track of time interval currently requested + * (weekly/monthly/yearly) and, if needed, shows + * 'no graph' message. */ class GraphHolder extends Component { constructor (props) { super(props); - this.state = { activeID: 'Monthly' }; + this.state = { activeID: `Monthly` }; } onClick = (evnt) => { @@ -18,33 +21,32 @@ class GraphHolder extends Component { }; render () { - const { activeID } = this.state, + const { activeID } = this.state, { Graph, client, translations } = this.props, - { current } = client, + { current } = client, // The ids later used to access all program-specific data and functions // Only active programs are added - activePrograms = [ ...current.benefits ]; + activePrograms = [ ...current.benefits ]; if (activePrograms.length === 0) { return { translations.i_noBenefitsSelected }; } return ( -
+
+ activeID = { activeID } + onClick = { this.onClick } /> + translations = { translations } />
); - }; // End render() - -}; // End + }; // Ends render() +}; // Ends export { GraphHolder }; diff --git a/src/forms/output/ResourcesColumns.js b/src/forms/output/ResourcesColumns.js index 7ba3fe5c..7aae30fa 100644 --- a/src/forms/output/ResourcesColumns.js +++ b/src/forms/output/ResourcesColumns.js @@ -68,11 +68,11 @@ class ResourcesColumnsComp extends Component { // Adjust to time-interval. Highcharts will round // for displayed ticks. - const xRange = [ - currentEarned, - futureEarned, - ], // x-axis/earned income numbers - datasets = getChartData(xRange, multiplier, clone, resources, {}); + let xRange = [ + currentEarned, + futureEarned, + ], // x-axis/earned income numbers + datasets = getChartData(xRange, multiplier, clone, resources, {}); // Columns and categories for each pay amount let columns = [], @@ -98,7 +98,7 @@ class ResourcesColumnsComp extends Component { categories.push(formatted); } } - } + } // ends for every dataset const plotOptions = { column: { stacking: `normal` }}; @@ -108,8 +108,8 @@ class ResourcesColumnsComp extends Component { { getText(translations.i_stackedBarGraphTitle) } @@ -146,10 +146,9 @@ class ResourcesColumnsComp extends Component { -
); - } // Ends render() + }; // Ends render() /** Adds translation-specific money designations @@ -174,7 +173,7 @@ class ResourcesColumnsComp extends Component { formatMoneyWithK = (highchartsObject) => { return formatMoneyWithK(highchartsObject, this.props.translations); }; -}; +}; // Ends const ResourcesColumns = withHighcharts(ResourcesColumnsComp, Highcharts); diff --git a/src/forms/output/StackedResources.js b/src/forms/output/StackedResources.js index e569107c..99af73b1 100644 --- a/src/forms/output/StackedResources.js +++ b/src/forms/output/StackedResources.js @@ -86,21 +86,21 @@ class StackedResourcesComp extends Component { classes += ` ` + className; } - const multiplier = multipliers[ timescale ], - resources = [ `earned` ].concat(activePrograms), - currentEarned = client.current.earned * multiplier, - getText = textFromTranslatedElement; + let multiplier = multipliers[ timescale ], + resources = [ `earned` ].concat(activePrograms), + currentEarned = client.current.earned * multiplier, + getText = textFromTranslatedElement; // Adjust to time-interval. Highcharts will round // for displayed ticks. - const max = (limits.max * multiplier), - interval = ((max / 100) / 10); + let max = (limits.max * multiplier), + interval = ((max / 100) / 10); - const xRange = range(limits.min, max, interval), // x-axis/earned income numbers - datasets = getChartData(xRange, multiplier, client, resources, {}); + let xRange = range(limits.min, max, interval), // x-axis/earned income numbers + datasets = getChartData(xRange, multiplier, client, resources, {}); // Data to stack - const lines = []; + let lines = []; for (let dataseti = 0; dataseti < datasets.length; dataseti++) { let dataset = datasets[ dataseti ], line = ( @@ -119,12 +119,12 @@ class StackedResourcesComp extends Component { // Label for split tooltip 'labels'/'label headers' that appear // at the bottom. Really long. // @todo Change to prep for context, like in @knod 'other-expenses' branch - const bottomTooltipFormatStart = `${getText(translations.i_beforeMoney)}`, - bottomTooltipFormatEnd = `{point.key:,.2f}${getText(translations.i_afterMoney)}
`, - bottomTooltipFormat = bottomTooltipFormatStart + bottomTooltipFormatEnd; + let bottomTooltipFormatStart = `${getText(translations.i_beforeMoney)}`, + bottomTooltipFormatEnd = `{point.key:,.2f}${getText(translations.i_afterMoney)}
`, + bottomTooltipFormat = bottomTooltipFormatStart + bottomTooltipFormatEnd; - const plotOptions = { + let plotOptions = { area: { stacking: `normal`, pointInterval: interval }, series: { marker: { enabled: false }}, // No dots on the lines }; @@ -277,10 +277,10 @@ class StackedResourcesComp extends Component { this.setState({ altKeyClass: `` }); } }; -}; +}; // Ends -const StackedResources = withHighcharts(StackedResourcesComp, Highcharts); +let StackedResources = withHighcharts(StackedResourcesComp, Highcharts); export { StackedResources }; diff --git a/src/forms/output/chartStringTransformers.js b/src/forms/output/chartStringTransformers.js index a172c541..e2641bc8 100644 --- a/src/forms/output/chartStringTransformers.js +++ b/src/forms/output/chartStringTransformers.js @@ -4,8 +4,8 @@ /** Recursively extract text from language-specific React * objects. Creates one inline string of text. - * * Recursion is untested. + * * @params {object} translationObj React element containing * children that are strings or other React elements. * diff --git a/src/test/forms/output/__snapshots__/BenefitsTable.test.js.snap b/src/test/forms/output/__snapshots__/BenefitsTable.test.js.snap index 9a926e0a..21f27a77 100644 --- a/src/test/forms/output/__snapshots__/BenefitsTable.test.js.snap +++ b/src/test/forms/output/__snapshots__/BenefitsTable.test.js.snap @@ -1,1360 +1,1348 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Benefits table renders correctly 1`] = ` -
- + - - - - + - + - + - - - + Some translated text. + + + + + - - - - - - - - + + + + + - + - + - + - - -
- Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. -
- Some translated text. - - Some translated text. - 0 - Some translated text. - - Some translated text. - 0 - Some translated text. - - - - Some translated text. - 0 - Some translated text. -
+ + Some translated text. + 0 + Some translated text. + + Some translated text. + 0 + Some translated text. + + + + Some translated text. + 0 + Some translated text. +
- Some translated text. - + Some translated text. + - Some translated text. - 0 - Some translated text. - + Some translated text. + 0 + Some translated text. + - Some translated text. - 0 - Some translated text. - + Some translated text. + 0 + Some translated text. + - - - Some translated text. - 0 - Some translated text. -
-
+ } + > + + + Some translated text. + 0 + Some translated text. + + + + `; exports[`Benefits table renders correctly 2`] = ` -
- + - - - - + - + - + - - - + Some translated text. + + + + + - - - - - - - - - - - - - + + + + + + + + + + + - + - + - + - - -
- Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. -
- Some translated text. - - Some translated text. - 192 - Some translated text. - - Some translated text. - 192 - Some translated text. - - - - Some translated text. - 0 - Some translated text. -
- Some translated text. - - Some translated text. - 0 - Some translated text. - - Some translated text. - 0 - Some translated text. - - - - Some translated text. - 0 - Some translated text. -
+ Some translated text. + 192 + Some translated text. + + Some translated text. + 192 + Some translated text. + + + + Some translated text. + 0 + Some translated text. +
- + + Some translated text. + 0 + Some translated text. + + Some translated text. + 0 + Some translated text. + + + + Some translated text. + 0 + Some translated text. +
- Some translated text. - + Some translated text. + - Some translated text. - 192 - Some translated text. - + Some translated text. + 192 + Some translated text. + - Some translated text. - 192 - Some translated text. - + Some translated text. + 192 + Some translated text. + - - - Some translated text. - 0 - Some translated text. -
-
+ } + > + + + Some translated text. + 0 + Some translated text. + + + + `; exports[`Benefits table renders correctly 3`] = ` -
- + - - - - + - + - + - - - + Some translated text. + + + + + - - - - - - - - - - - - - + + + + + + + + + + + - + - + - + - - -
- Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. -
- Some translated text. - - Some translated text. - 192 - Some translated text. - - Some translated text. - 192 - Some translated text. - - - - Some translated text. - 0 - Some translated text. -
- Some translated text. - - Some translated text. - 100 - Some translated text. - - Some translated text. - 0 - Some translated text. - - - - - Some translated text. - 100 - Some translated text. -
+ Some translated text. + 192 + Some translated text. + + Some translated text. + 192 + Some translated text. + + + + Some translated text. + 0 + Some translated text. +
- + + Some translated text. + 100 + Some translated text. + + Some translated text. + 0 + Some translated text. + + - + + Some translated text. + 100 + Some translated text. +
- Some translated text. - + Some translated text. + - Some translated text. - 292 - Some translated text. - + Some translated text. + 292 + Some translated text. + - Some translated text. - 192 - Some translated text. - + Some translated text. + 192 + Some translated text. + - - - - Some translated text. - 100 - Some translated text. -
-
+ } + > + - + + Some translated text. + 100 + Some translated text. + + + + `; exports[`Benefits table renders correctly 4`] = ` -
- + - - - - + - + - + - - - + Some translated text. + + + + + - - - - - - - - - - - - - + + + + + + + + + + + - + - + - + - - -
- Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. -
- Some translated text. - - Some translated text. - 192 - Some translated text. - - Some translated text. - 192 - Some translated text. - - - - Some translated text. - 0 - Some translated text. -
- Some translated text. - - Some translated text. - 100 - Some translated text. - - Some translated text. - 200 - Some translated text. - - + - - Some translated text. - 100 - Some translated text. -
+ Some translated text. + 192 + Some translated text. + + Some translated text. + 192 + Some translated text. + + + + Some translated text. + 0 + Some translated text. +
- + + Some translated text. + 100 + Some translated text. + + Some translated text. + 200 + Some translated text. + + + + + Some translated text. + 100 + Some translated text. +
- Some translated text. - + Some translated text. + - Some translated text. - 292 - Some translated text. - + Some translated text. + 292 + Some translated text. + - Some translated text. - 392 - Some translated text. - + Some translated text. + 392 + Some translated text. + - + - - Some translated text. - 100 - Some translated text. -
-
+ } + > + + + + Some translated text. + 100 + Some translated text. + + + + `; exports[`Benefits table renders correctly 5`] = ` -
- + - - - - + - + - + - - - + Some translated text. + + + + + - - - - - - - - - - - - - + + + + + + + + + + + - + - + - + - - -
- Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. -
- Some translated text. - - Some translated text. - 192 - Some translated text. - - Some translated text. - 192 - Some translated text. - - - - Some translated text. - 0 - Some translated text. -
- Some translated text. - - Some translated text. - 300 - Some translated text. - - Some translated text. - 200 - Some translated text. - - - - - Some translated text. - 100 - Some translated text. -
+ Some translated text. + 192 + Some translated text. + + Some translated text. + 192 + Some translated text. + + + + Some translated text. + 0 + Some translated text. +
- + + Some translated text. + 300 + Some translated text. + + Some translated text. + 200 + Some translated text. + + - + + Some translated text. + 100 + Some translated text. +
- Some translated text. - + Some translated text. + - Some translated text. - 492 - Some translated text. - + Some translated text. + 492 + Some translated text. + - Some translated text. - 392 - Some translated text. - + Some translated text. + 392 + Some translated text. + - - - - Some translated text. - 100 - Some translated text. -
-
+ } + > + - + + Some translated text. + 100 + Some translated text. + + + + `; exports[`Benefits table renders correctly 6`] = ` -
- + - - - - + - + - + - - - + Some translated text. + + + + + - - - - - - - - - - - - - + + + + + + + + + + + - + - + - + - - -
- Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. - + Some translated text. + - Some translated text. -
- Some translated text. - - Some translated text. - 192 - Some translated text. - - Some translated text. - 187 - Some translated text. - - - - - Some translated text. - 5 - Some translated text. -
- Some translated text. - - Some translated text. - 300 - Some translated text. - - Some translated text. - 400 - Some translated text. - - + - - Some translated text. - 100 - Some translated text. -
+ Some translated text. + 192 + Some translated text. + + Some translated text. + 187 + Some translated text. + + - + + Some translated text. + 5 + Some translated text. +
- + + Some translated text. + 300 + Some translated text. + + Some translated text. + 400 + Some translated text. + + + + + Some translated text. + 100 + Some translated text. +
- Some translated text. - + Some translated text. + - Some translated text. - 492 - Some translated text. - + Some translated text. + 492 + Some translated text. + - Some translated text. - 587 - Some translated text. - + Some translated text. + 587 + Some translated text. + - + - - Some translated text. - 95 - Some translated text. -
-
+ } + > + + + + Some translated text. + 95 + Some translated text. + + + + `; From 5764cfba878e267b13018b30d99cd15c2de06960 Mon Sep 17 00:00:00 2001 From: knod Date: Sun, 25 Nov 2018 21:29:24 -0500 Subject: [PATCH 17/21] Finishes cleaning in /output --- src/forms/output/Summary.js | 28 ++++++++++++++++------------ src/forms/output/zoom.js | 18 +++++++++--------- 2 files changed, 25 insertions(+), 21 deletions(-) diff --git a/src/forms/output/Summary.js b/src/forms/output/Summary.js index 331586af..44e0ea7c 100644 --- a/src/forms/output/Summary.js +++ b/src/forms/output/Summary.js @@ -1,6 +1,11 @@ +/** @module */ + // REACT COMPONENTS import React from 'react'; -import { Header, Button } from 'semantic-ui-react'; +import { + Header, + Button, +} from 'semantic-ui-react'; // DATA // Colors and text for parts of the chart @@ -14,7 +19,7 @@ import { toMoneyStr } from '../../utils/prettifiers'; import { applyAndPushBenefits } from '../../programs/applyAndPushBenefits'; -let EARNED_MONTHLY_INCREMENT_AMOUNT = 50; // About a 25 cent raise in monthly amount for 40hrs/week? +const EARNED_MONTHLY_INCREMENT_AMOUNT = 50; // About a 25 cent raise in monthly amount for 40hrs/week? /** Rounds money values, turns them into money-formatted @@ -210,6 +215,7 @@ let getBenefitData = function(client, resourceKeys) { clientToChange: clone, timeframe: `current`, }; + let currentCalcData = defaultProps; applyAndPushBenefits(currentCalcData); let futureCalcData = { ...defaultProps, timeframe: `future` }; @@ -220,8 +226,8 @@ let getBenefitData = function(client, resourceKeys) { // Fill earned values for both current and future earned objects result.current = fillInMoneyValues(resourceKeys, accumulated, 0); result.future = fillInMoneyValues(resourceKeys, accumulated, 1); - let resultCurr = result.current, - resultFutr = result.future; + let resultCurr = result.current, + resultFutr = result.future; // 3. Get difference between totals, partly to // see if we need to get cliff info. @@ -245,7 +251,7 @@ let getBenefitData = function(client, resourceKeys) { result.recovery.total = recoveryAmount; result.recovery.earned = earned[ earned.length - 1 ]; - } // ends if hit dramatic cliff + } // ends if hit dramatic cliff (implicit taxes > 100%) return result; }; // Ends getBenefitData() @@ -328,7 +334,7 @@ const Summary = function ({ client, openFeedback, translations }) { fBenefit = future.benefits[ benefiti ]; benefitList.push( -
  • +
  • {cBenefit.label} {translations.i_from} {translations.i_beforeMoneyWithTime}{round$(cBenefit.amount)} {` `} {translations.i_to} {translations.i_beforeMoneyWithTime}{round$(fBenefit.amount)} {translations.i_eachTimeInterval}{translations.i_period}
    • @@ -340,9 +346,7 @@ const Summary = function ({ client, openFeedback, translations }) { // that the tool is still a prototype let feedbackAsk = (

    - - { translations.i_feedbackAsk } - + { translations.i_feedbackAsk }