Project: EAP feedback

.changeset/brave-otters-count.md

@@ -0,0 +1,10 @@
+---
+"@ifrc-go/ui": minor
+"go-ui-storybook": patch
+---
+
+Add word limits to TextArea and a new ConfirmModal
+
+- Set `maxWords` on TextArea to limit how many words can be entered
+- Show the current word count
+- Add ConfirmModal, a confirmation dialog that can be shown without a button

.changeset/plenty-hoops-hammer.md

@@ -0,0 +1,14 @@
+---
+"go-web-app": minor
+---
+
+Update EAP forms and exports
+
+- Add summary, map, strategy and budget sections to the EAP summary export
+- Add an activation checklist to prepositioning and early action activities
+- Add a disaster sub-type to EAP registration
+- Add word limits to long text fields
+- Attach files with captions in form sections
+- Ask for confirmation before discarding planned operation data
+- Update contact sections, labels and descriptions
+- Fix validation errors in the forms

app/src/components/domain/Admin2Input/index.tsx

@@ -49,6 +49,10 @@ import {
     MAX_PAGE_LIMIT,
 } from '#utils/constants';
 import { getGeoJsonBounds } from '#utils/geo';
+import {
+    getAdmin2CentroidTileset,
+    getAdmin2Tileset,
+} from '#utils/map';
 import {
     useLazyRequest,
     useRequest,
@@ -190,7 +194,7 @@ function Admin2Input<const NAME>(props: Props<NAME>) {
 
         return {
             type: 'line',
-            'source-layer': `go-admin2-${iso3}-staging`,
+            'source-layer': getAdmin2Tileset(iso3).sourceLayer,
             paint: {
                 'line-color': COLOR_BLACK,
                 'line-opacity': 1,
@@ -213,7 +217,7 @@ function Admin2Input<const NAME>(props: Props<NAME>) {
         ];
         const options: Omit<FillLayer, 'id'> = {
             type: 'fill',
-            'source-layer': `go-admin2-${iso3}-staging`,
+            'source-layer': getAdmin2Tileset(iso3).sourceLayer,
             paint: {
                 'fill-color': (!value || value.length <= 0)
                     ? defaultColor
@@ -237,6 +241,10 @@ function Admin2Input<const NAME>(props: Props<NAME>) {
     }, [iso3, value, admin2CodeMap]);
 
     const adminTwoLabelLayerOptions = useMemo((): Omit<SymbolLayer, 'id'> | undefined => {
+        if (!iso3) {
+            return undefined;
+        }
+
         const textColor: NonNullable<SymbolLayer['paint']>['text-color'] = (
             value && value.length > 0
                 ? [
@@ -253,7 +261,7 @@ function Admin2Input<const NAME>(props: Props<NAME>) {
 
         const options: Omit<SymbolLayer, 'id'> = {
             type: 'symbol',
-            'source-layer': `go-admin2-${iso3}-centroids`,
+            'source-layer': getAdmin2CentroidTileset(iso3).sourceLayer,
             paint: {
                 'text-color': textColor,
                 'text-opacity': 1,
@@ -314,11 +322,10 @@ function Admin2Input<const NAME>(props: Props<NAME>) {
             <Container
                 heading={strings.heading}
                 headingLevel={6}
-                footer={(
+                footer={hasAdmin2 && !readOnly && (
                     <Button
                         name={undefined}
                         onClick={setShowModalTrue}
-                        disabled={readOnly || !hasAdmin2}
                     >
                         {strings.buttonLabel}
                     </Button>
@@ -398,14 +405,13 @@ function Admin2Input<const NAME>(props: Props<NAME>) {
                             />
                         )}
                         {/* eslint-disable-next-line max-len */}
-                        {adminTwoFillLayerOptions && adminTwoLineLayerOptions && adminTwoLabelLayerOptions && (
+                        {iso3 && adminTwoFillLayerOptions && adminTwoLineLayerOptions && adminTwoLabelLayerOptions && (
                             <>
                                 <MapSource
                                     sourceKey="country-admin-2"
                                     sourceOptions={{
                                         type: 'vector',
-                                        // FIXME: this should be defined as a constant
-                                        url: `mapbox://go-ifrc.go-admin2-${iso3}-staging`,
+                                        url: getAdmin2Tileset(iso3).url,
                                     }}
                                 >
                                     <MapLayer
@@ -423,7 +429,7 @@ function Admin2Input<const NAME>(props: Props<NAME>) {
                                     sourceKey="country-admin-2-labels"
                                     sourceOptions={{
                                         type: 'vector',
-                                        url: `mapbox://go-ifrc.go-admin2-${iso3}-centroids`,
+                                        url: getAdmin2CentroidTileset(iso3).url,
                                     }}
                                 >
                                     <MapLayer