prettier-vscode icon indicating copy to clipboard operation
prettier-vscode copied to clipboard

prettier extremly load my cpu and show infinity saving file with 'prettier code formatter'

Open nicitaacom opened this issue 1 year ago • 19 comments

You asked me about some additionl info - I got this here it is

"use client"

import Image from "next/image"
import { useState } from "react"
import { Carousel } from "react-responsive-carousel"
import "react-responsive-carousel/lib/styles/carousel.min.css"

import { AiFillCaretRight, AiFillCaretLeft } from "react-icons/ai"
import { twMerge } from "tailwind-merge"

interface SliderProps {
  images: string[]
  title: string
  className?: string
  containerClassName?: string
}

export function Slider({ images, title, className = "", containerClassName = "" }: SliderProps) {
  const [currentIndex, setCurrentIndex] = useState(0)
  const [isMoving, setIsMoving] = useState(false)
  const [direction, setDirection] = useState("")

  const goToPreviousSlide = () => {
    if (!isMoving) {
      setIsMoving(true)
      setDirection("left")
      setTimeout(() => {
        setCurrentIndex(prev => (prev === 0 ? images.length - 1 : prev - 1))
        setIsMoving(false)
      }, 300)
    }
  }

  const goToNextSlide = () => {
    if (!isMoving) {
      setIsMoving(true)
      setDirection("right")
      setTimeout(() => {
        setCurrentIndex(prev => (prev === images.length - 1 ? 0 : prev + 1))
        setIsMoving(false)
      }, 300)
    }
  }

  return (
    <figure className={twMerge(`relative w-full laptop:w-fit ${containerClassName}`)}>
      <Carousel
        showArrows={true}
        showIndicators={false}
        showStatus={false}
        showThumbs={false}
        width={480}
        ariaLabel="ariaLabelTest"
        axis="horizontal"
        emulateTouch={true}
        dynamicHeight={true}
        renderArrowNext={() => (
          <button className="absolute z-[88] top-0 bottom-0 left-0 w-[40px] bg-[rgba(0,0,0,0.4)] flex justify-center items-center"/>
        )}>
        {images.map((image, index) => (
          <Image
            className="w-[720px] h-[300px] object-cover"
            src={image}
            alt="image"
            width={360}
            height={180}
            key={index}
          />
        ))}
      </Carousel>
      {/* <button
        aria-label="next slide / item"
        className="absolute z-[88] top-0 bottom-0 left-0 w-[40px] bg-[rgba(0,0,0,0.4)] flex justify-center items-center"
        onClick={goToPreviousSlide}>
        <AiFillCaretLeft className="h-6 w-6 text-white" />
      </button>
      <button
        aria-label="next slide / item"
        className="absolute z-[88] top-0 bottom-0 right-0 w-[40px] bg-[rgba(0,0,0,0.4)] flex justify-center items-center"
        onClick={goToNextSlide}>
        <AiFillCaretRight className="h-6 w-6 text-white" />
      </button> */}
    </figure>
  )
}

I got this modifying this line

  renderArrowNext={() => (
          <button className="absolute z-[88] top-0 bottom-0 left-0 w-[40px] bg-[rgba(0,0,0,0.4)] flex justify-center items-center"/>
        )}>

just make this button as self-closing tag and just like normal button

nicitaacom avatar Nov 29 '23 15:11 nicitaacom

image

Same here. I'm not exactly sure why this issue is occurring. It seems to happen randomly, and I'm having difficulty pinpointing the exact cause.

Vegatality avatar Dec 07 '23 11:12 Vegatality

It seems to happen randomly

I agree with that

So please authors don't ask us to reproduce it cause it happens randomly

nicitaacom avatar Dec 08 '23 09:12 nicitaacom

This issue has been labeled as stale due to inactivity. Reply to keep this issue open.

github-actions[bot] avatar Feb 07 '24 01:02 github-actions[bot]

This issue has been labeled as stale due to inactivity. Reply to keep this issue open.

Reply to keep this issue open

nicitaacom avatar Feb 07 '24 03:02 nicitaacom

Is prettier optimized for monorepos? I'm having the same problem intermittently.

zackarydev avatar Feb 29 '24 16:02 zackarydev

I am getting this too. Mostly on bigger projects/monorepos. Small projects are usually fine. Anyway size of the project should not matter when formatting currently selected file. Prettier extension is doing something it should not be.

capaj avatar Mar 25 '24 14:03 capaj

Facing a similar issue - takes ages to format on save

rookledookle avatar Apr 10 '24 10:04 rookledookle

This issue has been labeled as stale due to inactivity. Reply to keep this issue open.

github-actions[bot] avatar Aug 16 '24 01:08 github-actions[bot]

Still open

nicitaacom avatar Aug 16 '24 06:08 nicitaacom