Modifying various nested data structures within the example object below and on Ramda.js. As always, feel free to make it better! πŸ›πŸžπŸœ.

const store = {
  open: false,
  name: 'Cat Store',
  cats: {
    number: 3,
    names: {
      language: 'πŸ‡©πŸ‡ͺ',
      fat: 'Moe',
      small: 'Kittioto',
      fast: 'Fishsticks',
    },
  },
  catToys: {
    'faux-fur-mouse': {
      price: 1,
      images: [{
        title: 'Mouse',
        icons: [{ name: 'mouse', icon: '🐭' }],
      }],
    },
  },
};

// Add Key / Update Key / Modify Key
assoc('open', true, store);
  ➜  {
    open: true,
    name: 'Cat Store',
    cats: {
      number: 3,
      names: {
        language: 'πŸ‡©πŸ‡ͺ',
        fat: "Moe",
        small: "Kittioto",
        fast: "Fishsticks",
      },
    },
    catToys: {
      'faux-fur-mouse': {
        price: 1,
        images: [{
          title: 'Mouse',
          icons: [{ name: 'mouse', icon: '🐭' }],
        }],
      },
    },
  }

// Add Nested Key / Update Nested Key / Modify Nested Key
assocPath(['cats', 'names', 'language'], 'πŸ‡ΊπŸ‡Έ', store);
  ➜  {
    open: false,
    name: 'Cat Store',
    cats: {
      number: 3,
      names: {
        language: 'πŸ‡ΊπŸ‡Έ',
        fat: "Moe",
        small: "Kittioto",
        fast: "Fishsticks",
      },
    },
    catToys: {
      'faux-fur-mouse': {
        price: 1,
        images: [{
          title: 'Mouse',
          icons: [{ name: 'mouse', icon: '🐭' }],
        }],
      },
    },
  }

// Remove Key / Delete Key
dissoc('open', store);
  ➜  {
    name: 'Cat Store',
    cats: {
      number: 3,
      names: {
        language: 'πŸ‡©πŸ‡ͺ',
        fat: "Moe",
        small: "Kittioto",
        fast: "Fishsticks",
      },
    },
    catToys: {
      'faux-fur-mouse': {
        price: 1,
        images: [{
          title: 'Mouse',
          icons: [{ name: 'mouse', icon: '🐭' }],
        }],
      },
    },
  }

// Remove Nested Key / Delete Nested Key
dissocPath(['cats', 'names', 'language'], store);
  ➜  {
    open: false,
    name: 'Cat Store',
    cats: {
      number: 3,
      names: {
        fat: "Moe",
        small: "Kittioto",
        fast: "Fishsticks",
      },
    },
    catToys: {
      'faux-fur-mouse': {
        price: 1,
        images: [{
          title: 'Mouse',
          icons: [{ name: 'mouse', icon: '🐭' }],
        }],
      },
    },
  }

// Update Deeply Nested Object in an Array / List
const imagesLens = lensPath(['catToys', 'faux-fur-mouse', 'images']);
const images = view(imagesLens, store);
  ➜  [{
    title: 'Mouse',
    icons: [{ name: 'mouse', icon: '🐭' }],
  }]

const imageIndex = findIndex(propEq('title', 'Mouse'))(images);
   ➜  0

const image = find(propEq('title', 'Mouse'))(images);
  ➜  {
    title: 'Mouse',
    icons: [{ name: 'mouse', icon: '🐭' }],
  }

const icons = [{ name: 'hamster', icon: '🐹' }];

// Replace
const newImage = assoc('icons', icons, image);
  ➜  {
    title: 'Mouse',
    icons: [{ name: 'hamster', icon: '🐹' }],
  }

// Merge
const newImage = assoc('icons', uniq(concat(icons, image.icons)), image);
  ➜  {
    title: 'Mouse',
    icons: [
      { name: 'hamster', icon: '🐹' }
      { name: 'mouse', icon: '🐭' }
    ],
  }

const newImages = update(imageIndex, newImage, images);
  ➜  [{
        title: 'Mouse',
        icons: [{ name: 'hamster', icon: '🐹' }],
      }]

set(imagesLens, newImages, store);
  ➜  {
    open: false,
    name: 'Cat Store',
    cats: {
      number: 3,
      names: {
        language: 'πŸ‡©πŸ‡ͺ',
        fat: "Moe",
        small: "Kittioto",
        fast: "Fishsticks",
      },
    },
    catToys: {
      'faux-fur-mouse': {
        price: 1,
        images: [{
          title: 'Mouse',
          icons: [{ name: 'hamster', icon: '🐹' }],
        }],
      },
    },
  }