update prettier config and run on all files

src/app.tsx

@@ -1,22 +1,11 @@
 import * as H from 'history';
 import queryString from 'query-string';
-import {analyticsEvent} from './util/analytics';
-import {Changelog} from './changelog';
-import {DataSourceEnum, SourceSelection} from './datasource/data_source';
-import {Details} from './details/details';
-import {EmbeddedDataSource, EmbeddedSourceSpec} from './datasource/embedded';
-import {FormattedMessage, useIntl} from 'react-intl';
-import {getI18nMessage} from './util/error_i18n';
-import {IndiInfo} from 'topola';
-import {Intro} from './intro';
-import {Loader, Message, Portal, Tab} from 'semantic-ui-react';
-import {Media} from './util/media';
-import {Navigate, Route, Routes} from 'react-router';
-import {TopBar} from './menu/top_bar';
-import {TopolaData} from './util/gedcom_util';
 import {useEffect, useState} from 'react';
-import {useNavigate, useLocation} from 'react-router';
-import {idToIndiMap} from './util/gedcom_util';
+import {FormattedMessage, useIntl} from 'react-intl';
+import {Navigate, Route, Routes, useLocation, useNavigate} from 'react-router';
+import {Loader, Message, Portal, Tab} from 'semantic-ui-react';
+import {IndiInfo} from 'topola';
+import {Changelog} from './changelog';
 import {
   Chart,
   ChartType,
@@ -34,12 +23,14 @@ import {
   Ids,
   Sex,
 } from './config';
+import {DataSourceEnum, SourceSelection} from './datasource/data_source';
+import {EmbeddedDataSource, EmbeddedSourceSpec} from './datasource/embedded';
 import {
+  GedcomUrlDataSource,
   getSelection,
+  UploadedDataSource,
   UploadSourceSpec,
   UrlSourceSpec,
-  GedcomUrlDataSource,
-  UploadedDataSource,
 } from './datasource/load_data';
 import {
   loadWikiTree,
@@ -47,7 +38,14 @@ import {
   WikiTreeDataSource,
   WikiTreeSourceSpec,
 } from './datasource/wikitree';
+import {Details} from './details/details';
 import {DonatsoChart} from './donatso-chart';
+import {Intro} from './intro';
+import {TopBar} from './menu/top_bar';
+import {analyticsEvent} from './util/analytics';
+import {getI18nMessage} from './util/error_i18n';
+import {idToIndiMap, TopolaData} from './util/gedcom_util';
+import {Media} from './util/media';
 
 /**
  * Load GEDCOM URL from VITE_STATIC_URL environment variable.

src/changelog.tsx

@@ -1,10 +1,10 @@
+import {useEffect, useState} from 'react';
+import {FormattedMessage} from 'react-intl';
 import rehypeStringify from 'rehype-stringify';
 import remarkParse from 'remark-parse';
 import remarkRehype from 'remark-rehype';
 import {Button, Header, Modal} from 'semantic-ui-react';
 import {unified} from 'unified';
-import {useEffect, useState} from 'react';
-import {FormattedMessage} from 'react-intl';
 
 const LAST_SEEN_VERSION_KEY = 'last_seen_version';
 

src/chart.tsx

@@ -1,11 +1,6 @@
-import {ChartColors, Ids, Sex} from './config';
-import {interpolateNumber} from 'd3-interpolate';
-import {IntlShape, useIntl} from 'react-intl';
 import {max, min} from 'd3-array';
-import {Media} from './util/media';
-import {saveAs} from 'file-saver';
+import {interpolateNumber} from 'd3-interpolate';
 import {select, Selection} from 'd3-selection';
-import {useEffect, useRef} from 'react';
 import 'd3-transition';
 import {
   D3ZoomEvent,
@@ -14,18 +9,23 @@ import {
   ZoomedElementBaseType,
   zoomTransform,
 } from 'd3-zoom';
+import {saveAs} from 'file-saver';
+import {useEffect, useRef} from 'react';
+import {IntlShape, useIntl} from 'react-intl';
 import {
-  JsonGedcomData,
   ChartHandle,
-  IndiInfo,
+  CircleRenderer,
   createChart,
   DetailedRenderer,
-  HourglassChart,
-  RelativesChart,
   FancyChart,
-  CircleRenderer,
+  HourglassChart,
+  IndiInfo,
+  JsonGedcomData,
+  RelativesChart,
   ChartColors as TopolaChartColors,
 } from 'topola';
+import {ChartColors, Ids, Sex} from './config';
+import {Media} from './util/media';
 import {usePrevious} from './util/previous-hook';
 
 /** How much to zoom when using the +/- buttons. */

src/config.tsx

@@ -1,6 +1,6 @@
-import {Item, Checkbox, Form, Header} from 'semantic-ui-react';
-import {FormattedMessage} from 'react-intl';
 import {ParsedQuery} from 'query-string';
+import {FormattedMessage} from 'react-intl';
+import {Checkbox, Form, Header, Item} from 'semantic-ui-react';
 
 export enum ChartColors {
   NO_COLOR,
@@ -99,7 +99,10 @@ export function ConfigPanel(props: {
                 value="none"
                 checked={props.config.color === ChartColors.NO_COLOR}
                 onClick={() =>
-                  props.onChange({...props.config, color: ChartColors.NO_COLOR})
+                  props.onChange({
+                    ...props.config,
+                    color: ChartColors.NO_COLOR,
+                  })
                 }
               />
             </Form.Field>

src/datasource/embedded.ts

@@ -1,6 +1,6 @@
 import {analyticsEvent} from '../util/analytics';
-import {DataSource, DataSourceEnum, SourceSelection} from './data_source';
 import {getSoftware, TopolaData} from '../util/gedcom_util';
+import {DataSource, DataSourceEnum, SourceSelection} from './data_source';
 import {loadGedcom} from './load_data';
 
 /**

src/datasource/load_data.spec.ts

@@ -1,7 +1,7 @@
-import {expect, describe, it} from '@jest/globals';
-import {loadFile} from './load_data';
-import {readFileSync} from 'fs';
+import {describe, expect, it} from '@jest/globals';
 import {Blob} from 'buffer';
+import {readFileSync} from 'fs';
+import {loadFile} from './load_data';
 
 describe('loadFile', () => {
   global.URL.createObjectURL = jest.fn();

src/datasource/load_data.ts

@@ -1,10 +1,10 @@
+import {Buffer} from 'buffer';
+import {strFromU8, unzip, Unzipped} from 'fflate';
+import {IndiInfo, JsonGedcomData} from 'topola';
 import {analyticsEvent} from '../util/analytics';
+import {TopolaError} from '../util/error';
 import {convertGedcom, getSoftware, TopolaData} from '../util/gedcom_util';
 import {DataSource, DataSourceEnum, SourceSelection} from './data_source';
-import {IndiInfo, JsonGedcomData} from 'topola';
-import {TopolaError} from '../util/error';
-import {strFromU8, unzip, Unzipped} from 'fflate';
-import {Buffer} from 'buffer';
 
 /**
  * Returns a valid IndiInfo object, either with the given indi and generation

src/datasource/wikitree.ts

@@ -1,5 +1,5 @@
-import {analyticsEvent} from '../util/analytics';
-import {DataSource, DataSourceEnum, SourceSelection} from './data_source';
+import {GedcomEntry} from 'parse-gedcom';
+import {IntlShape} from 'react-intl';
 import {
   Date,
   DateOrRange,
@@ -9,19 +9,19 @@ import {
   JsonImage,
   JsonIndi,
 } from 'topola';
-import {GedcomData, normalizeGedcom, TopolaData} from '../util/gedcom_util';
-import {GedcomEntry} from 'parse-gedcom';
-import {IntlShape} from 'react-intl';
-import {TopolaError} from '../util/error';
-import {isValidDateOrRange} from '../util/date_util';
 import {StringUtils} from 'turbocommons-ts';
 import {
-  getAncestors as getAncestorsApi,
-  getRelatives as getRelativesApi,
   clientLogin,
+  getAncestors as getAncestorsApi,
   getLoggedInUserName,
+  getRelatives as getRelativesApi,
   Person,
 } from 'wikitree-js';
+import {analyticsEvent} from '../util/analytics';
+import {isValidDateOrRange} from '../util/date_util';
+import {TopolaError} from '../util/error';
+import {GedcomData, normalizeGedcom, TopolaData} from '../util/gedcom_util';
+import {DataSource, DataSourceEnum, SourceSelection} from './data_source';
 
 const WIKITREE_APP_ID = 'topola-viewer';
 

src/details/details.tsx

@@ -1,4 +1,7 @@
 import flatMap from 'array.prototype.flatmap';
+import {GedcomEntry} from 'parse-gedcom';
+import {FormattedMessage} from 'react-intl';
+import {Header, Item} from 'semantic-ui-react';
 import {
   dereference,
   GedcomData,
@@ -7,11 +10,8 @@ import {
   getImageFileEntry,
 } from '../util/gedcom_util';
 import {Events} from './events';
-import {GedcomEntry} from 'parse-gedcom';
 import {MultilineText} from './multiline-text';
 import {TranslatedTag} from './translated-tag';
-import {Header, Item} from 'semantic-ui-react';
-import {FormattedMessage} from 'react-intl';
 import {WrappedImage} from './wrapped-image';
 
 const EXCLUDED_TAGS = [

src/details/event-extras.tsx

@@ -1,4 +1,7 @@
+import * as React from 'react';
+import {useState} from 'react';
 import {FormattedMessage, IntlShape, useIntl} from 'react-intl';
+import Linkify from 'react-linkify';
 import {
   Icon,
   Item,
@@ -8,13 +11,10 @@ import {
   Popup,
   Tab,
 } from 'semantic-ui-react';
-import {useState} from 'react';
-import {WrappedImage} from './wrapped-image';
-import * as React from 'react';
-import {MultilineText} from './multiline-text';
 import {DateOrRange} from 'topola';
 import {formatDateOrRange} from '../util/date_util';
-import Linkify from 'react-linkify';
+import {MultilineText} from './multiline-text';
+import {WrappedImage} from './wrapped-image';
 
 export interface Image {
   url: string;

src/details/events.tsx

@@ -1,23 +1,23 @@
-import queryString from 'query-string';
 import flatMap from 'array.prototype.flatmap';
+import {GedcomEntry} from 'parse-gedcom';
+import queryString from 'query-string';
+import {FormattedMessage, IntlShape, useIntl} from 'react-intl';
+import {Link, useLocation} from 'react-router';
+import {Header, Item} from 'semantic-ui-react';
+import {DateOrRange, getDate} from 'topola';
 import {calcAge} from '../util/age_util';
 import {compareDates, formatDateOrRange} from '../util/date_util';
-import {DateOrRange, getDate} from 'topola';
 import {
   dereference,
   GedcomData,
   getData,
-  getImageFileEntry,
   getFileName,
+  getImageFileEntry,
   getName,
+  pointerToId,
 } from '../util/gedcom_util';
-import {GedcomEntry} from 'parse-gedcom';
-import {FormattedMessage, IntlShape, useIntl} from 'react-intl';
-import {Link, useLocation} from 'react-router';
-import {pointerToId} from '../util/gedcom_util';
-import {TranslatedTag} from './translated-tag';
-import {Header, Item} from 'semantic-ui-react';
 import {EventExtras, Image, Source} from './event-extras';
+import {TranslatedTag} from './translated-tag';
 
 function PersonLink(props: {person: GedcomEntry}) {
   const location = useLocation();

src/details/wrapped-image.tsx

@@ -1,3 +1,5 @@
+import {SyntheticEvent, useState} from 'react';
+import {FormattedMessage} from 'react-intl';
 import {
   Container,
   Icon,
@@ -7,8 +9,6 @@ import {
   Modal,
   Placeholder,
 } from 'semantic-ui-react';
-import {SyntheticEvent, useState} from 'react';
-import {FormattedMessage} from 'react-intl';
 
 interface Props {
   url: string;

src/donatso-chart.tsx

@@ -2,7 +2,6 @@ import f3 from 'family-chart';
 import {useEffect, useRef} from 'react';
 import {IntlShape, useIntl} from 'react-intl';
 import {IndiInfo, JsonFam, JsonGedcomData} from 'topola';
-
 import {formatDateOrRange} from './util/date_util';
 import {usePrevious} from './util/previous-hook';
 

src/index.tsx

@@ -1,19 +1,18 @@
-import * as React from 'react';
+import 'canvas-toBlob';
+import {detect} from 'detect-browser';
 import {createRoot} from 'react-dom/client';
+import {IntlProvider} from 'react-intl';
+import {HashRouter as Router} from 'react-router';
+import 'semantic-ui-css/semantic.min.css';
+import {App} from './app';
+import './index.css';
 import messages_cs from './translations/cs.json';
 import messages_de from './translations/de.json';
 import messages_fr from './translations/fr.json';
 import messages_it from './translations/it.json';
 import messages_pl from './translations/pl.json';
 import messages_ru from './translations/ru.json';
-import {App} from './app';
-import {detect} from 'detect-browser';
-import {HashRouter as Router, Route} from 'react-router';
-import {IntlProvider} from 'react-intl';
 import {MediaContextProvider, mediaStyles} from './util/media';
-import './index.css';
-import 'semantic-ui-css/semantic.min.css';
-import 'canvas-toBlob';
 
 const messages: {[language: string]: {[message_id: string]: string}} = {
   cs: messages_cs,

src/intro.tsx

@@ -1,11 +1,11 @@
 import queryString from 'query-string';
 import {useEffect, useState} from 'react';
-import logo from './topola.jpg';
-import {Card, Grid, Image} from 'semantic-ui-react';
 import {FormattedMessage} from 'react-intl';
 import {Link} from 'react-router';
-import {Media} from './util/media';
+import {Card, Grid, Image} from 'semantic-ui-react';
 import {getChangelog, updateSeenVersion} from './changelog';
+import logo from './topola.jpg';
+import {Media} from './util/media';
 
 /** Link that loads a view. */
 function ViewLink(props: {params: {[key: string]: string}; text: string}) {

src/menu/menu_item.tsx

@@ -1,8 +1,8 @@
 import {
-  Menu,
   Dropdown,
-  MenuItemProps,
   DropdownItemProps,
+  Menu,
+  MenuItemProps,
 } from 'semantic-ui-react';
 
 export enum MenuType {

src/menu/search.tsx

@@ -1,12 +1,11 @@
 import debounce from 'debounce';
-import {analyticsEvent} from '../util/analytics';
-import {buildSearchIndex, SearchIndex, SearchResult} from './search_index';
-import {formatDateOrRange} from '../util/date_util';
-import {IndiInfo, JsonGedcomData} from 'topola';
-import {JsonIndi} from 'topola';
-import {Search, SearchResultProps} from 'semantic-ui-react';
 import {useEffect, useRef, useState} from 'react';
 import {useIntl} from 'react-intl';
+import {Search, SearchResultProps} from 'semantic-ui-react';
+import {IndiInfo, JsonGedcomData, JsonIndi} from 'topola';
+import {analyticsEvent} from '../util/analytics';
+import {formatDateOrRange} from '../util/date_util';
+import {buildSearchIndex, SearchIndex, SearchResult} from './search_index';
 
 function getNameLine(result: SearchResult) {
   const name = [result.indi.firstName, result.indi.lastName].join(' ').trim();

src/menu/search_index.ts

@@ -1,13 +1,12 @@
-import lunr, {PipelineFunction} from 'lunr';
 import naturalSort from 'javascript-natural-sort';
-import {idToFamMap, idToIndiMap} from '../util/gedcom_util';
-import {JsonFam, JsonGedcomData, JsonIndi} from 'topola';
-
-import lunrStemmer from 'lunr-languages/lunr.stemmer.support';
+import lunr, {PipelineFunction} from 'lunr';
 import lunrDe from 'lunr-languages/lunr.de';
 import lunrFr from 'lunr-languages/lunr.fr';
 import lunrIt from 'lunr-languages/lunr.it';
 import lunrRu from 'lunr-languages/lunr.ru';
+import lunrStemmer from 'lunr-languages/lunr.stemmer.support';
+import {JsonFam, JsonGedcomData, JsonIndi} from 'topola';
+import {idToFamMap, idToIndiMap} from '../util/gedcom_util';
 
 lunrStemmer(lunr);
 lunrDe(lunr);
@@ -151,7 +150,10 @@ class LunrSearchIndex implements SearchIndex {
     return results
       .sort(compare)
       .slice(0, MAX_RESULTS)
-      .map((result) => ({id: result.ref, indi: this.indiMap.get(result.ref)!}));
+      .map((result) => ({
+        id: result.ref,
+        indi: this.indiMap.get(result.ref)!,
+      }));
   }
 }
 

src/menu/top_bar.tsx

@@ -1,14 +1,13 @@
 import queryString from 'query-string';
-import {Dropdown, Icon, Menu} from 'semantic-ui-react';
 import {FormattedMessage} from 'react-intl';
+import {Link, useLocation, useNavigate} from 'react-router';
+import {Dropdown, Icon, Menu} from 'semantic-ui-react';
 import {IndiInfo, JsonGedcomData} from 'topola';
-import {Link} from 'react-router';
 import {Media} from '../util/media';
 import {MenuType} from './menu_item';
 import {SearchBar} from './search';
 import {UploadMenu} from './upload_menu';
 import {UrlMenu} from './url_menu';
-import {useNavigate, useLocation} from 'react-router';
 import {WikiTreeLoginMenu, WikiTreeMenu} from './wikitree_menu';
 
 enum ScreenSize {

src/menu/upload_menu.tsx

@@ -1,12 +1,12 @@
-import queryString from 'query-string';
 import md5 from 'md5';
-import {analyticsEvent} from '../util/analytics';
-import {Dropdown, Icon, Menu} from 'semantic-ui-react';
-import {FormattedMessage} from 'react-intl';
-import {MenuType} from './menu_item';
+import queryString from 'query-string';
 import {SyntheticEvent} from 'react';
-import {useNavigate, useLocation} from 'react-router';
+import {FormattedMessage} from 'react-intl';
+import {useLocation, useNavigate} from 'react-router';
+import {Dropdown, Icon, Menu} from 'semantic-ui-react';
 import {loadFile} from '../datasource/load_data';
+import {analyticsEvent} from '../util/analytics';
+import {MenuType} from './menu_item';
 
 function isImageFileName(fileName: string) {
   const lower = fileName.toLowerCase();

src/menu/url_menu.tsx

@@ -1,10 +1,10 @@
 import queryString from 'query-string';
-import {analyticsEvent} from '../util/analytics';
-import {Button, Form, Header, Icon, Input, Modal} from 'semantic-ui-react';
-import {FormattedMessage} from 'react-intl';
-import {MenuItem, MenuType} from './menu_item';
 import {useEffect, useRef, useState} from 'react';
+import {FormattedMessage} from 'react-intl';
 import {useNavigate} from 'react-router';
+import {Button, Form, Header, Icon, Input, Modal} from 'semantic-ui-react';
+import {analyticsEvent} from '../util/analytics';
+import {MenuItem, MenuType} from './menu_item';
 
 interface Props {
   menuType: MenuType;

src/menu/wikitree_menu.tsx

@@ -1,12 +1,12 @@
 import queryString from 'query-string';
-import wikitreeLogo from './wikitree.png';
-import {analyticsEvent} from '../util/analytics';
-import {Button, Form, Header, Input, Modal} from 'semantic-ui-react';
-import {FormattedMessage, useIntl} from 'react-intl';
-import {MenuItem, MenuType} from './menu_item';
 import {useEffect, useRef, useState} from 'react';
-import {useNavigate, useLocation} from 'react-router';
+import {FormattedMessage, useIntl} from 'react-intl';
+import {useLocation, useNavigate} from 'react-router';
+import {Button, Form, Header, Input, Modal} from 'semantic-ui-react';
 import {getLoggedInUserName, navigateToLoginPage} from 'wikitree-js';
+import {analyticsEvent} from '../util/analytics';
+import {MenuItem, MenuType} from './menu_item';
+import wikitreeLogo from './wikitree.png';
 
 interface Props {
   menuType: MenuType;

src/util/age_util.spec.ts

@@ -1,4 +1,4 @@
-import {expect, describe, it} from '@jest/globals';
+import {describe, expect, it} from '@jest/globals';
 import {createIntl} from 'react-intl';
 import {calcAge} from './age_util';
 

src/util/age_util.ts

@@ -1,6 +1,6 @@
-import {Date as TopolaDate} from 'topola/dist/data';
 import {IntlShape} from 'react-intl';
 import {DateOrRange, getDate} from 'topola';
+import {Date as TopolaDate} from 'topola/dist/data';
 import {
   areDateRangesOverlapped,
   compareDates,

src/util/date_util.ts

@@ -1,5 +1,5 @@
-import {Date as TopolaDate, DateOrRange, DateRange, getDate} from 'topola';
 import {IntlShape} from 'react-intl';
+import {DateOrRange, DateRange, getDate, Date as TopolaDate} from 'topola';
 
 const DATE_QUALIFIERS = new Map([
   ['abt', 'about'],

src/util/gedcom_util.spec.ts

@@ -1,4 +1,4 @@
-import {expect, describe, it} from '@jest/globals';
+import {describe, expect, it} from '@jest/globals';
 import {getName, normalizeGedcom} from './gedcom_util';
 
 describe('normalizeGedcom()', () => {

src/util/gedcom_util.ts

@@ -1,5 +1,4 @@
 import {GedcomEntry, parse as parseGedcom} from 'parse-gedcom';
-import {TopolaError} from './error';
 import {
   gedcomEntriesToJson,
   JsonFam,
@@ -8,6 +7,7 @@ import {
   JsonIndi,
 } from 'topola';
 import {compareDates} from './date_util';
+import {TopolaError} from './error';
 
 export interface GedcomData {
   /** The HEAD entry. */