Merge branch 'main' into 1135-Refactor-Layout-Components-Footer

.env

@@ -14,5 +14,5 @@ GOOGLE_FORM = 'https://docs.google.com/forms/d/e/1FAIpQLSfGcd3FDsM3kQIOVKjzdPn4f
 
 SHOW_CONFIGURABLE_COLOR_MAP = 'TRUE'
 
-# Enables the refactor page footer component that uses the USWDS design system
-ENABLE_USWDS_PAGE_FOOTER = 'TRUE'
+ENABLE_USWDS_PAGE_HEADER = 'TRUE'
+ENABLE_USWDS_PAGE_FOOTER = 'TRUE'

.github/workflows/conventional-commit.yml

@@ -0,0 +1,15 @@
+name: PR Title Checks
+
+on:
+  pull_request:
+    types: [opened, synchronize, reopened, edited]
+
+jobs:
+  validate-pr-title:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Conventional Commit Validation
+        uses:  ytanikin/[email protected]
+        with:
+          task_types: '["feat","fix", "docs", "test", "ci", "refactor", "chore", "revert"]'
+          add_label: 'false'

.github/workflows/release.yml

@@ -0,0 +1,32 @@
+name: Release Every Other Monday
+on:
+  workflow_dispatch:
+  # Run action at 16:15 PM on Monday (UTC)
+  # schedule:
+  # @TODO: the schedule below is weekly. Do byweekly check.
+  #   - cron: '15 16 * * 1'
+
+# Sets the GITHUB_TOKEN permissions to allow release
+permissions:
+  contents: write
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+          ssh-key: ${{ secrets.DEPLOY_KEY }}
+      - name: git config
+        run: |
+          git config user.name "${GITHUB_ACTOR}"
+          git config user.email "${GITHUB_ACTOR}@users.noreply.github.com"
+      - name: Use Node.js ${{ env.NODE }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ env.NODE }}
+      - run: yarn
+      - run: yarn release  --ci --verbose
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.release-it.json

@@ -0,0 +1,29 @@
+{
+  "hooks": {},
+  "plugins": {
+    "@release-it/conventional-changelog": {
+      "preset": {
+        "name": "conventionalcommits"
+      }
+    }
+  },
+  "git": {
+    "changelog": "git log --pretty=format:\"* %s (%h)\" ${from}...${to}",
+    "commitMessage": "chore(release): update to version v${version}",
+    "tagName": "v${version}",
+    "tagAnnotation": "Release v${version}",
+    "pushArgs": ["--follow-tags"],
+    "getLatestTagFromAllRefs": true
+  },
+  "npm": {
+    "publish": false
+  },
+  "github": {
+    "release": true,
+    "releaseName": "V${version}",
+    "releaseNotes": null,
+    "autoGenerate": true,
+    "preRelease": false,
+    "draft": false
+  }
+}

.stylelintrc.json

@@ -1,11 +1,8 @@
 {
-  "processors": [
-    "stylelint-processor-styled-components"
-  ],
   "extends": [
-    "stylelint-config-recommended",
-    "stylelint-config-styled-components"
+    "stylelint-config-recommended"
   ],
+  "customSyntax": "postcss-styled-syntax",
   "rules": {
     "font-family-no-missing-generic-family-keyword": null,
     "no-descending-specificity": [

.vscode/settings.json.sample

@@ -9,6 +9,9 @@
         "javascriptreact",
         "typescript",
         "typescriptreact"
-    ]
+    ],
+  "[scss]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  }
 }
 

app/scripts/components/common/google-form.tsx

@@ -1,61 +1,16 @@
 import React from 'react';
 import styled from 'styled-components';
-import { Button } from '@devseed-ui/button';
 import { Modal } from '@devseed-ui/modal';
-import { media, themeVal } from '@devseed-ui/theme-provider';
-
-import { useFeedbackModal } from './layout-root';
-
-import GlobalMenuLinkCSS from '$styles/menu-link';
 
 const StyledGoogleForm = styled.iframe`
   width: 100%;
 `;
 
-interface BtnMediaProps {
-  active?: boolean;
-}
-
-// Global menu link style
-const ButtonAsNavLink = styled(Button)`
-  ${media.mediumUp<BtnMediaProps>`
-    background-color: ${themeVal('color.primary-700')};
-
-    &:hover {
-      background-color: ${themeVal('color.primary-800')};
-    }
-
-    /* Print & when prop is passed */
-    ${({ active }) => active && '&,'}
-    &:active,
-    &.active {
-      background-color: ${themeVal('color.primary-900')};
-    }
-
-    &:focus-visible {
-      background-color: ${themeVal('color.primary-200a')};
-    }
-  `}
-
-  ${media.mediumDown`
-    ${GlobalMenuLinkCSS}
-  `}
-`;
-
-const GoogleForm: React.FC<{ title: string, src: string }> = (props) => {
-  const { title, src } = props;
-  const { isRevealed, show, hide } = useFeedbackModal();
+const GoogleForm: React.FC<{ src: string, isRevealed: boolean, hide: () => void }> = (props) => {
+  const { src, isRevealed, hide } = props;
 
   return (
     <>
-      <ButtonAsNavLink
-        type='button'
-        size='large'
-        onClick={show}
-        style={{ color: 'white' }}
-      >
-        {title}
-      </ButtonAsNavLink>
       <Modal
         id='modal'
         size='large'

app/scripts/components/common/layout-root/index.tsx

@@ -24,7 +24,7 @@ import { LayoutRootContext } from './context';
 import { setGoogleTagManager } from '$utils/use-google-tag-manager';
 
 import NavWrapper from '$components/common/nav-wrapper';
-import Logo from '$components/common/page-header/logo';
+import Logo from '$components/common/page-header-legacy/logo';
 import {
   mainNavItems,
   subNavItems

app/scripts/components/common/map/style-generators/raster-paint-layer.tsx

@@ -13,6 +13,7 @@ interface RasterPaintLayerProps extends BaseGeneratorParams {
   colorMap?: string | undefined;
   tileParams: Record<string, any>;
   generatorPrefix?: string;
+  reScale?: { min: number; max: number };
 }
 
 export function RasterPaintLayer(props: RasterPaintLayerProps) {
@@ -24,16 +25,20 @@ export function RasterPaintLayer(props: RasterPaintLayerProps) {
     hidden,
     opacity,
     colorMap,
-    generatorPrefix = 'raster',
+    reScale,
+    generatorPrefix = 'raster'
   } = props;
-
   const { updateStyle } = useMapStyle();
   const [minZoom] = zoomExtent ?? [0, 20];
   const generatorId = `${generatorPrefix}-${id}`;
 
   const updatedTileParams = useMemo(() => {
-    return { ...tileParams, ...colorMap &&  {colormap_name: colorMap}};
-  }, [tileParams, colorMap]);
+    return {
+      ...tileParams,
+      ...(colorMap && { colormap_name: colorMap }),
+      ...(reScale && { reScale: Object.values(reScale) })
+    };
+  }, [tileParams, colorMap, reScale]);
 
   //
   // Generate Mapbox GL layers and sources for raster timeseries
@@ -47,7 +52,9 @@ export function RasterPaintLayer(props: RasterPaintLayerProps) {
 
   useEffect(
     () => {
-      const tileParamsAsString = qs.stringify(updatedTileParams, { arrayFormat: 'comma' });
+      const tileParamsAsString = qs.stringify(updatedTileParams, {
+        arrayFormat: 'comma'
+      });
 
       const zarrSource: RasterSource = {
         type: 'raster',
@@ -63,8 +70,8 @@ export function RasterPaintLayer(props: RasterPaintLayerProps) {
         paint: {
           'raster-opacity': hidden ? 0 : rasterOpacity,
           'raster-opacity-transition': {
-            duration: 320,
-          },
+            duration: 320
+          }
         },
         minzoom: minZoom,
         metadata: {
@@ -93,7 +100,8 @@ export function RasterPaintLayer(props: RasterPaintLayerProps) {
       tileApiEndpoint,
       haveTileParamsChanged,
       generatorParams,
-      colorMap
+      colorMap,
+      reScale
       // generatorParams includes hidden and opacity
       // hidden,
       // opacity,

app/scripts/components/common/map/style-generators/raster-timeseries.tsx

@@ -63,6 +63,7 @@ export function RasterTimeseries(props: RasterTimeseriesProps) {
     stacApiEndpoint,
     tileApiEndpoint,
     colorMap,
+    reScale,
     envApiStacEndpoint,
     envApiRasterEndpoint
   } = props;
@@ -367,7 +368,8 @@ export function RasterTimeseries(props: RasterTimeseriesProps) {
           {
             assets: 'cog_default',
             ...(sourceParams ?? {}),
-            ...(colorMap && { colormap_name: colorMap })
+            ...(colorMap && { colormap_name: colorMap }),
+            ...(reScale && { rescale: Object.values(reScale) })
           },
           // Temporary solution to pass different tile parameters for hls data
           {
@@ -495,6 +497,7 @@ export function RasterTimeseries(props: RasterTimeseriesProps) {
   }, [
     mosaicUrl,
     colorMap,
+    reScale,
     points,
     minZoom,
     haveSourceParamsChanged,

app/scripts/components/common/map/types.d.ts

@@ -54,6 +54,7 @@ export interface BaseTimeseriesProps extends BaseGeneratorParams {
   zoomExtent?: number[];
   onStatusChange?: (result: { status: ActionStatus; id: string }) => void;
   colorMap?: string;
+  reScale?: { min: number; max: number };
   envApiStacEndpoint: string;
   envApiRasterEndpoint: string;
 }