Phoenix configuration similar to Magnet app https://github.com/kasper/phoenix (WIP, missing some keybinds implementation)

.phoenix.js

// Preferences
Phoenix.set({
  daemon: true,
  openAtLogin: true,
});

const COMMAND = 'command'
const CONTROL = 'control'
const OPTION  = 'option'
const SHIFT   = 'shift'
const RETURN  = 'return'

const LEFT    = 'left'
const RIGHT   = 'right'
const UP      = 'up'
const DOWN    = 'down'

const Magnet = {
  LEFT:  [LEFT,  [CONTROL, OPTION]],
  RIGHT: [RIGHT, [CONTROL, OPTION]],
  UP:    [UP,    [CONTROL, OPTION]],
  DOWN:  [DOWN,  [CONTROL, OPTION]],
  // --------------------------
  TOP_LEFT:     ['ů', [CONTROL, OPTION]],
  TOP_RIGHT:    ['§', [CONTROL, OPTION]],
  BOTTOM_LEFT:  ['.', [CONTROL, OPTION]],
  BOTTOM_RIGHT: ['-', [CONTROL, OPTION]],
  // --------------------------
  LEFT_THIRD:      ['j', [CONTROL, OPTION]],
  LEFT_TWO_THIRDS: ['u', [CONTROL, OPTION]],
  CENTER_THIRD:    ['k', [CONTROL, OPTION]],
  RIGHT_TWO_THIRD: ['o', [CONTROL, OPTION]],
  RIGHT_THIRD:     ['l', [CONTROL, OPTION]],
  // --------------------------
  NEXT_DISPLAY:     null,
  PREVIOUS_DISPLAY: null,
  // --------------------------

  MAXIMIZE: [RETURN, [CONTROL, OPTION]],
  CENTER:   null,
  RESTORE:  null,
}

const MagnetDefinitions = {
  LEFT: (screenFrame) => ({
    x: 0,
    y: 0,
    width: screenFrame.width / 2,
    height: screenFrame.height
  }),
  RIGHT: (screenFrame) => ({
    x: screenFrame.width / 2,
    y: 0,
    width: screenFrame.width / 2,
    height: screenFrame.height
  }),
  UP: (screenFrame) => ({
    x: 0,
    y: 0,
    width: screenFrame.width,
    height: screenFrame.height / 2
  }),
  DOWN: (screenFrame) => ({
    x: 0,
    y: screenFrame.height / 2,
    width: screenFrame.width,
    height: screenFrame.height / 2
  }),
  // --------------------------
  TOP_LEFT: (screenFrame) => ({
    x: 0,
    y: 0,
    width: screenFrame.width / 2,
    height: screenFrame.height / 2
  }),
  TOP_RIGHT: (screenFrame) => ({
    x: screenFrame.width / 2,
    y: 0,
    width: screenFrame.width / 2,
    height: screenFrame.height / 2
  }),
  BOTTOM_LEFT: (screenFrame) => ({
    x: 0,
    y: screenFrame.height / 2,
    width: screenFrame.width / 2,
    height: screenFrame.height / 2
  }),
  BOTTOM_RIGHT: (screenFrame) => ({
    x: screenFrame.width / 2,
    y: screenFrame.height / 2,
    width: screenFrame.width / 2,
    height: screenFrame.height / 2
  }),
  // --------------------------
  LEFT_THIRD: (screenFrame) => ({
    x: 0,
    y: 0,
    width: screenFrame.width / 3,
    height: screenFrame.height
  }),
  LEFT_TWO_THIRDS: (screenFrame) => ({
    x: 0,
    y: 0,
    width: screenFrame.width / 3 * 2,
    height: screenFrame.height
  }),
  CENTER_THIRD: (screenFrame) => ({
    x: screenFrame.width / 3,
    y: 0,
    width: screenFrame.width / 3,
    height: screenFrame.height
  }),
  RIGHT_TWO_THIRD: (screenFrame) => ({
    x: screenFrame.width / 3,
    y: 0,
    width: screenFrame.width / 3 * 2,
    height: screenFrame.height
  }),
  RIGHT_THIRD: (screenFrame) => ({
    x: screenFrame.width / 3 * 2,
    y: 0,
    width: screenFrame.width / 3,
    height: screenFrame.height
  }),
  // --------------------------
  NEXT_DISPLAY: () => {},
  PREVIOUS_DISPLAY: () => {},
  // --------------------------

  MAXIMIZE: (screenFrame) => ({
    x: 0,
    y: 0,
    width: screenFrame.width,
    height: screenFrame.height
  }),
  CENTER: () => {},
  RESTORE: () => {},
}

Object.keys(Magnet).forEach(magnetOperation => {
  const keybinds = Magnet[magnetOperation]

  if(keybinds) {
    Key.on(
      Magnet[magnetOperation][0],
      Magnet[magnetOperation][1],
      () => {
        const win = Window.focused()
        win.setFrame(MagnetDefinitions[magnetOperation](getScreenFrame()))
      }
    )
  }
})

function getScreenFrame() {
  return Screen.main().frame()
}