Removed VFC (#2804)

- removed usage of VFC since it will be removed in next kotlin-wrappers release

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/App.kt

@@ -33,7 +33,7 @@ import kotlinx.serialization.json.Json
 @JsExport
 @OptIn(ExperimentalJsExport::class)
 @Suppress("VARIABLE_NAME_INCORRECT_FORMAT", "NULLABLE_PROPERTY_TYPE", "EMPTY_BLOCK_STRUCTURE_ERROR")
-val App: VFC = FC {
+val App: FC<Props> = FC {
     val (userInfo, setUserInfo) = useState<UserInfo?>(null)
     useRequest {
         get(

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/Footer.kt

@@ -16,7 +16,7 @@ import web.cssom.ClassName
 @JsExport
 @OptIn(ExperimentalJsExport::class)
 @Suppress("EMPTY_BLOCK_STRUCTURE_ERROR")
-val footer: VFC = VFC {
+val footer: FC<Props> = FC {
     footer {
         className = ClassName("sticky-footer bg-white")
         div {

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/CookieBanner.kt

@@ -12,14 +12,14 @@ import com.saveourtool.save.frontend.utils.buttonBuilder
 import com.saveourtool.save.validation.FrontendRoutes
 import js.core.jso
 import react.FC
-import react.VFC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.router.useNavigate
 import react.useState
 import web.cssom.ClassName
 import web.cssom.ZIndex
 
-val cookieBanner: VFC = FC {
+val cookieBanner: FC<Props> = FC {
     val (isOpen, setIsOpen) = useState(!cookie.isAccepted())
     val navigate = useNavigate()
     val (t) = useTranslation("cookies")

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/LanguageSelector.kt

@@ -11,7 +11,7 @@ import com.saveourtool.save.frontend.externals.i18next.language
 import com.saveourtool.save.frontend.externals.i18next.useTranslation
 import js.core.jso
 import react.FC
-import react.VFC
+import react.Props
 import react.dom.aria.AriaHasPopup
 import react.dom.aria.ariaExpanded
 import react.dom.aria.ariaHasPopup
@@ -29,7 +29,7 @@ private const val LANG_DROPDOWN_ID = "lang-dropdown"
 /**
  * A [FC] that is responsible for language selection
  */
-val languageSelector: VFC = FC {
+val languageSelector: FC<Props> = FC {
     val (_, i18n) = useTranslation("topbar")
     val languageFromCookie = if (cookie.isAccepted()) {
         PlatformLanguages.getByCodeOrDefault(cookie.getLanguageCode())

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/TestStatusComponent.kt

@@ -14,7 +14,8 @@ import com.saveourtool.save.frontend.components.tables.visibleColumnsCount
 import com.saveourtool.save.frontend.externals.fontawesome.faExternalLinkAlt
 import com.saveourtool.save.frontend.utils.buttonBuilder
 
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.samp
 import react.dom.html.ReactHTML.small
 import react.dom.html.ReactHTML.td
@@ -40,7 +41,7 @@ fun testStatusComponent(
     testResultDebugInfo: TestResultDebugInfo,
     tableInstance: Table<TestExecutionExtDto>,
     testExecutionDto: TestExecutionDto,
-) = VFC {
+): FC<Props> = FC {
     val shortMessage: String = when (val status: TestStatus = testResultDebugInfo.testStatus) {
         is Pass -> (status.shortMessage ?: "").ifBlank { "Completed successfully without additional information" }
         is Fail -> status.shortReason
@@ -120,7 +121,7 @@ fun testStatusComponent(
 fun <D : Any> executionStatusComponent(
     failReason: String,
     tableInstance: Table<D>
-) = VFC {
+): FC<Props> = FC {
     tr {
         td {
             colSpan = 2

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/VulnerabilityIntroductionComponent.kt

@@ -6,14 +6,14 @@ import com.saveourtool.save.frontend.components.views.vuln.columnHeight
 import com.saveourtool.save.frontend.externals.i18next.useTranslation
 import js.core.jso
 import react.FC
-import react.VFC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.img
 import react.dom.html.ReactHTML.strong
 import web.cssom.ClassName
 
 @Suppress("IDENTIFIER_LENGTH")
-val vulnerabilityIntroductionComponent: VFC = FC {
+val vulnerabilityIntroductionComponent: FC<Props> = FC {
     val (t) = useTranslation("vulnerability-collection")
     div {
         className = ClassName("card flex-md-column box-shadow")

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/demo/welcome/DemoIntroductionComponent.kt

@@ -7,7 +7,8 @@ package com.saveourtool.save.frontend.components.basic.demo.welcome
 import com.saveourtool.save.frontend.components.basic.markdown
 
 import js.core.jso
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.img
 import react.dom.html.ReactHTML.strong
@@ -33,7 +34,7 @@ private val saveDemoHowToMd = """
 """.trimMargin()
 
 @Suppress("MAGIC_NUMBER")
-internal val introductionSection = VFC {
+internal val introductionSection: FC<Props> = FC {
     div {
         className = ClassName("card flex-md-column mb-1 box-shadow")
         style = jso { minHeight = 25.rem }

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/demo/welcome/DemoListComponent.kt

@@ -11,7 +11,8 @@ import com.saveourtool.save.frontend.utils.*
 import com.saveourtool.save.frontend.utils.noopLoadingHandler
 
 import js.core.jso
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.input
 import react.dom.html.ReactHTML.ul
@@ -25,7 +26,7 @@ import kotlinx.serialization.json.Json
 
 private val withBackground = cardComponent(isBordered = true, hasBg = true, isPaddingBottomNull = true)
 
-val demoList = VFC {
+val demoList: FC<Props> = FC {
     val (filter, setFilter) = useState(DemoFilter.running)
 
     val (demoDtos, setDemoDtos) = useState<List<DemoDto>>(emptyList())

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/demo/welcome/DemoStatistics.kt

@@ -8,15 +8,16 @@ import com.saveourtool.save.frontend.utils.*
 import com.saveourtool.save.frontend.utils.noopLoadingHandler
 import com.saveourtool.save.frontend.utils.noopResponseHandler
 
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.h1
 import react.dom.html.ReactHTML.strong
 import react.useState
 import web.cssom.ClassName
 
 @Suppress("TOO_LONG_FUNCTION", "LongMethod")
-internal val statistics = VFC {
+internal val statistics: FC<Props> = FC {
     val (activeDemoAmount, setActiveDemoAmount) = useState(0)
     useRequest {
         val active: Int = get(

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/demo/welcome/FeaturedDemos.kt

@@ -10,7 +10,8 @@ import com.saveourtool.save.frontend.components.basic.carousel
 import com.saveourtool.save.frontend.utils.*
 import com.saveourtool.save.frontend.utils.noopResponseHandler
 
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.h1
 import react.dom.html.ReactHTML.h3
@@ -21,7 +22,7 @@ import react.useEffect
 import react.useState
 import web.cssom.ClassName
 
-internal val featuredDemos = VFC {
+internal val featuredDemos: FC<Props> = FC {
     val (featuredDemos, setFeaturedDemos) = useState(
         listOf(
             DemoDto.emptyForProject("saveourtool", "Diktat"),

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/basic/fileuploader/CosvFileManagerComponent.kt

@@ -47,7 +47,7 @@ import kotlinx.serialization.json.Json
 
 private const val DEFAULT_SIZE = 10
 
-val cosvFileManagerComponent: FC<Props> = FC { _ ->
+val cosvFileManagerComponent: FC<Props> = FC {
     useTooltip()
     val (t) = useTranslation("vulnerability-upload")
 

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/mobile/SaveWelcomeMobileView.kt

@@ -14,7 +14,8 @@ import com.saveourtool.save.frontend.utils.particles
 
 import js.core.jso
 import react.ChildrenBuilder
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.b
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.h4
@@ -24,7 +25,7 @@ import web.cssom.*
 /**
  * As a temp stub it was decided to make several views to make SAVE looking nice on mobile devices
  */
-val saveWelcomeMobileView: VFC = VFC {
+val saveWelcomeMobileView: FC<Props> = FC {
     div {
         style = jso {
             background = SAVE_LIGHT_GRADIENT.unsafeCast<Background>()

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/CreateOrganizationView.kt

@@ -33,7 +33,7 @@ import web.html.ButtonType
 import kotlinx.serialization.encodeToString
 import kotlinx.serialization.json.Json
 
-val createOrganizationView = VFC {
+val createOrganizationView: FC<Props> = FC {
     useBackground(Style.SAVE_DARK)
     particles()
 

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/CreateProjectView.kt

@@ -46,7 +46,7 @@ import kotlinx.serialization.json.Json
 
 private val organizationSelectForm: SelectFormFunctionalComponent = selectFormRequired()
 
-val createProjectView = VFC {
+val createProjectView: FC<Props> = FC {
     useBackground(Style.SAVE_DARK)
     particles()
     val params = useParams()

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/SandboxView.kt

@@ -38,7 +38,7 @@ val sandboxApiUrl = "${window.location.origin}/api/sandbox"
 /**
  * A view for testing config files
  */
-val sandboxView = VFC {
+val sandboxView: FC<Props> = FC {
     useBackground(Style.SAVE_DARK)
     val (debugInfo, setDebugInfo) = useState<TestResultDebugInfo?>(null)
     val (selectedSdk, setSelectedSdk) = useState<Sdk>(Sdk.Default)

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/TestExecutionDetailsView.kt

@@ -30,7 +30,7 @@ import web.cssom.ClassName
  * @return a function component
  */
 @Suppress("GENERIC_VARIABLE_WRONG_DECLARATION", "TOO_LONG_FUNCTION")
-val testExecutionDetailsView = VFC {
+val testExecutionDetailsView: FC<Props> = FC {
     val (status, setStatus) = useState("Loading...")
     val (testResultDebugInfo, setTestResultDebugInfo) = useState<TestResultDebugInfo?>(null)
 

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/agreements/CookiesTermsOfUse.kt

@@ -11,11 +11,11 @@ import com.saveourtool.save.frontend.utils.Style
 import com.saveourtool.save.frontend.utils.buttonBuilder
 import com.saveourtool.save.frontend.utils.useBackground
 import react.FC
-import react.VFC
+import react.Props
 import react.dom.html.ReactHTML.div
 import web.cssom.ClassName
 
-val cookieTermsOfUse: VFC = FC {
+val cookieTermsOfUse: FC<Props> = FC {
     useBackground(Style.INDEX)
     val (t) = useTranslation("cookies")
     div {

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/agreements/TermsOfUsage.kt

@@ -7,7 +7,8 @@ package com.saveourtool.save.frontend.components.views.agreements
 import com.saveourtool.save.frontend.components.basic.markdown
 import com.saveourtool.save.frontend.utils.Style
 import com.saveourtool.save.frontend.utils.useBackground
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import web.cssom.ClassName
 
@@ -129,7 +130,7 @@ private val termsOfUsageContent = listOf(
     generalProvisions,
 )
 
-val termsOfUsageView: VFC = VFC {
+val termsOfUsageView: FC<Props> = FC {
     useBackground(Style.INDEX)
 
     div {

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/ContestListCard.kt

@@ -32,7 +32,7 @@ import web.html.ButtonType
 /**
  * [FC] that renders the stylish table with contests
  */
-val contestList = VFC {
+val contestList: FC<Props> = FC {
     val (isContestEnrollerModalOpen, setIsContestEnrollerModalOpen) = useState(false)
     val (isConfirmationModalOpen, setIsConfirmationModalOpen) = useState(false)
     val (enrollmentResponseString, setEnrollmentResponseString) = useState("")

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/ContestSampleListCard.kt

@@ -11,7 +11,7 @@ import com.saveourtool.save.frontend.utils.*
 import com.saveourtool.save.validation.FrontendRoutes
 import react.FC
 import react.Fragment
-import react.VFC
+import react.Props
 import react.create
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.td
@@ -45,7 +45,7 @@ private val contestSampleTable: FC<TableProps<ContestSampleDto>> = tableComponen
     useServerPaging = false,
 )
 
-internal val contestSampleList = VFC {
+internal val contestSampleList: FC<Props> = FC {
     div {
         className = ClassName("col")
         div {

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/ContestsStatistics.kt

@@ -9,15 +9,16 @@ import com.saveourtool.save.frontend.utils.*
 
 import js.core.jso
 import react.ChildrenBuilder
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.h1
 import react.dom.html.ReactHTML.strong
 import react.useState
 import web.cssom.ClassName
 import web.cssom.rem
 
-internal val statistics = VFC {
+internal val statistics: FC<Props> = FC {
     val (activeContests, setActiveContests) = useState<Set<ContestDto>>(emptySet())
     useRequest {
         val contests: List<ContestDto> = get(

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/CreateContestTemplateView.kt

@@ -10,7 +10,8 @@ import com.saveourtool.save.frontend.components.inputform.inputTextFormRequired
 import com.saveourtool.save.frontend.utils.*
 import com.saveourtool.save.validation.FrontendRoutes
 
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.aria.ariaDescribedBy
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.form
@@ -29,7 +30,7 @@ import web.html.InputType
 import kotlinx.serialization.encodeToString
 import kotlinx.serialization.json.Json
 
-val createContestTemplateView: VFC = VFC {
+val createContestTemplateView: FC<Props> = FC {
     useBackground(Style.SAVE_DARK)
 
     val (contestTemplate, setContestTemplate) = useState(ContestSampleDto.empty)

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/CreateNewContestTemplate.kt

@@ -4,14 +4,15 @@ package com.saveourtool.save.frontend.components.views.contests
 
 import com.saveourtool.save.validation.FrontendRoutes
 import js.core.jso
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.h3
 import react.dom.html.ReactHTML.img
 import react.router.dom.Link
 import web.cssom.*
 
-internal val createNewContestTemplate = VFC {
+internal val createNewContestTemplate: FC<Props> = FC {
     div {
         className = ClassName("col-2 text-center")
         Link {

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/FeaturedContests.kt

@@ -27,7 +27,7 @@ import web.cssom.*
 import web.html.ButtonType
 
 @Suppress("MAGIC_NUMBER")
-internal val featuredContests = VFC {
+internal val featuredContests: FC<Props> = FC {
     val (featuredContests, setFeaturedContests) = useState<List<ContestDto>>(emptyList())
     useRequest {
         val contests: List<ContestDto> = get(

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/GlobalRating.kt

@@ -32,7 +32,7 @@ private const val MAX_AMOUNT_OF_RECORDS = 3
 /**
  * @return functional component for the rating card
  */
-internal val globalRating = VFC {
+internal val globalRating: FC<Props> = FC {
     val (selectedTab, setSelectedTab) = useState(UserRatingTab.ORGS)
 
     val (organizationsWithRating, setOrganizationsWithRating) = useState<Set<OrganizationWithRating>>(emptySet())

save-frontend/src/main/kotlin/com/saveourtool/save/frontend/components/views/contests/NewContests.kt

@@ -8,7 +8,8 @@ import com.saveourtool.save.entities.contest.ContestDto
 import com.saveourtool.save.frontend.utils.*
 
 import js.core.jso
-import react.VFC
+import react.FC
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.h3
 import react.dom.html.ReactHTML.img
@@ -22,7 +23,7 @@ import web.cssom.rem
 /**
  * rendering of newly added contests
  */
-internal val newContests = VFC {
+internal val newContests: FC<Props> = FC {
     val (newContests, setNewContests) = useState<List<ContestDto>>(emptyList())
     useRequest {
         val contests: List<ContestDto> = get(