using functions as mapper instead of imperatively creating a structure you need

queryParamsToCSSProps.js

/**
need to convert styles in query params to css props object
// e.g. if URL is like
http://localhost:8080/?header-color=0c1119
&header-background-color=fff
&body-color=000
&body-background-color=e5822d
&button-color=909694
&button-background-color=f442dc
&button-hover-color=2de5a8
&button-hover-background-color=fff

// the cssProps injected will be like below
const cssProps = {
  header: {
    color: '#0c1119',
    backgroundColor: '#fff'
  },
  body: {
    color: '#000',
    backgroundColor: '#e5822d'
  },
  submitButton: {
    color: '#909694',
    backgroundColor: '#f442dc',
    backgroundImage: 'none'
  },
  submitButtonHover: {
    color: '#2de5a8',
    backgroundColor: '#fff',
    backgroundImage: 'none'
  }
};
*/

import toPairs from 'lodash/toPairs';
import camelCase from 'lodash/camelCase';

//original function written 
function getCSSPropsFromQueryParams(queryParamsObject) {
  const validCssKeys = [
    'body-color',
    'body-background-color',
    'header-color',
    'header-background-color',
    'button-color',
    'button-background-color',
    'button-hover-color',
    'button-hover-background-color'
  ];

  return toPairs(queryParamsObject).reduce(
    (acc, [key, value]) => {
      if (validCssKeys.includes(key)) {
        // add "#" to the color values
        const cssValue = `#${queryParamsObject[key]}`;

        switch (true) {
          case key.toLocaleLowerCase().includes('header'):
            // remove "header-" from the key
            acc.header[camelCase(key.substring(7))] = cssValue;
            break;
          case key.toLocaleLowerCase().includes('body'):
            // remove "body-" from the key
            acc.body[camelCase(key.substring(5))] = cssValue;
            break;
          case key.toLocaleLowerCase().includes('button-hover'):
            // remove "button-hover-"
            acc.submitButtonHover[camelCase(key.substring(13))] = cssValue;
            // submit button has a background image which prevents effect of background color
            if (key === 'button-hover-background-color') {
              acc.submitButtonHover.backgroundImage = 'none';
            }
            break;
          default:
            // remove "button-" from the key
            acc.submitButton[camelCase(key.substring(7))] = cssValue;
            // submit button has a background image which prevents effect of background color
            if (key === 'button-background-color') {
              acc.submitButton.backgroundImage = 'none';
            }
        }
      }
      return acc;
    },
    { header: {}, body: {}, submitButton: {}, submitButtonHover: {} }
  );
}

//refactored function
function getCSSPropsFromQueryParams(queryParamsObject) {
  return {
    header: {
      ...extractUrlParamToObj('header-color', queryParamsObject, value => ({
        color: `#${value}`
      })),
      ...extractUrlParamToObj(
        'header-background-color',
        queryParamsObject,
        value => ({ backgroundColor: `#${value}` })
      )
    },
    body: {
      ...extractUrlParamToObj('body-color', queryParamsObject, value => ({
        color: `#${value}`
      })),
      ...extractUrlParamToObj(
        'body-background-color',
        queryParamsObject,
        value => ({ backgroundColor: `#${value}` })
      )
    },
    submitButton: {
      ...extractUrlParamToObj('button-color', queryParamsObject, value => ({
        color: `#${value}`
      })),
      ...extractUrlParamToObj(
        'button-background-color',
        queryParamsObject,
        value => ({ backgroundColor: `#${value}`, backgroundImage: 'none' })
      )
    },
    submitButtonHover: {
      ...extractUrlParamToObj(
        'button-hover-color',
        queryParamsObject,
        value => ({ color: `#${value}` })
      ),
      ...extractUrlParamToObj(
        'button-hover-background-color',
        queryParamsObject,
        value => ({ backgroundColor: `#${value}`, backgroundImage: 'none' })
      )
    }
  };
}

/**
 * check if the value for the given key in the queryParamsObject
 * and call the static mapper passed
 * @param {string} queryParam
 * @param {object} queryParamsObject
 * @param {Function} staticMapper
 * @returns {object}
 */
function extractUrlParamToObj(queryParam, queryParamsObject, staticMapper) {
  if (queryParamsObject[queryParam])
    return staticMapper(queryParamsObject[queryParam]);
}