Create function that uses a speed vector of an object to determine if collision occurs with a rectangle and if so, what side of the rectangle

I am making a brick breaker game in Javascript and am trying to improve the collision test function. I want to know how I can use a vector of the ball speed to determine if the ball hits the brick and which face of the brick was hit, so I can change the speed of either the x or y value of the ball accordingly.

I think that if I create a variable that tracks the x and y values of the center of the ball then I can better test if a collision occurred.

for example, if the ball speed is 4 units in the x and 5 units in the y every time the game function updates, the

xVector = 4 * time + (starting x value since last collision)

and the

yVector = 5 * time + (starting y value since last collision)

If I reset the time after every collision takes place then I should be able to predict which brick, if any, the ball will hit, right after the previous collision occurs.

I think I can make this function and update the time with the game(deltaTime), by creating a time variable and time++ after each game iteration. But that doesn't look into the future, it only looks at what is currently happening.

How can I predict which brick will be hit next, right after a collision occurs?

Honestly I don't know if this is a good idea for a collision test function, but I figured that if I know what brick will be hit, and I know how long it will take to be hit, then I can simply have the brick removed at that time instance. Instead of worrying about setting parameters for the x and y values of the ball to intersect with the bricks x and y values, then deleting the brick after they intersect, I thought this might be more accurate. I'm not sure though.

I tried the alternative method I just described and had difficulty getting rid of some bugs (see my previous question), so I thought I would try a different approach altogether.

Does anyone have any thoughts or ideas?