Hello I'm a pretty new programmer working on a project where I'm trying to fill a pond with different color fish. I've drawn 7 gifs for 7 different fish. I uploaded them to an assets folder and used a loop to store them into an array.

Now, the code will display the different fish at random as I wanted but they are still images instead of animated gifs. (which works if I only upload/reference one gif at a time). Anyone have any ideas about why this might be happening/how to fix it? Thanks so much! Code below for setup()

let school = [];
let fishes = [];

function preload() {
  // koi = loadImage("assets/fish5.gif");
  for (let i = 1; i < 8; i++) {
    fishes[i] = loadImage("assets/fish" + i + ".gif");
  }
}

function setup() {
  createCanvas(840, 560);
  // let fish = random(fishes);
  for (let i = 0; i < 30; i++) school.push(new Fish());
}

function draw() {
  background(132, 209, 220);
  for (let fish of school) {
    fish.edges();
    fish.school(school);
    fish.update();
    fish.show();
  }
}

Image of what i'm getting below