A lot of filter code has been written for editImageSlice, but it hasn't been implemented in the UI.

[wvsr]

Idea: There can be a carousel displaying the preview of the edited image, and clicking on the preview will change it on the canvas

addFilterInvert: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Invert()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.invert,
      selectedImageFilters,
      'isInverted'
    )
    set(updatedState)
  },
  addFilterSepia: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Sepia()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.sepia,
      selectedImageFilters,
      'isSepia'
    )
    set(updatedState)
  },
  addFilterSepia2: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Sepia2()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.sepia2,
      selectedImageFilters,
      'isSepia2'
    )
    set(updatedState)
  },
  addFilterBlackAndWhite: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.BlackWhite()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.blackwhite,
      selectedImageFilters,
      'isBlackAndWhite'
    )
    set(updatedState)
  },
  addFilterBrownie: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Brownie()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.brownie,
      selectedImageFilters,
      'isBrownie'
    )
    set(updatedState)
  },
  addFilterVintage: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Vintage()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.vintage,
      selectedImageFilters,
      'isVintage'
    )
    set(updatedState)
  },
  addFilterKodachrome: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Kodachrome()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.kodachrome,
      selectedImageFilters,
      'isKodachrome'
    )
    set(updatedState)
  },
  addFilterTechnicolor: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Technicolor()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.technicolor,
      selectedImageFilters,
      'isTechnicolor'
    )
    set(updatedState)
  },
  addFilterPolaroid: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Polaroid()
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.polaroid,
      selectedImageFilters,
      'isPolaroid'
    )
    set(updatedState)
  },
  addFilterSharpen: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Convolute({
      matrix: [0, -1, 0, -1, 5, -1, 0, -1, 0],
    })
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.sharpen,
      selectedImageFilters,
      'isSharpen'
    )
    set(updatedState)
  },
  addFilterEmboss: () => {
    const activeCanvas = get().canvases[get().activeCanvas].canvas
    const selectedImageFilters = get().selectedImageFilters
    const filterClass = new fabric.Image.filters.Convolute({
      matrix: [1, 1, 1, 1, 0.7, -1, -1, -1, -1],
    })
    const updatedState = addStaticFilter(
      activeCanvas,
      filterClass,
      FabricImageFilters.emboss,
      selectedImageFilters,
      'isEmboss'
    )
    set(updatedState)
  },