Image in painsComponent only shows tiny left top corner of the full image

Question

I have a program that should load 2 panels next to each other. On one I show a grid of 10x10 images using an array of panels:

private JPanel imagePanels[][] = new JPanel[10][10];

Then I load a custom panel with the image like this:

imagePanels[i][j] = new ImagePanel("https://i.stack.imgur.com/W3RMa.jpg",Color.WHITE);

This is the Image I tried to load (32x32 pixels):

ImagePanel:

public class ImagePanel extends JPanel{
    private BufferedImage image;
    public ImagePanel(String path,Color background){ //TODO!!:set background color
        try{
            URL url = new URL(path);
            image =  = ImageIO.read(url);
        }catch(IOException ex){
            System.out.println("Image Not Found");
        }
    }
    @Override
    protected void paintComponent(Graphics g){
        super.paintComponents(g);
        g.drawImage(image,0,0,null);
    }
}

This works and the panel shows the 32x32 pixel image that I passed it. Now I want to display another image inside another panel. I decided to use the ImagePanel class as a GoTo class for loading images on panels throughout the program. So I made another class for the second panel:

public class LeftPlayerPanel extends JPanel{
    private JPanel PlayerPicturePanel = new ImagePanel("https://i.stack.imgur.com/sjfvC.jpg",Color.GRAY);
    public LeftPlayerPanel(Player thisPlayer){
        this.add(PlayerPicturePanel);
        //TODO!!:Display Player Stats
    }

}

This is the image that I tried to load this time (128x128 pixels):

The program however looks like this:

As you can see the right side works fine showing the entire image 100 times.(don't worry about the red dot. that's what it's supposed to do) but on the left of the program the image only shows up partially (a little bit of the left top corner.)

Can there be a problem in my layout? Do I have to make another class for each image? Or for each image size? is this happening because I use a SplitPane?

Here is the class that displays the stuff:

public class test {
    private static Positition p;
    public static void main(String[] v){
        Field f = new Field(2, 100);
        p = f.getRandomFieldPosition();
        printPosition(p);

        JPanel panel = new FieldPanel(p); 
        JPanel player = new LeftPlayerPanel(null);// add player later
        JFrame f1 = new TestFrame("TESTFRAME");

        panel.setPreferredSize(new Dimension(326,309));
        player.setPreferredSize(new Dimension(135,309));

        JSplitPane splitpane = new JSplitPane(JSplitPane.HORIZONTAL_SPLIT,player,panel);


        JPanel content = new JPanel();
        content.setLayout(new BorderLayout());
        content.add(splitpane,BorderLayout.CENTER);

        f1.setContentPane(content);
        f1.setPreferredSize(new Dimension(326+135,309));
        f1.pack();
        f1.show();
    }
}

ps. I'm still working on the exact sizing of the program and the size of each panel. I know that the way it's displayed now it's not going to fit but I also tried sliding the SplitPane to the right to make the panel bigger.

EDIT: I made a version that has all the important stuff in one file but I can't test it because i'm on a proxy and it won't load the images here. (I think I got the url right.)

URL for the LeftPlayerPanel: https://i.stack.imgur.com/sjfvC.jpg

URL for the LoadSquare method: https://i.stack.imgur.com/W3RMa.jpg