next jsでuseStateを使うと無限ループになってしまいます

前提・実現したいこと

next jsでtypescriptを使って、startAtとendAtを
現在が17月の場合 -> starAtを前年8月、endAtを今年の7月
現在が812月の場合 ->starAtを今年の8月、endAtを来年の7月
にしたいです。

エラーメッセージ

Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.
と無限ループになりエラーになっています。

試したこと

ネットで調べたら関数にしたらいいと書いてあってやってみたのですが、ダメでした

typescript
1function axx() {
2        setStartAt(
3            DateTime.local()
4                .set({ month: 8 })
5                .minus({ year: 1 })
6                .toJSDate(),
7        );
8        setEndAt(
9            DateTime.local()
10                .set({ month: 7 })
11                .toJSDate(),
12        );
13    }
14    if (1 <= nowMonth && nowMonth <= 7) {
15        axx();
16    }

該当のソースコード

typescript
1import React, { useState, useEffect } from 'react';
2import { DateTime } from 'luxon';
3
4export default function Index() {
5const [startAt, setStartAt] = useState(
6        startOfMonth(
7            DateTime.local()
8                .set({ month: 8 })
9                .toJSDate(),
10        ),
11    );
12    const [endAt, setEndAt] = useState(
13        endOfMonth(
14            DateTime.local()
15                .set({ month: 7 })
16                .plus({ year: 1 })
17                .toJSDate(),
18        ),
19    );
20const nowMonth =
21        DateTime.local()
22            .toJSDate()
23            .getMonth() + 1;
24
25if (1 <= nowMonth && nowMonth <= 7) {
26        setStartAt(
27            DateTime.local()
28                .set({ month: 8 })
29                .minus({ year: 1 })
30                .toJSDate(),
31        );
32        setEndAt(
33            DateTime.local()
34                .set({ month: 7 })
35                .toJSDate(),
36        );
37    }
38return(
39<input type='month value={strtAt}/>
40<input type='month value={endAt}/>
41)
42}

行動規範の内容に同意します

回答1件

自己解決

typesript
1useEffect(() => {
2        if (1 <= nowMonth && nowMonth <= 7) {
3            setStartAt(
4                DateTime.local()
5                    .set({ month: 8 })
6                    .minus({ year: 1 })
7                    .toJSDate(),
8            );
9            setEndAt(
10                DateTime.local()
11                    .set({ month: 7 })
12                    .toJSDate(),
13            );
14        }
15    }, []);